@charset "UTF-8";
/* =================================================================
   1. [SCSS Variables] Raw Data Definition
   * 이곳은 '순수 값'만 정의합니다. 실제 코드에서는 사용하지 않는 것을 권장합니다.
   * 브랜드 컬러 코드가 바뀌면 여기만 수정하세요.
   ================================================================= */
/* 드롭다운,멀티포함 */
/**
 * @mixin responsive
 * 모바일 시안(375px) 기준의 수치를 입력받아 모바일~태블릿 구간을 처리합니다.
 * @param $property : CSS 속성 (font-size, margin, padding 등)
 * @param $values : 적용할 값 (375px 시안 기준 px값 입력)
 * * [구간별 동작]
 * 1. Mobile (~767px): 375px 기준 VW 단위 (화면 폭에 비례하여 유동적 스케일링)
 * 2. Tablet (768px ~ 1199px): REM 단위 (가독성 유지를 위해 폰트 베이스로 고정)
 * 3. PC (1200px~): PX 단위 (원래는 고정되나, 보통 이 구간부터는 pc-scale 믹스인으로 덮어씀)
 */
/**
 * @mixin pc-scale
 * PC 시안(1400px) 기준의 수치를 입력받아 노트북 배율 환경에 대응합니다.
 * @param $property : CSS 속성
 * @param $value : 적용할 값 (1400px 시안 기준 px값 입력)
 * * [구간별 동작]
 * 1. Laptop (1200px ~ 1439px): 1400px 기준 VW 단위 적용. (노트북 150% 배율 등에서 가로 스크롤 없이 축소됨)
 * 2. Desktop (1400px~): 시안 원본 PX 단위로 완벽하게 고정.
 */
.container {
  width: 100%;
  height: auto;
}

.main-visual {
  position: relative;
  z-index: 1;
  width: 100%;
  overflow: hidden;
  height: 216.5333vw;
}
@media (min-width: 640px) {
  .main-visual {
    height: 50.75rem;
  }
}
@media (min-width: 1200px) {
  .main-visual {
    height: 812px;
  }
}
@media screen and (min-width: 1200px) {
  .main-visual {
    height: 71.4286vw;
    border-radius: 0 0 8.5714vw 0;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .main-visual {
    height: 1000px;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .main-visual {
    border-radius: 0 0 120px 0;
  }
}
.main-visual .main-visual-swiper {
  width: 100%;
  height: 100%;
}
.main-visual .swiper-slide {
  position: relative;
  width: 100%;
  height: 100%;
}
.main-visual .swiper-slide .bg-img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  transform: scale(1.05);
  transition: transform 6s ease;
}
.main-visual .swiper-slide .bg-img:before {
  content: "";
  display: none;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  background: linear-gradient(90deg, rgba(55, 53, 46, 0.8) 5%, rgba(55, 53, 46, 0.3) 60%, rgba(55, 53, 46, 0) 100%);
  height: 117.3333vw;
}
@media (min-width: 640px) {
  .main-visual .swiper-slide .bg-img:before {
    height: 27.5rem;
  }
}
@media (min-width: 1200px) {
  .main-visual .swiper-slide .bg-img:before {
    height: 440px;
  }
}
@media screen and (min-width: 768px) {
  .main-visual .swiper-slide .bg-img:before {
    display: block;
    background: linear-gradient(90deg, rgba(55, 53, 46, 0.8) 5%, rgba(55, 53, 46, 0.3) 60%, rgba(55, 53, 46, 0) 100%);
    height: 266.6667vw;
  }
}
@media screen and (min-width: 768px) and (min-width: 640px) {
  .main-visual .swiper-slide .bg-img:before {
    height: 62.5rem;
  }
}
@media screen and (min-width: 768px) and (min-width: 1200px) {
  .main-visual .swiper-slide .bg-img:before {
    height: 1000px;
  }
}
.main-visual .swiper-slide.swiper-slide-active .bg-img {
  transform: scale(1);
}
.main-visual .swiper-slide .inner {
  position: relative;
  width: 100%;
  height: 100%;
  margin: 0 auto;
  padding: 0 20px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  padding-top: 42.6667vw;
}
@media (min-width: 640px) {
  .main-visual .swiper-slide .inner {
    padding-top: 10rem;
  }
}
@media (min-width: 1200px) {
  .main-visual .swiper-slide .inner {
    padding-top: 160px;
  }
}
@media screen and (min-width: 1200px) {
  .main-visual .swiper-slide .inner {
    padding-left: 0;
    padding-right: 0;
    max-width: 100vw;
    padding-top: 22.8571vw;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .main-visual .swiper-slide .inner {
    max-width: 1400px;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .main-visual .swiper-slide .inner {
    padding-top: 320px;
  }
}
.main-visual .swiper-slide .text-box {
  opacity: 0;
  transform: translateY(30px);
  transition: all 1s ease 0.5s;
}
.main-visual .swiper-slide .text-box .title {
  color: var(--WHITE, #FFF);
  font-family: MaruBuri, sans-serif;
  font-weight: 400;
  letter-spacing: -2.24px;
  text-shadow: 0 0 14px rgba(0, 0, 0, 0.32);
  line-height: 1.4;
  font-size: 10.6667vw;
}
@media (min-width: 640px) {
  .main-visual .swiper-slide .text-box .title {
    font-size: 2.5rem;
  }
}
@media (min-width: 1200px) {
  .main-visual .swiper-slide .text-box .title {
    font-size: 40px;
  }
}
.main-visual .swiper-slide .text-box .title {
  margin-bottom: 12.8vw;
}
@media (min-width: 640px) {
  .main-visual .swiper-slide .text-box .title {
    margin-bottom: 3rem;
  }
}
@media (min-width: 1200px) {
  .main-visual .swiper-slide .text-box .title {
    margin-bottom: 48px;
  }
}
@media screen and (min-width: 1200px) {
  .main-visual .swiper-slide .text-box .title {
    font-size: 4vw;
    margin-bottom: 4vw;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .main-visual .swiper-slide .text-box .title {
    font-size: 56px;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .main-visual .swiper-slide .text-box .title {
    margin-bottom: 56px;
  }
}
.main-visual .swiper-slide .text-box .title strong {
  font-weight: 700;
}
.main-visual .swiper-slide .text-box .desc {
  color: var(--WHITE, #FFF);
  font-weight: 500;
  line-height: 1.5;
  text-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
  font-size: 5.3333vw;
}
@media (min-width: 640px) {
  .main-visual .swiper-slide .text-box .desc {
    font-size: 1.25rem;
  }
}
@media (min-width: 1200px) {
  .main-visual .swiper-slide .text-box .desc {
    font-size: 20px;
  }
}
@media screen and (min-width: 1200px) {
  .main-visual .swiper-slide .text-box .desc {
    font-size: 1.7143vw;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .main-visual .swiper-slide .text-box .desc {
    font-size: 24px;
  }
}
.main-visual .swiper-slide.swiper-slide-active .text-box {
  opacity: 1;
  transform: translateY(0);
}
.main-visual .swiper-slide.visual-01 .bg-img {
  background: url("/static/images/main/main_visual_1@m.jpg") no-repeat center center;
  background-size: cover;
}
@media screen and (min-width: 768px) {
  .main-visual .swiper-slide.visual-01 .bg-img {
    background: url("/static/images/main/main_visual_1.jpg") no-repeat center center;
    background-size: cover;
  }
}
@media screen and (min-width: 1921px) {
  .main-visual .swiper-slide.visual-01 .bg-img {
    background: url("/static/images/main/main_visual_1@2x.jpg") no-repeat center center;
    background-size: cover;
  }
}
.main-visual .swiper-slide.visual-02 .bg-img {
  background: url("/static/images/main/main_visual_2@m.jpg") no-repeat center center;
  background-size: cover;
}
@media screen and (min-width: 768px) {
  .main-visual .swiper-slide.visual-02 .bg-img {
    background: url("/static/images/main/main_visual_2.jpg") no-repeat center center;
    background-size: cover;
  }
}
@media screen and (min-width: 1921px) {
  .main-visual .swiper-slide.visual-02 .bg-img {
    background: url("/static/images/main/main_visual_2@2x.jpg") no-repeat center center;
    background-size: cover;
  }
}
.main-visual .swiper-slide.visual-03 .bg-img {
  background: url("/static/images/main/main_visual_3@m.jpg") no-repeat center center;
  background-size: cover;
}
@media screen and (min-width: 768px) {
  .main-visual .swiper-slide.visual-03 .bg-img {
    background: url("/static/images/main/main_visual_3.jpg") no-repeat center center;
    background-size: cover;
  }
}
@media screen and (min-width: 1921px) {
  .main-visual .swiper-slide.visual-03 .bg-img {
    background: url("/static/images/main/main_visual_3@2x.jpg") no-repeat center center;
    background-size: cover;
  }
}
.main-visual {
  /* 기존 .main-visual 안에 있는 .visual-controls 영역만 교체해주세요 */
  /*.visual-controls {
      position: absolute;
      left: 20px; 
      top: 56%; // 시안에 맞춰 위치 조정
      z-index: 10;

      @media screen and (min-width: $breakpoint-pc) {
          left: 0;
          width: 100%;
          bottom: auto;
          top: 68%;
      }

      .inner {
          @media screen and (min-width: $breakpoint-pc) {
              margin: 0 auto;
              @include pc-scale(max-width, 1400px);
          }
      }

      .control-wrap {
          display: flex;
          align-items: center;
          gap: 16px; // 페이징과 정지 버튼 사이 간격

          .swiper-pagination {
              position: static;
              width: auto;
              display: flex;
              align-items: center;
              @include responsive(gap, 24px);

              .swiper-pagination-bullet {
                  width: 10px;
                  height: 10px;
                  background: transparent;
                  border: 2px solid #fff; // 속이 빈 하얀 원
                  opacity: 0.6;
                  margin: 0; // swiper 기본 마진 제거
                  transition: all 0.3s ease;

                  @media screen and (min-width: $breakpoint-pc) {
                      width: 12px;
                      height: 12px;
                  }

                  &-active {
                      background: #fff; // 활성화 시 꽉 찬 하얀 원
                      opacity: 1;
                      transform: scale(1.2); // 활성화 시 살짝 커지는 효과 (선택)
                  }
              }
          }

          .btn-autoplay {
              display: flex;
              align-items: center;
              justify-content: center;
              background: transparent;
              border: none;
              padding: 0;
              color: #fff;
              opacity: 0.8;
              cursor: pointer;
              transition: opacity 0.3s ease;

              &:hover {
                  opacity: 1;
              }

              svg {
                  width: 20px;
                  height: 20px;

                  @media screen and (min-width: $breakpoint-pc) {
                      width: 24px;
                      height: 24px;
                  }
              }
          }
      }
  }*/
}
.main-visual .visual-controls {
  position: absolute;
  left: 20px;
  top: 56%;
  z-index: 10;
}
@media screen and (min-width: 1200px) {
  .main-visual .visual-controls {
    left: 0;
    width: 100%;
    bottom: auto;
    top: 65.6%;
  }
}
@media screen and (min-width: 1200px) {
  .main-visual .visual-controls .inner {
    margin: 0 auto;
    max-width: 100vw;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .main-visual .visual-controls .inner {
    max-width: 1400px;
  }
}
.main-visual .visual-controls .control-wrap {
  display: flex;
  align-items: center;
  gap: 24px;
}
.main-visual .visual-controls .control-wrap .autoplay-progress {
  position: relative;
  width: 60px;
  height: 2px;
  background: rgba(255, 255, 255, 0.3);
}
.main-visual .visual-controls .control-wrap .autoplay-progress .progress-fill {
  position: absolute;
  left: 0;
  top: 0;
  width: 0%;
  height: 100%;
  background: #fff;
}
.main-visual .visual-controls .control-wrap {
  /* 좌우 네비게이션 버튼 */
}
.main-visual .visual-controls .control-wrap .nav-buttons {
  display: flex;
  align-items: center;
  gap: 12px;
}
.main-visual .visual-controls .control-wrap .nav-buttons button {
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: none;
  padding: 0;
  color: #fff;
  opacity: 0.6;
  cursor: pointer;
  transition: all 0.3s ease;
}
.main-visual .visual-controls .control-wrap .nav-buttons button:hover {
  opacity: 1;
}
.main-visual .visual-controls .control-wrap .nav-buttons button svg {
  width: 6.4vw;
}
@media (min-width: 640px) {
  .main-visual .visual-controls .control-wrap .nav-buttons button svg {
    width: 1.5rem;
  }
}
@media (min-width: 1200px) {
  .main-visual .visual-controls .control-wrap .nav-buttons button svg {
    width: 24px;
  }
}
.main-visual .visual-controls .control-wrap .nav-buttons button svg {
  height: 6.4vw;
}
@media (min-width: 640px) {
  .main-visual .visual-controls .control-wrap .nav-buttons button svg {
    height: 1.5rem;
  }
}
@media (min-width: 1200px) {
  .main-visual .visual-controls .control-wrap .nav-buttons button svg {
    height: 24px;
  }
}

.sec-mission-wrap {
  position: relative;
  width: 100%;
  /* 150vh(텍스트 채워지는 스크롤 공간) + 100vh(섹션 본래 높이) */
  height: 390vh;
}
@media screen and (min-width: 1200px) {
  .sec-mission-wrap {
    height: 280vh;
  }
}

.sec-mission {
  position: sticky;
  top: 0;
  z-index: 10;
  height: 100vh;
  background-color: #fff;
  /* 겹침 방지를 위해 컬럼 방향 강제 */
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}
.sec-mission .inner {
  text-align: center;
  width: 100%;
  padding: 0 5.3333vw;
}
@media (min-width: 640px) {
  .sec-mission .inner {
    padding: 0 1.25rem;
  }
}
@media (min-width: 1200px) {
  .sec-mission .inner {
    padding: 0 20px;
  }
}
.sec-mission .sub-title {
  display: block;
  color: var(--RED, #ED1C24);
  font-weight: 700;
  /* h2 타이틀과 확실히 띄워주기 */
  margin-bottom: 6.4vw;
}
@media (min-width: 640px) {
  .sec-mission .sub-title {
    margin-bottom: 1.5rem;
  }
}
@media (min-width: 1200px) {
  .sec-mission .sub-title {
    margin-bottom: 24px;
  }
}
.sec-mission .sub-title {
  font-size: var(--text-base);
}
@media (min-width: 640px) {
  .sec-mission .sub-title {
    font-size: var(--text-base);
  }
}
@media (min-width: 1200px) {
  .sec-mission .sub-title {
    font-size: var(--text-base);
  }
}
@media screen and (min-width: 1200px) {
  .sec-mission .sub-title {
    margin-bottom: 2.2857vw;
    font-size: var(--text-lg);
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-mission .sub-title {
    margin-bottom: 32px;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-mission .sub-title {
    font-size: var(--text-lg);
  }
}
.sec-mission .title {
  display: block;
  text-box-trim: none;
  text-box-edge: unset;
  /* PC/모바일 줄바꿈 제어 클래스 */
}
.sec-mission .title .pc-only {
  display: none !important;
}
@media screen and (min-width: 1200px) {
  .sec-mission .title .pc-only {
    display: block !important; /* PC에선 줄바꿈(block)되면서 나타남 */
  }
}
.sec-mission .title .mo-only {
  display: block !important;
}
@media screen and (min-width: 1200px) {
  .sec-mission .title .mo-only {
    display: none !important;
  }
}
.sec-mission .title .fill-line {
  /* 한 덩어리 안에서 글자 길이만큼만 배경이 칠해지도록 inline-block */
  /* block으로 처리된 모바일/PC 제어 클래스와 충돌하지 않게 텍스트 정렬을 위해 약간의 트릭 사용 */
  width: auto;
  margin: 0 auto;
  font-family: MaruBuri, sans-serif;
  color: var(--GRAY-Gray3, #DEDEDE);
  font-weight: 700;
  line-height: 140%;
  letter-spacing: -1.6px;
  background: linear-gradient(to right, #2B2B2B 50%, #DEDEDE 50%);
  background-size: 200% 100%;
  background-position: 100% 0;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-size: 8.5333vw;
}
@media (min-width: 640px) {
  .sec-mission .title .fill-line {
    font-size: 2rem;
  }
}
@media (min-width: 1200px) {
  .sec-mission .title .fill-line {
    font-size: 32px;
  }
}
@media screen and (min-width: 1200px) {
  .sec-mission .title .fill-line {
    font-size: 3.4286vw;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-mission .title .fill-line {
    font-size: 48px;
  }
}

/* 3. 스토리/히스토리 섹션 */
.sec-story-wrap {
  position: relative;
  width: 100%;
  /* 3번째 섹션의 애니메이션 길이에 맞춰 높이 지정 (예: 300vh) */
  height: 300vh;
  /* 기존에 .sec-story에 있던 음수 마진과 z-index를 이쪽으로 이동! */
  margin-top: -100vh;
  z-index: 20;
}

.sec-story {
  position: sticky;
  width: 100%;
  top: 0;
  height: 100vh;
  overflow: hidden;
  border-radius: 10.6667vw 10.6667vw 0 0;
}
@media (min-width: 640px) {
  .sec-story {
    border-radius: 2.5rem 2.5rem 0 0;
  }
}
@media (min-width: 1200px) {
  .sec-story {
    border-radius: 40px 40px 0 0;
  }
}
@media screen and (min-width: 1200px) {
  .sec-story {
    border-radius: 8.5714vw 8.5714vw 0 0;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-story {
    border-radius: 120px 120px 0 0;
  }
}
.sec-story .story-bg-wrap {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.sec-story .story-bg-wrap .bg-img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
  /* 배경 이미지가 처음엔 약간 확대되어 있다가 스크롤 되면서 원본 크기가 되도록 설계(GSAP) */
  transform: scale(1);
}
.sec-story .story-bg-wrap .bg-img.bg-1 {
  opacity: 1;
  z-index: 2;
  background: url("/static/images/main/story_img1@m.jpg") no-repeat center center;
  background-size: cover;
}
@media screen and (min-width: 768px) {
  .sec-story .story-bg-wrap .bg-img.bg-1 {
    background: url("/static/images/main/story_img1@sm.jpg") no-repeat center center;
    background-size: cover;
  }
}
@media screen and (min-width: 1200px) {
  .sec-story .story-bg-wrap .bg-img.bg-1 {
    background: url("/static/images/main/story_img1.jpg") no-repeat center center;
    background-size: cover;
  }
}
@media screen and (min-width: 1400px) {
  .sec-story .story-bg-wrap .bg-img.bg-1 {
    background: url("/static/images/main/story_img1@lg.jpg") no-repeat center center;
    background-size: cover;
  }
}
@media screen and (min-width: 1920px) {
  .sec-story .story-bg-wrap .bg-img.bg-1 {
    background: url("/static/images/main/story_img1@xl.jpg") no-repeat center center;
    background-size: cover;
  }
}
.sec-story .story-bg-wrap .bg-img.bg-2 {
  opacity: 0;
  z-index: 3;
  background: url("/static/images/main/story_img2@m.jpg") no-repeat center center;
  background-size: cover;
}
@media screen and (min-width: 768px) {
  .sec-story .story-bg-wrap .bg-img.bg-2 {
    background: url("/static/images/main/story_img2@sm.jpg") no-repeat center center;
    background-size: cover;
  }
}
@media screen and (min-width: 1200px) {
  .sec-story .story-bg-wrap .bg-img.bg-2 {
    background: url("/static/images/main/story_img2.jpg") no-repeat center center;
    background-size: cover;
  }
}
@media screen and (min-width: 1400px) {
  .sec-story .story-bg-wrap .bg-img.bg-2 {
    background: url("/static/images/main/story_img2@lg.jpg") no-repeat center center;
    background-size: cover;
  }
}
@media screen and (min-width: 1920px) {
  .sec-story .story-bg-wrap .bg-img.bg-2 {
    background: url("/static/images/main/story_img2@xl.jpg") no-repeat center center;
    background-size: cover;
  }
}
.sec-story .story-bg-wrap .dim {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0);
  z-index: 4;
  pointer-events: none;
}
.sec-story .story-txt-wrap {
  position: relative;
  z-index: 5;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.sec-story .story-txt-wrap .text-step {
  position: absolute;
  text-align: center;
  color: #fff;
  opacity: 0;
  transform: translateY(50px);
}
.sec-story .story-txt-wrap .text-step .title {
  font-family: MaruBuri, sans-serif;
  font-weight: 700;
  line-height: 1.3;
  font-size: 8.5333vw;
}
@media (min-width: 640px) {
  .sec-story .story-txt-wrap .text-step .title {
    font-size: 2rem;
  }
}
@media (min-width: 1200px) {
  .sec-story .story-txt-wrap .text-step .title {
    font-size: 32px;
  }
}
.sec-story .story-txt-wrap .text-step .title {
  margin-bottom: 6.4vw;
}
@media (min-width: 640px) {
  .sec-story .story-txt-wrap .text-step .title {
    margin-bottom: 1.5rem;
  }
}
@media (min-width: 1200px) {
  .sec-story .story-txt-wrap .text-step .title {
    margin-bottom: 24px;
  }
}
@media screen and (min-width: 1200px) {
  .sec-story .story-txt-wrap .text-step .title {
    font-size: 3.4286vw;
    margin-bottom: 4.5714vw;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-story .story-txt-wrap .text-step .title {
    font-size: 48px;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-story .story-txt-wrap .text-step .title {
    margin-bottom: 64px;
  }
}
.sec-story .story-txt-wrap .text-step .desc {
  font-weight: 400;
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.9);
  font-size: 4.2667vw;
}
@media (min-width: 640px) {
  .sec-story .story-txt-wrap .text-step .desc {
    font-size: 1rem;
  }
}
@media (min-width: 1200px) {
  .sec-story .story-txt-wrap .text-step .desc {
    font-size: 16px;
  }
}
@media screen and (min-width: 1200px) {
  .sec-story .story-txt-wrap .text-step .desc {
    font-size: 1.4286vw;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-story .story-txt-wrap .text-step .desc {
    font-size: 20px;
  }
}
.sec-story .story-txt-wrap .text-step .desc strong {
  font-weight: 700;
  color: #fff;
}
.sec-story .story-txt-wrap {
  /* 시안에 있는 하단 꺾쇠 3개 아이콘 (스크롤 유도) */
}
.sec-story .story-txt-wrap .scroll-down-icon {
  position: absolute;
  left: 50%;
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  bottom: 10%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  margin-top: 10.6667vw;
}
@media (min-width: 640px) {
  .sec-story .story-txt-wrap .scroll-down-icon {
    margin-top: 2.5rem;
  }
}
@media (min-width: 1200px) {
  .sec-story .story-txt-wrap .scroll-down-icon {
    margin-top: 40px;
  }
}
.sec-story .story-txt-wrap .scroll-down-icon span {
  display: block;
  width: 12px;
  height: 12px;
  border-bottom: 2px solid #fff;
  border-right: 2px solid #fff;
  transform: rotate(45deg);
  opacity: 0.5;
  animation: arrowDown 1.5s infinite;
}
.sec-story .story-txt-wrap .scroll-down-icon span:nth-child(2) {
  animation-delay: 0.2s;
}
.sec-story .story-txt-wrap .scroll-down-icon span:nth-child(3) {
  animation-delay: 0.4s;
  opacity: 1;
}

@keyframes arrowDown {
  0% {
    opacity: 0;
    transform: rotate(45deg) translate(-5px, -5px);
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    transform: rotate(45deg) translate(5px, 5px);
  }
}
.sec-head, .sticky-text {
  text-align: left;
  margin-bottom: 21.3333vw;
}
@media (min-width: 640px) {
  .sec-head, .sticky-text {
    margin-bottom: 5rem;
  }
}
@media (min-width: 1200px) {
  .sec-head, .sticky-text {
    margin-bottom: 80px;
  }
}
@media screen and (min-width: 1200px) {
  .sec-head, .sticky-text {
    margin-bottom: 7.1429vw;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-head, .sticky-text {
    margin-bottom: 100px;
  }
}
.sec-head .label-title, .sticky-text .label-title {
  display: block;
  color: var(--RED, #ED1C24);
  font-weight: 700;
  padding: 0;
  text-align: left;
  height: auto;
  font-weight: 700;
  line-height: 1.4;
  font-size: var(--text-base);
}
@media (min-width: 640px) {
  .sec-head .label-title, .sticky-text .label-title {
    font-size: var(--text-base);
  }
}
@media (min-width: 1200px) {
  .sec-head .label-title, .sticky-text .label-title {
    font-size: var(--text-base);
  }
}
.sec-head .label-title, .sticky-text .label-title {
  margin-bottom: 10.6667vw;
}
@media (min-width: 640px) {
  .sec-head .label-title, .sticky-text .label-title {
    margin-bottom: 2.5rem;
  }
}
@media (min-width: 1200px) {
  .sec-head .label-title, .sticky-text .label-title {
    margin-bottom: 40px;
  }
}
@media screen and (min-width: 1200px) {
  .sec-head .label-title, .sticky-text .label-title {
    font-size: var(--text-lg);
    margin-bottom: 3.4286vw;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-head .label-title, .sticky-text .label-title {
    font-size: var(--text-lg);
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-head .label-title, .sticky-text .label-title {
    margin-bottom: 48px;
  }
}
.sec-head .title, .sticky-text .title {
  font-family: MaruBuri, sans-serif;
  color: var(--GRAY-Gray9, #2B2B2B);
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: -1.6px;
  font-size: 8.5333vw;
}
@media (min-width: 640px) {
  .sec-head .title, .sticky-text .title {
    font-size: 2rem;
  }
}
@media (min-width: 1200px) {
  .sec-head .title, .sticky-text .title {
    font-size: 32px;
  }
}
@media screen and (min-width: 1200px) {
  .sec-head .title, .sticky-text .title {
    font-size: 3.4286vw;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-head .title, .sticky-text .title {
    font-size: 48px;
  }
}
.sec-head .title strong, .sticky-text .title strong {
  font-weight: 700;
}

.sec-business {
  position: relative;
  background: #fff;
  z-index: 10;
  padding: 32vw 5.3333vw;
}
@media (min-width: 640px) {
  .sec-business {
    padding: 7.5rem 1.25rem;
  }
}
@media (min-width: 1200px) {
  .sec-business {
    padding: 120px 20px;
  }
}
@media screen and (min-width: 1200px) {
  .sec-business {
    padding: 11.4286vw 0 21.4286vw 0;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-business {
    padding: 160px 0 300px 0;
  }
}
.sec-business .watermark {
  display: none;
}
@media screen and (min-width: 1200px) {
  .sec-business .watermark {
    display: block;
    color: var(--GRAY-Gray1, #F3F3F3);
    font-weight: 800;
    position: absolute;
    left: 0;
    font-size: 15.7143vw;
    bottom: -1.4286vw;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-business .watermark {
    font-size: 220px;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-business .watermark {
    bottom: -20px;
  }
}
.sec-business .inner {
  margin: 0 auto;
}
@media screen and (min-width: 1200px) {
  .sec-business .inner {
    max-width: 100vw;
    /* 기존 헤더 너비와 동일하게 맞춤 */
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-business .inner {
    max-width: 1400px;
  }
}
.sec-business .sec-body {
  position: relative;
}
@media screen and (min-width: 1200px) {
  .sec-business .sec-body {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
  }
}
.sec-business .img-wrap {
  position: relative;
  width: 100%;
  /* 시안과 유사하게 좌상, 우상, 좌하 둥글고 우하단 직각 등 쉐입 적용 */
  border-radius: 0 10.6667vw 0 10.6667vw;
}
@media (min-width: 640px) {
  .sec-business .img-wrap {
    border-radius: 0 2.5rem 0 2.5rem;
  }
}
@media (min-width: 1200px) {
  .sec-business .img-wrap {
    border-radius: 0 40px 0 40px;
  }
}
.sec-business .img-wrap {
  margin-bottom: 17.0667vw;
}
@media (min-width: 640px) {
  .sec-business .img-wrap {
    margin-bottom: 4rem;
  }
}
@media (min-width: 1200px) {
  .sec-business .img-wrap {
    margin-bottom: 64px;
  }
}
.sec-business .img-wrap {
  overflow: hidden;
}
@media screen and (min-width: 1200px) {
  .sec-business .img-wrap {
    width: 48.5714vw;
    border-radius: 0vw 4.2857vw 0 4.2857vw;
    margin-bottom: 0;
    z-index: 2;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-business .img-wrap {
    width: 680px;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-business .img-wrap {
    border-radius: 0px 60px 0 60px;
  }
}
.sec-business .img-wrap .bg-img {
  width: 100%;
  background-size: cover;
  background-position: center;
  height: 53.3333vw;
}
@media (min-width: 640px) {
  .sec-business .img-wrap .bg-img {
    height: 12.5rem;
  }
}
@media (min-width: 1200px) {
  .sec-business .img-wrap .bg-img {
    height: 200px;
  }
}
@media screen and (min-width: 1200px) {
  .sec-business .img-wrap .bg-img {
    width: 181.3333vw;
    height: 34.8571vw;
  }
}
@media screen and (min-width: 1200px) and (min-width: 640px) {
  .sec-business .img-wrap .bg-img {
    width: 42.5rem;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1200px) {
  .sec-business .img-wrap .bg-img {
    width: 680px;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-business .img-wrap .bg-img {
    height: 488px;
  }
}
.sec-business .accordion-wrap {
  width: 100%;
}
@media screen and (min-width: 1200px) {
  .sec-business .accordion-wrap {
    width: 40vw;
    margin-top: 0;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-business .accordion-wrap {
    width: 560px;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-business .accordion-wrap {
    margin-top: 0;
  }
}
.sec-business .accordion-wrap .acc-list {
  border-top: 1px solid #ddd;
}
.sec-business .accordion-wrap .acc-list > li {
  border-bottom: 1px solid #ddd;
}
.sec-business .accordion-wrap .acc-list > li .acc-title {
  font-family: MaruBuri, sans-serif;
  width: 100%;
  color: var(--GRAY-Gray5, #9F9F9F);
  font-weight: 700;
  letter-spacing: -0.96px;
  background: transparent;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 5.3333vw 0 5.3333vw 0;
}
@media (min-width: 640px) {
  .sec-business .accordion-wrap .acc-list > li .acc-title {
    padding: 1.25rem 0 1.25rem 0;
  }
}
@media (min-width: 1200px) {
  .sec-business .accordion-wrap .acc-list > li .acc-title {
    padding: 20px 0 20px 0;
  }
}
.sec-business .accordion-wrap .acc-list > li .acc-title {
  font-size: 6.4vw;
}
@media (min-width: 640px) {
  .sec-business .accordion-wrap .acc-list > li .acc-title {
    font-size: 1.5rem;
  }
}
@media (min-width: 1200px) {
  .sec-business .accordion-wrap .acc-list > li .acc-title {
    font-size: 24px;
  }
}
@media screen and (min-width: 1200px) {
  .sec-business .accordion-wrap .acc-list > li .acc-title {
    font-size: 2.2857vw;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-business .accordion-wrap .acc-list > li .acc-title {
    font-size: 32px;
  }
}
.sec-business .accordion-wrap .acc-list > li .acc-title .icon-arrow {
  display: inline-block;
  border-bottom: 2px solid #999;
  border-right: 2px solid #999;
  transform: rotate(45deg);
  transition: all 0.3s ease;
  width: 2.6667vw;
}
@media (min-width: 640px) {
  .sec-business .accordion-wrap .acc-list > li .acc-title .icon-arrow {
    width: 0.625rem;
  }
}
@media (min-width: 1200px) {
  .sec-business .accordion-wrap .acc-list > li .acc-title .icon-arrow {
    width: 10px;
  }
}
.sec-business .accordion-wrap .acc-list > li .acc-title .icon-arrow {
  height: 2.6667vw;
}
@media (min-width: 640px) {
  .sec-business .accordion-wrap .acc-list > li .acc-title .icon-arrow {
    height: 0.625rem;
  }
}
@media (min-width: 1200px) {
  .sec-business .accordion-wrap .acc-list > li .acc-title .icon-arrow {
    height: 10px;
  }
}
.sec-business .accordion-wrap .acc-list > li .acc-title .icon-arrow {
  margin-bottom: 1.0667vw;
}
@media (min-width: 640px) {
  .sec-business .accordion-wrap .acc-list > li .acc-title .icon-arrow {
    margin-bottom: 0.25rem;
  }
}
@media (min-width: 1200px) {
  .sec-business .accordion-wrap .acc-list > li .acc-title .icon-arrow {
    margin-bottom: 4px;
  }
}
.sec-business .accordion-wrap .acc-list > li .acc-title .icon-arrow {
  margin-right: 3.4667vw;
}
@media (min-width: 640px) {
  .sec-business .accordion-wrap .acc-list > li .acc-title .icon-arrow {
    margin-right: 0.8125rem;
  }
}
@media (min-width: 1200px) {
  .sec-business .accordion-wrap .acc-list > li .acc-title .icon-arrow {
    margin-right: 13px;
  }
}
@media screen and (min-width: 1200px) {
  .sec-business .accordion-wrap .acc-list > li .acc-title .icon-arrow {
    color: var(--GRAY-Gray5, #9F9F9F);
    width: 1vw;
    height: 1vw;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-business .accordion-wrap .acc-list > li .acc-title .icon-arrow {
    width: 14px;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-business .accordion-wrap .acc-list > li .acc-title .icon-arrow {
    height: 14px;
  }
}
.sec-business .accordion-wrap .acc-list > li .acc-content {
  display: none;
  padding-bottom: 5.3333vw;
}
@media (min-width: 640px) {
  .sec-business .accordion-wrap .acc-list > li .acc-content {
    padding-bottom: 1.25rem;
  }
}
@media (min-width: 1200px) {
  .sec-business .accordion-wrap .acc-list > li .acc-content {
    padding-bottom: 20px;
  }
}
@media screen and (min-width: 1200px) {
  .sec-business .accordion-wrap .acc-list > li .acc-content {
    padding-bottom: 1.7143vw;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-business .accordion-wrap .acc-list > li .acc-content {
    padding-bottom: 24px;
  }
}
.sec-business .accordion-wrap .acc-list > li .acc-content .dot-list {
  color: #666;
  line-height: 1.6;
  margin-bottom: 6.4vw;
}
@media (min-width: 640px) {
  .sec-business .accordion-wrap .acc-list > li .acc-content .dot-list {
    margin-bottom: 1.5rem;
  }
}
@media (min-width: 1200px) {
  .sec-business .accordion-wrap .acc-list > li .acc-content .dot-list {
    margin-bottom: 24px;
  }
}
@media screen and (min-width: 1200px) {
  .sec-business .accordion-wrap .acc-list > li .acc-content .dot-list {
    margin-bottom: 2.2857vw;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-business .accordion-wrap .acc-list > li .acc-content .dot-list {
    margin-bottom: 32px;
  }
}
.sec-business .accordion-wrap .acc-list > li .acc-content .dot-list li {
  margin-bottom: 4.2667vw;
}
@media (min-width: 640px) {
  .sec-business .accordion-wrap .acc-list > li .acc-content .dot-list li {
    margin-bottom: 1rem;
  }
}
@media (min-width: 1200px) {
  .sec-business .accordion-wrap .acc-list > li .acc-content .dot-list li {
    margin-bottom: 16px;
  }
}
.sec-business .accordion-wrap .acc-list > li .acc-content .dot-list li {
  font-size: var(--text-base);
}
@media (min-width: 640px) {
  .sec-business .accordion-wrap .acc-list > li .acc-content .dot-list li {
    font-size: var(--text-base);
  }
}
@media (min-width: 1200px) {
  .sec-business .accordion-wrap .acc-list > li .acc-content .dot-list li {
    font-size: var(--text-base);
  }
}
@media screen and (min-width: 1200px) {
  .sec-business .accordion-wrap .acc-list > li .acc-content .dot-list li {
    font-size: var(--text-lg);
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-business .accordion-wrap .acc-list > li .acc-content .dot-list li {
    font-size: var(--text-lg);
  }
}
.sec-business .accordion-wrap .acc-list > li .acc-content .dot-list li:last-child {
  margin-bottom: 0;
}
.sec-business .accordion-wrap .acc-list > li .acc-content .btn-more {
  background: #f7f7f7;
  font-weight: 600;
  width: 100%;
  color: var(--RED, #ED1C24);
  background: rgba(237, 28, 36, 0.08);
  transition: all 0.3s;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 12.8vw;
}
@media (min-width: 640px) {
  .sec-business .accordion-wrap .acc-list > li .acc-content .btn-more {
    border-radius: 3rem;
  }
}
@media (min-width: 1200px) {
  .sec-business .accordion-wrap .acc-list > li .acc-content .btn-more {
    border-radius: 48px;
  }
}
.sec-business .accordion-wrap .acc-list > li .acc-content .btn-more {
  font-size: var(--text-lg);
}
@media (min-width: 640px) {
  .sec-business .accordion-wrap .acc-list > li .acc-content .btn-more {
    font-size: var(--text-lg);
  }
}
@media (min-width: 1200px) {
  .sec-business .accordion-wrap .acc-list > li .acc-content .btn-more {
    font-size: var(--text-lg);
  }
}
.sec-business .accordion-wrap .acc-list > li .acc-content .btn-more {
  height: 12.8vw;
}
@media (min-width: 640px) {
  .sec-business .accordion-wrap .acc-list > li .acc-content .btn-more {
    height: 3rem;
  }
}
@media (min-width: 1200px) {
  .sec-business .accordion-wrap .acc-list > li .acc-content .btn-more {
    height: 48px;
  }
}
@media screen and (min-width: 1200px) {
  .sec-business .accordion-wrap .acc-list > li .acc-content .btn-more {
    border-radius: 2.8571vw;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-business .accordion-wrap .acc-list > li .acc-content .btn-more {
    border-radius: 40px;
  }
}
@media screen and (min-width: 1200px) {
  .sec-business .accordion-wrap .acc-list > li .acc-content .btn-more:hover {
    color: #fff;
    background: var(--RED, #ED1C24);
  }
}
.sec-business .accordion-wrap .acc-list > li {
  /* 활성화(on) 상태 제어 */
}
.sec-business .accordion-wrap .acc-list > li.on .acc-title {
  color: var(--GRAY-Gray9, #2B2B2B);
  padding-bottom: 8.5333vw;
}
@media (min-width: 640px) {
  .sec-business .accordion-wrap .acc-list > li.on .acc-title {
    padding-bottom: 2rem;
  }
}
@media (min-width: 1200px) {
  .sec-business .accordion-wrap .acc-list > li.on .acc-title {
    padding-bottom: 32px;
  }
}
@media screen and (min-width: 1200px) {
  .sec-business .accordion-wrap .acc-list > li.on .acc-title {
    padding-bottom: 2.8571vw;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-business .accordion-wrap .acc-list > li.on .acc-title {
    padding-bottom: 40px;
  }
}
.sec-business .accordion-wrap .acc-list > li.on .acc-title .icon-arrow {
  color: var(--GRAY-Gray9, #2B2B2B);
  transform: rotate(-135deg); /* 화살표 위로 향하게 */
  margin-top: 1.6vw;
}
@media (min-width: 640px) {
  .sec-business .accordion-wrap .acc-list > li.on .acc-title .icon-arrow {
    margin-top: 0.375rem;
  }
}
@media (min-width: 1200px) {
  .sec-business .accordion-wrap .acc-list > li.on .acc-title .icon-arrow {
    margin-top: 6px;
  }
}
.sec-business .accordion-wrap .acc-list > li.on .acc-title .icon-arrow {
  margin-bottom: 0vw;
}
@media (min-width: 640px) {
  .sec-business .accordion-wrap .acc-list > li.on .acc-title .icon-arrow {
    margin-bottom: 0rem;
  }
}
@media (min-width: 1200px) {
  .sec-business .accordion-wrap .acc-list > li.on .acc-title .icon-arrow {
    margin-bottom: 0px;
  }
}

/*  네번째 */
.sec-numbers {
  position: relative;
  width: 100%;
  background: #fff;
  z-index: 10;
  overflow: hidden;
  padding: 32vw 0;
}
@media (min-width: 640px) {
  .sec-numbers {
    padding: 7.5rem 0;
  }
}
@media (min-width: 1200px) {
  .sec-numbers {
    padding: 120px 0;
  }
}
.sec-numbers {
  height: 245.3333vw;
}
@media (min-width: 640px) {
  .sec-numbers {
    height: 57.5rem;
  }
}
@media (min-width: 1200px) {
  .sec-numbers {
    height: 920px;
  }
}
@media screen and (min-width: 1200px) {
  .sec-numbers {
    padding: 0;
    /* PC: Pin 영역 */
  }
  .sec-numbers .pin-wrapper {
    height: 100vh;
  }
}
.sec-numbers .bg-wrap {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
  z-index: 1;
  background: url("/static/images/main/numbers_bg@m.jpg") no-repeat center center;
  background-size: cover;
}
@media screen and (min-width: 768px) {
  .sec-numbers .bg-wrap {
    background: url("/static/images/main/numbers_bg@sm.jpg") no-repeat center center;
    background-size: cover;
  }
}
@media screen and (min-width: 1200px) {
  .sec-numbers .bg-wrap {
    background: url("/static/images/main/numbers_bg.jpg") no-repeat center center;
    background-size: cover;
  }
}
@media screen and (min-width: 1920px) {
  .sec-numbers .bg-wrap {
    background: url("/static/images/main/numbers_bg@lg.jpg") no-repeat center center;
    background-size: cover;
  }
}
@media screen and (min-width: 2560px) {
  .sec-numbers .bg-wrap {
    background: url("/static/images/main/numbers_bg@xl.jpg") no-repeat center center;
    background-size: cover;
  }
}
.sec-numbers .bg-wrap::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.3);
}
.sec-numbers .pin-wrapper {
  position: relative;
  width: 100%;
  z-index: 2;
}
.sec-numbers .inner {
  position: relative;
  height: 100%;
}
@media screen and (min-width: 1200px) {
  .sec-numbers .inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 100vw;
    margin: 0 auto;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-numbers .inner {
    max-width: 1400px;
  }
}
.sec-numbers .sticky-text {
  padding: 0 5.3333vw 21.3333vw 5.3333vw;
}
@media (min-width: 640px) {
  .sec-numbers .sticky-text {
    padding: 0 1.25rem 5rem 1.25rem;
  }
}
@media (min-width: 1200px) {
  .sec-numbers .sticky-text {
    padding: 0 20px 80px 20px;
  }
}
@media screen and (min-width: 1200px) {
  .sec-numbers .sticky-text {
    padding: 0;
    width: 35.7143vw;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-numbers .sticky-text {
    width: 500px;
  }
}
.sec-numbers .sticky-text .label-title, .sec-numbers .sticky-text .title {
  color: #fff;
  letter-spacing: -1.6px;
}
.sec-numbers {
  /* 오른쪽 래퍼 */
}
.sec-numbers .card-list-wrap {
  /* 모바일: Swiper 영역이므로 좌측 여백만 남겨둠 */
  width: 100%;
}
@media screen and (min-width: 1200px) {
  .sec-numbers .card-list-wrap {
    padding-left: 0;
    position: relative;
    width: 42.8571vw;
    height: 100vh;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-numbers .card-list-wrap {
    width: 600px;
  }
}
@media screen and (min-width: 1200px) {
  .sec-numbers .card-list {
    position: relative;
    width: 100%;
    height: 100%;
  }
}
.sec-numbers .card-list .card-item {
  /* ★ [모바일 값] Swiper 슬라이드로서 기본 정렬 */
  width: calc(100% - 40px);
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 74.6667vw;
}
@media (min-width: 640px) {
  .sec-numbers .card-list .card-item {
    height: 17.5rem;
  }
}
@media (min-width: 1200px) {
  .sec-numbers .card-list .card-item {
    height: 280px;
  }
}
.sec-numbers .card-list .card-item {
  border-radius: 5.3333vw;
}
@media (min-width: 640px) {
  .sec-numbers .card-list .card-item {
    border-radius: 1.25rem;
  }
}
@media (min-width: 1200px) {
  .sec-numbers .card-list .card-item {
    border-radius: 20px;
  }
}
.sec-numbers .card-list .card-item {
  padding: 8vw;
}
@media (min-width: 640px) {
  .sec-numbers .card-list .card-item {
    padding: 1.875rem;
  }
}
@media (min-width: 1200px) {
  .sec-numbers .card-list .card-item {
    padding: 30px;
  }
}
@media screen and (min-width: 1200px) {
  .sec-numbers .card-list .card-item {
    /* ★ [PC 값] GSAP 애니메이션을 위해 하단 밖으로 숨김 */
    position: absolute;
    left: auto;
    right: 0;
    bottom: -50vh;
    width: 25.7143vw;
    height: 30vw;
    border-radius: 2.8571vw;
    padding: 2.8571vw;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-numbers .card-list .card-item {
    width: 360px;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-numbers .card-list .card-item {
    height: 420px;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-numbers .card-list .card-item {
    border-radius: 40px;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-numbers .card-list .card-item {
    padding: 40px;
  }
}
.sec-numbers .card-list .card-item.style-wht {
  background: #fff;
  color: #222;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}
.sec-numbers .card-list .card-item.style-blur {
  background: rgba(255, 255, 255, 0.6);
  backdrop-filter: blur(20px);
  border: 1px solid rgba(255, 255, 255, 0.4);
  color: #222;
}
.sec-numbers .card-list .card-item .icon {
  width: 10.6667vw;
}
@media (min-width: 640px) {
  .sec-numbers .card-list .card-item .icon {
    width: 2.5rem;
  }
}
@media (min-width: 1200px) {
  .sec-numbers .card-list .card-item .icon {
    width: 40px;
  }
}
.sec-numbers .card-list .card-item .icon {
  height: 10.6667vw;
}
@media (min-width: 640px) {
  .sec-numbers .card-list .card-item .icon {
    height: 2.5rem;
  }
}
@media (min-width: 1200px) {
  .sec-numbers .card-list .card-item .icon {
    height: 40px;
  }
}
.sec-numbers .card-list .card-item .icon img {
  width: 100%;
}
.sec-numbers .card-list .card-item .desc {
  font-weight: 600;
  line-height: 1.4;
  font-size: 4.2667vw;
}
@media (min-width: 640px) {
  .sec-numbers .card-list .card-item .desc {
    font-size: 1rem;
  }
}
@media (min-width: 1200px) {
  .sec-numbers .card-list .card-item .desc {
    font-size: 16px;
  }
}
.sec-numbers .card-list .card-item .desc {
  margin-top: 5.3333vw;
}
@media (min-width: 640px) {
  .sec-numbers .card-list .card-item .desc {
    margin-top: 1.25rem;
  }
}
@media (min-width: 1200px) {
  .sec-numbers .card-list .card-item .desc {
    margin-top: 20px;
  }
}
.sec-numbers .card-list .card-item .num-wrap {
  margin-top: auto;
  text-align: right;
}
.sec-numbers .card-list .card-item .num-wrap strong {
  font-weight: 700;
  font-size: 12.2667vw;
}
@media (min-width: 640px) {
  .sec-numbers .card-list .card-item .num-wrap strong {
    font-size: 2.875rem;
  }
}
@media (min-width: 1200px) {
  .sec-numbers .card-list .card-item .num-wrap strong {
    font-size: 46px;
  }
}
.sec-numbers .card-list .card-item .num-wrap span {
  font-weight: 600;
  font-size: 4.2667vw;
}
@media (min-width: 640px) {
  .sec-numbers .card-list .card-item .num-wrap span {
    font-size: 1rem;
  }
}
@media (min-width: 1200px) {
  .sec-numbers .card-list .card-item .num-wrap span {
    font-size: 16px;
  }
}
.sec-numbers .card-list .card-item .num-wrap span {
  margin-left: 4px;
}
@media screen and (min-width: 1200px) {
  .sec-numbers .card-list .card-item .icon {
    width: 4vw;
    height: 4vw;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-numbers .card-list .card-item .icon {
    width: 56px;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-numbers .card-list .card-item .icon {
    height: 56px;
  }
}
@media screen and (min-width: 1200px) {
  .sec-numbers .card-list .card-item .desc {
    font-size: 1.4286vw;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-numbers .card-list .card-item .desc {
    font-size: 20px;
  }
}
@media screen and (min-width: 1200px) {
  .sec-numbers .card-list .card-item .num-wrap strong {
    font-size: 5.1429vw;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-numbers .card-list .card-item .num-wrap strong {
    font-size: 72px;
  }
}
@media screen and (min-width: 1200px) {
  .sec-numbers .card-list .card-item .num-wrap span {
    font-size: 1.4286vw;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-numbers .card-list .card-item .num-wrap span {
    font-size: 20px;
  }
}

/* 공통 유틸리티 (필요시 common.scss에 추가) */
.txt-cut2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-all;
}

/* ====================================
   5. 새소식 섹션
==================================== */
.sec-news {
  background-color: #fff;
  padding: 21.3333vw 0;
}
@media (min-width: 640px) {
  .sec-news {
    padding: 5rem 0;
  }
}
@media (min-width: 1200px) {
  .sec-news {
    padding: 80px 0;
  }
}
@media screen and (min-width: 1200px) {
  .sec-news {
    padding: 0vw 0 21.4286vw 0;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-news {
    padding: 0px 0 300px 0;
  }
}
.sec-news .inner {
  width: 100%;
  margin: 0 auto;
  padding: 0 5.3333vw;
}
@media (min-width: 640px) {
  .sec-news .inner {
    padding: 0 1.25rem;
  }
}
@media (min-width: 1200px) {
  .sec-news .inner {
    padding: 0 20px;
  }
}
@media screen and (min-width: 1200px) {
  .sec-news .inner {
    max-width: 100vw;
    padding: 0;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-news .inner {
    max-width: 1400px;
  }
}
.sec-news .sec-head {
  display: flex;
  flex-direction: column;
  gap: 6.4vw;
}
@media (min-width: 640px) {
  .sec-news .sec-head {
    gap: 1.5rem;
  }
}
@media (min-width: 1200px) {
  .sec-news .sec-head {
    gap: 24px;
  }
}
.sec-news .sec-head {
  margin-bottom: 10.6667vw;
}
@media (min-width: 640px) {
  .sec-news .sec-head {
    margin-bottom: 2.5rem;
  }
}
@media (min-width: 1200px) {
  .sec-news .sec-head {
    margin-bottom: 40px;
  }
}
@media screen and (min-width: 1200px) {
  .sec-news .sec-head {
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: 4.5714vw;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-news .sec-head {
    margin-bottom: 64px;
  }
}
.sec-news .sec-head .title {
  text-box-trim: none;
  text-box-edge: unset;
  color: #222;
  font-family: MaruBuri, sans-serif;
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: -1.8px;
  font-size: 8.5333vw;
}
@media (min-width: 640px) {
  .sec-news .sec-head .title {
    font-size: 2rem;
  }
}
@media (min-width: 1200px) {
  .sec-news .sec-head .title {
    font-size: 32px;
  }
}
@media screen and (min-width: 1200px) {
  .sec-news .sec-head .title {
    font-size: 3.4286vw;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-news .sec-head .title {
    font-size: 48px;
  }
}
.sec-news .sec-head .title strong {
  font-weight: 700;
}
.sec-news .sec-head {
  /* 컨트롤러 (화살표 버튼) */
}
.sec-news .sec-head .news-controls {
  display: flex;
  gap: 12px;
}
.sec-news .sec-head .news-controls .btn-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  border: 1px solid #DEDEDE;
  color: #666;
  transition: all 0.3s ease;
  width: 14.9333vw;
}
@media (min-width: 640px) {
  .sec-news .sec-head .news-controls .btn-nav {
    width: 3.5rem;
  }
}
@media (min-width: 1200px) {
  .sec-news .sec-head .news-controls .btn-nav {
    width: 56px;
  }
}
.sec-news .sec-head .news-controls .btn-nav {
  height: 14.9333vw;
}
@media (min-width: 640px) {
  .sec-news .sec-head .news-controls .btn-nav {
    height: 3.5rem;
  }
}
@media (min-width: 1200px) {
  .sec-news .sec-head .news-controls .btn-nav {
    height: 56px;
  }
}
.sec-news .sec-head .news-controls .btn-nav {
  border-radius: 14.9333vw;
}
@media (min-width: 640px) {
  .sec-news .sec-head .news-controls .btn-nav {
    border-radius: 3.5rem;
  }
}
@media (min-width: 1200px) {
  .sec-news .sec-head .news-controls .btn-nav {
    border-radius: 56px;
  }
}
@media screen and (min-width: 1200px) {
  .sec-news .sec-head .news-controls .btn-nav {
    width: 4vw;
    height: 4vw;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-news .sec-head .news-controls .btn-nav {
    width: 56px;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-news .sec-head .news-controls .btn-nav {
    height: 56px;
  }
}
.sec-news .sec-head .news-controls .btn-nav .icon-svg {
  width: 100%;
  height: 100%;
}
.sec-news .sec-head .news-controls .btn-nav .icon-svg svg {
  width: 60%;
}
.sec-news .sec-head .news-controls .btn-nav:hover {
  background: var(--RED, #ED1C24);
  border-color: var(--RED, #ED1C24);
  color: #fff;
}
.sec-news .sec-head .news-controls .btn-nav.swiper-button-disabled {
  opacity: 0.5;
  pointer-events: none;
}
.sec-news .sec-head .news-controls .btn-nav.btn-prev .icon-svg {
  transform: rotate(180deg);
}
.sec-news .sec-body {
  position: relative;
  width: 100%;
}
.sec-news .sec-body .news-swiper {
  width: 100%;
  /* 스크롤바 공간을 위해 하단 패딩 확보 */
  padding-bottom: 10.6667vw;
}
@media (min-width: 640px) {
  .sec-news .sec-body .news-swiper {
    padding-bottom: 2.5rem;
  }
}
@media (min-width: 1200px) {
  .sec-news .sec-body .news-swiper {
    padding-bottom: 40px;
  }
}
@media screen and (min-width: 1200px) {
  .sec-news .sec-body .news-swiper {
    padding-bottom: 4.5714vw;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-news .sec-body .news-swiper {
    padding-bottom: 64px;
  }
}
.sec-news .sec-body .news-card {
  display: block;
  text-decoration: none;
}
.sec-news .sec-body .news-card:hover .img-wrap img {
  transform: scale(1.05);
}
.sec-news .sec-body .news-card .img-wrap {
  width: 100%;
  overflow: hidden;
  aspect-ratio: 440/240;
  background-color: #f5f5f5;
  border-radius: 5.3333vw;
}
@media (min-width: 640px) {
  .sec-news .sec-body .news-card .img-wrap {
    border-radius: 1.25rem;
  }
}
@media (min-width: 1200px) {
  .sec-news .sec-body .news-card .img-wrap {
    border-radius: 20px;
  }
}
.sec-news .sec-body .news-card .img-wrap {
  margin-bottom: 6.4vw;
}
@media (min-width: 640px) {
  .sec-news .sec-body .news-card .img-wrap {
    margin-bottom: 1.5rem;
  }
}
@media (min-width: 1200px) {
  .sec-news .sec-body .news-card .img-wrap {
    margin-bottom: 24px;
  }
}
@media screen and (min-width: 1200px) {
  .sec-news .sec-body .news-card .img-wrap {
    border-radius: 1.7143vw;
    margin-bottom: 2.2857vw;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-news .sec-body .news-card .img-wrap {
    border-radius: 24px;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-news .sec-body .news-card .img-wrap {
    margin-bottom: 32px;
  }
}
.sec-news .sec-body .news-card .img-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.4s ease;
}
.sec-news .sec-body .news-card .txt-wrap .category {
  display: block;
  color: #999;
  font-weight: 500;
  font-size: var(--text-sm);
}
@media (min-width: 640px) {
  .sec-news .sec-body .news-card .txt-wrap .category {
    font-size: var(--text-sm);
  }
}
@media (min-width: 1200px) {
  .sec-news .sec-body .news-card .txt-wrap .category {
    font-size: var(--text-sm);
  }
}
.sec-news .sec-body .news-card .txt-wrap .category {
  margin-bottom: 4.2667vw;
}
@media (min-width: 640px) {
  .sec-news .sec-body .news-card .txt-wrap .category {
    margin-bottom: 1rem;
  }
}
@media (min-width: 1200px) {
  .sec-news .sec-body .news-card .txt-wrap .category {
    margin-bottom: 16px;
  }
}
@media screen and (min-width: 1200px) {
  .sec-news .sec-body .news-card .txt-wrap .category {
    font-size: var(--text-base);
    margin-bottom: 1.7143vw;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-news .sec-body .news-card .txt-wrap .category {
    font-size: var(--text-base);
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-news .sec-body .news-card .txt-wrap .category {
    margin-bottom: 24px;
  }
}
.sec-news .sec-body .news-card .txt-wrap .subject {
  color: #222;
  font-weight: 700;
  line-height: 1.5;
  display: -webkit-box;
  overflow: hidden;
  vertical-align: top;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  font-size: var(--text-xl);
}
@media (min-width: 640px) {
  .sec-news .sec-body .news-card .txt-wrap .subject {
    font-size: var(--text-xl);
  }
}
@media (min-width: 1200px) {
  .sec-news .sec-body .news-card .txt-wrap .subject {
    font-size: var(--text-xl);
  }
}
@media screen and (min-width: 1200px) {
  .sec-news .sec-body .news-card .txt-wrap .subject {
    font-size: 1.7143vw;
  }
}
@media screen and (min-width: 1200px) and (min-width: 1400px) {
  .sec-news .sec-body .news-card .txt-wrap .subject {
    font-size: 24px;
  }
}
.sec-news .sec-body {
  /* Swiper 하단 스크롤바 (진행률 표시) */
}
.sec-news .sec-body .swiper-scrollbar {
  background: #f0f0f0;
  height: 0.5333vw;
}
@media (min-width: 640px) {
  .sec-news .sec-body .swiper-scrollbar {
    height: 0.125rem;
  }
}
@media (min-width: 1200px) {
  .sec-news .sec-body .swiper-scrollbar {
    height: 2px;
  }
}
.sec-news .sec-body .swiper-scrollbar {
  bottom: 0;
}
@media (min-width: 640px) {
  .sec-news .sec-body .swiper-scrollbar {
    bottom: 0;
  }
}
@media (min-width: 1200px) {
  .sec-news .sec-body .swiper-scrollbar {
    bottom: 0;
  }
}
.sec-news .sec-body .swiper-scrollbar .swiper-scrollbar-drag {
  background: var(--RED, #ED1C24);
  border-radius: 0;
}