 body, html {
 background-color: #000;

}





/* 1. ¸ÞÀÎ È÷¾î·Î ¼½¼Ç (±âº» ¼³Á¤) */
.hero {
    position: relative;
    width: 100%;
    height: 0;
    padding-top: 52.08%; /* 1920x1000 ºñÀ² À¯Áö */
    background: url('../img/images/view3_1.jpg') no-repeat center center / cover;
    overflow: hidden;
    transition: all 0.5s ease-in-out; /* È®´ë/Ãà¼Ò ¾Ö´Ï¸ÞÀÌ¼Ç */
    margin-top: 60px;
}


.hero-inner {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(
        to bottom,
        /* »ó´Ü ±×¶óµ¥ÀÌ¼Ç */
        rgba(0,0,0,0.95) 0%,    
        rgba(0,0,0,0.85) 10%,  
        rgba(0,0,0,0.6) 20%,   
        rgba(0,0,0,0.25) 30%,  
        rgba(0,0,0,0) 40%,      /* Áß°£ ¿ÏÀüÈ÷ Åõ¸í ½ÃÀÛ */
        rgba(0,0,0,0) 95%,      /* ÇÏ´Ü ÁøÇÏ±â Àü±îÁö Åõ¸í À¯Áö */
        rgba(0,0,0,1) 100%      /* ÇÏ´Ü 5% ÃÖ´ë ÁøÇÏ°Ô */
    );
}


.hero-info {
    position: absolute;
    top: 150px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 5;
    transition: all 0.5s ease;
    text-align: center;
    letter-spacing: 1px;
}


.hero-info .slogan {
    color: #f2f2f2;
    font-size: 25px;
    margin: 0;
    letter-spacing: 1px;
}


.hero-info h1 {
    font-size: 36px;
    font-weight: 700;
    line-height: 1.1;
    color: #f2f2f2 !important;
    letter-spacing: 1px;
    margin: 0 0 10px 0;
}


.hero-info .price-box {
    margin-bottom: 2vw;
}


.hero-info .price {
    font-size: 2.2vw;
    font-weight: 700;
    display: block;
    color: #f2f2f2 !important;
}


.hero-info .price span {
    font-size: 1.2vw;
    color: var(--text-gray);
    font-weight: 400;
}


.hero-info .base-model {
    font-size: 0.9vw;
    color: rgba(255,255,255,0.7);
}


.mo-only {
    display: none;
}


.hero-specs {
    position: absolute;
    bottom: 10%;
    right: 8%;
    display: flex;
    gap: 4vw;
    z-index: 5;
    transition: all 0.5s ease;
}


.spec-item {
    text-align: center;
}


.spec-item .value {
    display: block;
    font-size: 1.8vw;
    font-weight: 600;
    color: var(--text-white);
}


.spec-item .label {
    font-size: 0.9vw;
    color: var(--text-gray);
    margin-top: 0.4vw;
}


.vip-seat-section {
    position: relative;
    width: 100%;
}


.vip-seat-section img {
    width: 100%;
    height: auto;
    display: block;
}


.vip-seat-section::after {
    content: "";
    position: absolute;
    inset: 0;
    background: 
        /* »ó´Ü ±×¶óµ¥ÀÌ¼Ç */
        linear-gradient(
            to bottom,
            rgba(0, 0, 0, 1) 0%,    
            rgba(0, 0, 0, 0.9) 5%,  
            rgba(0, 0, 0, 0.6) 10%, 
            rgba(0, 0, 0, 0) 30%,   /* Áß°£ Åõ¸í ½ÃÀÛ */
            rgba(0, 0, 0, 0) 50%    /* Áß°£ ³¡ */
        ),
        /* ÇÏ´Ü ÁøÇÑ ±×¶óµ¥ÀÌ¼Ç ÁßÃ¸ */
        linear-gradient(
            to bottom,
            rgba(0, 0, 0, 0) 50%,  
            rgba(0, 0, 0, 0.3) 60%, 
            rgba(0, 0, 0, 0.5) 70%, 
            rgba(0, 0, 0, 0.7) 80%, 
            rgba(0, 0, 0, 0.85) 90%, 
            rgba(0, 0, 0, 1) 100%   /* ÇÏ´Ü ³¡ ÃÖ´ë ÁøÇÏ°Ô */
        );
}
.vip-seat-text {
    position: absolute;
left: 5% !important; /* !important¸¦ ºÙ¿© ¿ì¼±¼øÀ§¸¦ ³ôÀÓ */
    bottom: 60px;
    color: #fff;
    z-index: 2;
    max-width: calc(100% - 240px); /* È­¸é Á¼¾ÆÁ®µµ ÅØ½ºÆ®°¡ È­¸éÀ» ³Ñ¾î°¡Áö ¾Êµµ·Ï */
}


.vip-seat-text h1 {
    font-size: 28px;
    font-weight: 700;
    margin-bottom: 14px;
}


.vip-seat-text p {
    font-size: 15px;
    line-height: 1.7;
    color: #fff;
}






.vip-detail-section {
  background-color: #000;
  padding: 20px 5%;
  width: 100%;
  box-sizing: border-box;
  max-width: 1440px;
  
  /* ÇÙ½É: ÁÂ¿ì ¸¶ÁøÀ» auto·Î ¼³Á¤ÇÏ¿© Áß¾Ó Á¤·Ä */
  margin: 0 auto; 
}


.detail-container {
  display: flex;
  gap: 20px;
  justify-content: center; /* ³»ºÎ ¾ÆÀÌÅÛ Áß¾Ó Á¤·Ä */
}


.detail-item {
  flex: 1;
}


.detail-item img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 10px;
}


/* ÀüÃ¼ ¼½¼Ç ¼³Á¤ */
.custom-layout-section { 
  background-color: #000; 
  color: #ffffff; 
  padding: 150px 0; /* ÁÂ¿ì ÆÐµùÀº ÄÁÅ×ÀÌ³Ê ³»ºÎ¿¡¼­ Á¶Àý */
  overflow: hidden;

}
.custom-layout-inner {
  max-width: 1440px;
  margin: 0 auto;
  padding-left: 25px;
  padding-right: 25px;
  position: relative;
}
.custom-layout-header h2 { font-size: 28px; margin-bottom: 10px; color: #fff;font-weight:700;}
.custom-layout-header p { font-size: 15px; opacity: 0.9; color: #fff; margin-bottom: 30px; }




.custom-layout-header {
  padding: 0 25px; /* Á¦¸ñ ¿ÞÂÊ ¿©¹é */

  margin: 0 auto 40px auto;
}




/* ½½¶óÀÌµå ÄÁÅ×ÀÌ³Ê */



.custom-gallery-wrapper {
  position: relative; 
  overflow: visible; /* ¹öÆ°ÀÌ »çÁø ¹ÛÀ¸·Î ³ª¿Íµµ Àß¸² ¹æÁö */
}


.custom-gallery-container {
  display: flex;
  gap: 20px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  padding-right: 25px;
  cursor: grab;
}


.custom-gallery-container::-webkit-scrollbar {
  display: none;
}


.custom-gallery-item {
  flex: 0 0 580px;
  scroll-snap-align: start;
  user-select: none;
}


.custom-image-wrapper {
  width: 100%;
  height: 440px;
  border-radius: 12px;
  overflow: hidden;
  margin-bottom: 20px;
}


.custom-image-wrapper img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
}


/* ¹öÆ° - ±ÛÀÚ 50px + ¹öÆ° Å©±â Å°¿ò */
.custom-arrow {
  position: absolute;
  top: 50%;
  z-index: 50;
  background: rgba(0,0,0,0.5);
  color: #fff;
  border: none;
  width: 70px;       /* ¹öÆ° Å©±â È®´ë */
  height: 70px;      /* ¹öÆ° Å©±â È®´ë */
  border-radius: 50%;
  cursor: pointer;
  font-size: 50px;   /* ±ÛÀÚ Å©°Ô */
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s;
}


.custom-arrow:hover {
  background: rgba(0,0,0,0.7);
}


/* ÀÌÀü ¹öÆ° - »çÁø ¿ÞÂÊ ¹ÛÀ¸·Î */
.custom-arrow.prev {
  left: 0;
  transform: translate(-150%, -50%); /* »çÁø¿¡¼­ ÃæºÐÈ÷ ¶³¾îÁü */
}


/* ´ÙÀ½ ¹öÆ° - »çÁø ¿À¸¥ÂÊ ¹ÛÀ¸·Î */
.custom-arrow.next {
  right: 0;
  transform: translate(150%, -50%); /* »çÁø¿¡¼­ ÃæºÐÈ÷ ¶³¾îÁü */
}


/* µµÆ® ÀÎµðÄÉÀÌÅÍ */
.custom-indicator-dots {
  display: flex;
  gap: 10px;
  margin-top: 10px;
  justify-content: center;
}


.custom-dot {
  width: 10px;
  height: 10px;
  background: #ccc;
  border-radius: 50%;
  display: inline-block;
}


.custom-dot.active {
  background: #333;
}
.custom-text-wrapper h3 { font-size: 22px; color:#fff; margin-bottom: 10px; font-weight: 600; }
.custom-text-wrapper p { font-size: 15px; color:#fff; line-height: 1.6; opacity: 0.8; }



.special-space {
  position: relative; 
  width: 100%;
  height: 1573px;


  background:
    /*  À§ÂÊ ±×¶óµð¾ðÆ® (±âÁ¸ ±×´ë·Î) */
    linear-gradient(
      to bottom,
      rgba(0, 0, 0, 0.95) 0%,
      rgba(0, 0, 0, 0.9) 10%,
      rgba(0, 0, 0, 0.7) 20%,
      rgba(0, 0, 0, 0.4) 30%,
      rgba(0, 0, 0, 0) 40%
    ),


    /*  ¾Æ·¡ÂÊ ±×¶óµð¾ðÆ® (Ãß°¡) */
    linear-gradient(
      to top,
      rgba(0, 0, 0, 0.95) 0%,
      rgba(0, 0, 0, 0.3) 20%,
      rgba(0, 0, 0, 0.2) 35%,
      rgba(0, 0, 0, 0) 50%
    ),


    /*  ÀÌ¹ÌÁö */
    url('../img/images/special.jpg') center / cover no-repeat;


  display: flex;
  justify-content: center;
  padding-top: 60px;
}

    .special-space__title {
  position: absolute;
  top: 20%;
  left: 50%;
  transform: translateX(-50%);
      color: #fff;
      font-size: 40px;
      font-weight: 700;
      letter-spacing: 1px;
    }






/* ÀÌ¹ÌÁö °¡·Î Á¤·Ä */
.image-flex-box {
    display: flex;
    gap: 24px;
}


/* ÅØ½ºÆ® ½ºÅ¸ÀÏ */


.text-group {
position: absolute;
    left: 5% !important;
    bottom: 60px;
    color: #fff;
    z-index: 2;
    max-width: calc(100% - 240px);
}


.text-group h2 {
  font-size: 28px;
  color: #fff;
  font-weight:700;
  margin-bottom:14px;
}

.text-group p {
  font-size: 15px;
  line-height: 1.7;
  color: #fff;
  font-weight:350
}

.slider-section {
  padding: 150px 0;
}


.slider-text-area {
  text-align: center;
  color: #fff;
 margin:0 auto;
  margin-bottom: 40px;
letter-spacing: 1px;
}


.sub-text {
 color:#fff;
font-weight:380;
  font-size: 20px;
line-height:36px;
margin-bottom:10px;
}


.main-text {
  font-size: 32px;
  font-weight: 600;
line-height:50px;
}
.slider-wrapper {
  position: relative;
  max-width: 1440px;
  margin: 0 auto;


  overflow: visible; /* È­»ìÇ¥°¡ ÆÐµù ¿µ¿ª ¹ÛÀ¸·Î ³ª°¡µµ º¸ÀÌ°Ô */
}


.slider-container {
  position: relative;
  max-width: 1440px;
  height: 788px;
  margin: 0 auto;
  overflow: hidden;
  border-radius: 16px;
}


.slider {
  display: flex;
  height: 100%;
  transition: transform 0.5s ease;
}


.slide {
  min-width: 100%;
  height: 100%;
}


.slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;

}


/* È­»ìÇ¥ ¹öÆ° */

.arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 56px;
  height: 56px;
  background: transparent; /* ¹è°æ Á¦°Å */
  border: none;
  color: #fff;
  font-size: 32px;
  cursor: pointer;
  border-radius: 50%; /* ¿øÇü À¯Áö, ÇÊ¿ä ¾øÀ¸¸é Á¦°Å °¡´É */
  z-index: 20;
}


.arrow.left {
font-size:50px;
  left: -6%;   /* &#128072; »çÁø ¹Û */
}


.arrow.right {
font-size:50px;
  right: -6%;  /* &#128073; »çÁø ¹Û */
}

.section-title { text-align: center; margin-bottom: 60px;}
.section-title span { color:#fff; letter-spacing: 1px; font-size:32px; display: block; margin-bottom: 10px;font-weight:600; }
.section-title h2 { color:#fff;font-size:20px;font-weight:350;}
/* ÄÁÅ×ÀÌ³Ê */
.container {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    max-width: 1400px;
    margin: 0 auto;
    justify-content: center;
    background-color: #000;
    padding: 20px;
}




/* 1. ¸µÅ© ÅÂ±×: ¿©±â¼­ Ä«µåÀÇ ³Êºñ¸¦ °áÁ¤ÇØ¾ß ·¹ÀÌ¾Æ¿ôÀÌ ¾È ±úÁý´Ï´Ù. */
.card-link {
    display: block; /* ÀÎ¶óÀÎ¿¡¼­ ºí·Ï ¿ä¼Ò·Î º¯°æ */
    text-decoration: none; /* ¹ØÁÙ Á¦°Å */
    width: calc(33.333% - 20px); /* ÇÑ ÁÙ¿¡ 3°³ */
    min-width: 300px;
    color: inherit; /* ¸µÅ© ±âº» ÆÄ¶õ»ö ¹«½Ã */
    outline: none;
}




/* 2. Ä«µå º»Ã¼: ¸µÅ© ¾È¿¡ ²Ë Â÷µµ·Ï ¼³Á¤ */
.card2 {
    background-color: #1a1a1a;
    border-radius: 12px;
    overflow: hidden;
    width: 100%; 
    border: 2px solid transparent;
    transition: transform 0.3s ease, border-color 0.3s ease;
}




/* 3. È£¹ö È¿°ú: ¸µÅ©¿¡ ¸¶¿ì½º¸¦ ¿Ã·Áµµ Ä«µå°¡ ¹ÝÀÀÇÏµµ·Ï ¼³Á¤ */
.card-link:hover .card2 {
    transform: translateY(-5px);
    border-color: #f2f2f2;
}




.card-link:hover .card2-image img {
    transform: scale(1.1);
}




/* ÀÌ¹ÌÁö ¿µ¿ª */
.card2-image {
    overflow: hidden;
}




.card2-image img {
    width: 100%;
    height: auto;
    display: block;
    transition: transform 0.5s ease;
}




/* ÅØ½ºÆ® ¿µ¿ª: ¿äÃ»ÇÏ½Å ´ë·Î À§¾Æ·¡ ´ëÄª Á¤·Ä */
.card2-content {
    padding: 18px 20px; /* À§¾Æ·¡ 18px·Î ´ëÄª */
    text-align: left;
}




.card2-content h3 {
    font-size: 1.15rem;
    font-weight: bold;
    color: #ffffff;
    margin: 0;
    line-height: 1.2;
}




.card2-content p {
    font-size: 0.9rem;
    color: #ffffff;
    opacity: 0.85;
    margin: 6px 0 0 0; /* À§ÂÊ ¸¶Áø¸¸ »ìÂ¦ ÁÖ¾î Á¦¸ñ°ú ±¸ºÐ */
    line-height: 1.4;
}


.step_all { 
    background-color: #fff; 
    padding: 150px 0; 
    font-family: 'Pretendard', sans-serif; 
    display: flex;
    flex-direction: column;
    align-items: center; /* Á¦¸ñ°ú flow ÀüÃ¼ Áß¾Ó Á¤·Ä */
    margin-top:150px;
  }
  
  .process-title { 
    text-align: center; 
    font-size:32px !important;
    font-weight: 700; 
    margin-bottom: 80px; 
  }
  
  .flow { 
    position: relative; 
    width: 95%; 
    max-width: 1100px; 
    margin: 0 auto; /* ¼öÆò Áß¾Ó Á¤·Ä */
  }




  .step {
    width:200px;
    height:200px;
    background: #f3f3f3; 
    border-radius: 50%;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    position: relative; z-index: 2;
    margin: 0 auto; /* ¸ð¹ÙÀÏ µî¿¡¼­ Áß¾Ó ¹èÄ¡ ±âº»°ª */
  }
  .num { font-size: 18px; font-weight: 700; color: #000; margin-bottom: 2px; }
  .icon {width:60px;margin-bottom: 4px;padding:10px;}
  .text { font-size:20px; font-weight: 700; color: #222; }



.contact-section .contact-container {
  position: relative;
  z-index: 2;
  display: flex;
  justify-content: space-between;
  width: 100%;
  align-items: center;
}


/* ÅØ½ºÆ® ¿µ¿ª */
.contact-text {
  max-width: 600px;
}


.contact-text h1 {
  font-size: 36px;
  font-weight: 700;
  margin-bottom: 12px;
}


.contact-text p {
  font-size: 16px;
  color: #ddd;
  line-height: 1.4;
}


/* ¹öÆ° ¿µ¿ª */
.contact-buttons {
  display: flex;
  gap: 15px;
  margin-left: auto; /* PC¿ë ¿À¸¥ÂÊ Á¤·Ä */
}


/* ¹öÆ° °øÅë */
.contact-btn {
  padding: 12px 24px;
  font-weight: 600;
  border-radius: 6px;
  border: none;
  cursor: pointer;
  transition: 0.3s ease background-color;
  font-size: 14px;
  min-width: 140px;
}


/* Primary ¹öÆ° */
.contact-btn.primary {
  background-color: #1a54ff;
  color: white;
  border: 1px solid #1a54ff;
}


.contact-btn.primary:hover {
  background-color: #0039d9;
  border-color: #0039d9;
}


/* Secondary ¹öÆ° */
.contact-btn.secondary {
  background-color: white;
  color: black;
  border: 1px solid white;
}


.contact-btn.secondary:hover {
  background-color: #eaeaea;
}


/* ÃÊ°íÇØ»óµµ ´ëÀÀ */
@media (min-width: 1920px) {
.custom-layout-inner{max-width: 1600px;}
    .hero-info {
        bottom: 100px;
    }
    .hero-info h1 {
        font-size: 50px;
    }
    .hero-info .price {
        font-size: 42px;
    }
    .hero-specs {
        bottom: 100px;
        gap: 70px;
    }
    .spec-item .value {
        font-size: 34px;
    }
.vip-detail-section {
       max-width:1600px;
  }

}
/* PC µµÆ® ¼û±è */
@media (min-width: 1024px) {
  .custom-indicator-dots { display: none !important; }



}

 /* [PC ¹öÀü ½ºÅ¸ÀÏ - 769px ÀÌ»ó] */
  @media (min-width: 769px) {
    .flow { height: 500px; display: block; }
 
    .row { 
      display: flex; 
      justify-content: space-between; 
      width: 78%; /* Step 4 Á¦¿ÜÇÑ ³ª¸ÓÁö ¿µ¿ª ³Êºñ */
      position: absolute; 
      left: 0; 
    }
    .row.top { top: 0; }
    .row.bottom { bottom: 0; flex-direction: row-reverse; } /* 5-6-7 ¿ª¼ø ¹èÄ¡ */




    /* Step 4: ¿À¸¥ÂÊ ³¡ Áß¾Ó */
    .step.center { 
      position: absolute; 
      right: 0; 
      top: 50%; 
      transform: translateY(-50%); 
      margin: 0;
    }




    /* PC °¡·Î ¿¬°á¼± */
    .row .step:not(:last-child)::after {
      content: ""; position: absolute; top: 50%; 
      right: -100%; width: 100%; height: 2px; 
      background: #000; z-index: 1;
    }
    .row.bottom .step:not(:last-child)::after {
      left: -100%; right: auto;
    }




    /* 3 -> 4 -> 5 °î¼± ¿¬°á */
    .curve-top {
      position: absolute; right: 70px; top: 85px; 
      width: 22%; height: 175px;
      border: 2px solid #000; border-left: none; border-bottom: none; border-radius: 0 80px 0 0;
    }
    .curve-bottom {
      position: absolute; right: 70px; bottom: 85px; 
      width: 22%; height: 175px;
      border: 2px solid #000; border-left: none; border-top: none; border-radius: 0 0 80px 0;
    }
  .row.top .step:nth-child(3)::after {
    display: none !important;
    content: none !important;
    width: 0 !important;
  }
  }

@media (max-width: 1600px) {
.slider-wrapper {
  position: relative;
  max-width: 1440px;
  width: 100%;
  margin: 0 auto;
  padding: 0 80px; /* ÁÂ¿ì °ø°£ È®º¸ */
  overflow: visible; /* È­»ìÇ¥°¡ ¹Ù±ùÀ¸·Î ³ª°¡µµ º¸ÀÌ°Ô */
}
.arrow.left {
  left: 0; /* padding ¾ÈÂÊ ±âÁØ */
}


.arrow.right {
  right: 0;
}

  .custom-arrow.prev {
    transform: translate(-100%, -50%);
  }
  .custom-arrow.next {
    transform: translate(100%, -50%);
  }
}

@media (max-width: 1440px) {

 .step {
    width:170px;
    height:170px;


  }


}









@media (max-width: 1024px) {

  .special-space {
    height: 1200px;
  }
    .special-space__title {
      font-size: 30px;
    }
  .arrow.left { left: 20px; }   /* »çÁø ¾ÈÂÊÀ¸·Î */
  .arrow.right { right: 20px; }
  .arrow { width: 48px; height: 48px; font-size: 28px; }
  .slider-wrapper { padding: 0 20px; }  /* È­»ìÇ¥ ¿©À¯ °ø°£ È®º¸ */
 .slider-container {
    height: 60vw; /* ¸ð¹ÙÀÏÀº È­¸é ºñÀ²·Î ÃæºÐÈ÷ Å©°Ô */
  }
.card-link { width: calc(50% - 20px);
    left: 8%;
    bottom: 8%;
    max-width: 768px;
  }


 .custom-arrow.prev {
    display:none;
  }
  .custom-arrow.next {
    display:none;
  }



}
/* ¸ð¹ÙÀÏ µµÆ® Ç¥½Ã */
.custom-indicator-dots { 
  display: flex; 
  justify-content: center; 
  gap: 8px; 
  margin-top: 20px; 
}
.custom-dot { width: 8px; height: 8px; background: #444; border-radius: 50%; }
.custom-dot.active { background: #fff; }

/* ¹Ìµð¾îÄõ¸®: ¸ð¹ÙÀÏ ¹× °¢ µð¹ÙÀÌ½º ´ëÀÀ */
@media (max-width: 768px) {

 .process-title { 
    font-size:22px  !important;
  }


.vip-seat-text {
        /* ¾ç¿· ¿©¹éÀ» 24px¿¡¼­ 15px·Î ÁÙ¿©¼­ ´õ ³Ð°Ô »ç¿ë */
        left: 15px;
        right: 15px;
        bottom: 40px; /* ¾Æ·¡ÂÊ À§Ä¡´Â ÃëÇâ¿¡ ¸Â°Ô Á¶Á¤ */
        
        /* ÅØ½ºÆ®°¡ °¡·Î·Î ±æ°Ô ³ª¿Ã ¼ö ÀÖµµ·Ï Á¦ÇÑ ÇØÁ¦ */
        max-width: 100%; 
        width: auto; 
        
        /* ´Ü¾î ²÷±è ¹æÁö (ÇÑ±ÛÀÌ ¾î»öÇÏ°Ô Àß¸®Áö ¾Ê°Ô) */
        word-break: keep-all; 
    }





   .vip-seat-text h1 {
        font-size: 20px;
        margin-bottom: 8px;
    }


    .vip-seat-text p {
        font-size: 12px; /* º»¹® °¡µ¶¼º È®º¸ */
        line-height: 1.5;
        /* ÁÙ¹Ù²ÞÀÌ ³Ê¹« ÀÚÁÖ ÀÏ¾î³ªÁö ¾Êµµ·Ï ¼³Á¤ */
        white-space: normal; 
    }

    .hero {
        height: 670px;         /* °íÁ¤ ³ôÀÌ */
        padding: 80px 20px 10px 20px; /* »ó ¿ì ÇÏ ÁÂ */
        margin: 0 auto;        /* °¡·Î Áß¾Ó Á¤·Ä */
        box-sizing: border-box; /* ÆÐµù Æ÷ÇÔ Å©±â °è»ê */
        overflow: hidden;      /* È¤½Ã ³ÑÄ§ ¹æÁö */
    }


    .mo-only {
        display: block;
    }


    .hero-info {
        width: 92%;          /* ÁÂ¿ì ¿©¹é¸¸ »ìÂ¦ */
        max-width: none;
    }


    .hero-info h1 {
        font-size: 30px;
        line-height: 1.25;   /* ÁÙ °£°Ý ¿©À¯ */
        letter-spacing: 1px;
        word-break: keep-all;    /* ÇÑ±Û ´Ü¾î ²÷±è ¹æÁö */
    }


    /* °¡°Ý Á¤º¸ ¹× "¿øºÎÅÍ" È®´ë */
    .hero-info .price {
        font-size: 1.7rem !important;
        margin-bottom: 5px;
    }


    .hero-info .price span {
        font-size: 1rem !important;
        color: #f2f2f2 !important;
    }


    /* "3.5 °¡¼Ö¸°..." ¹®±¸ ´ëÆø È®´ë */
    .hero-info .base-model {
        font-size: 0.95rem !important;
        color: rgba(255, 255, 255, 0.9) !important;
        display: block;
        margin-top: 8px;
    }


    /* ½½·Î°Ç */
    .hero-info .slogan {
        max-width: 100%;
        font-size: 16px;
        font-weight: 400;
    }


    /* ÇÏ´Ü ½ºÆå ¾ÆÀÌÅÛ (VIP½ÃÆ® µî) */
    .hero-specs {
        bottom: 8% !important;
        left: 5% !important;
        right: 5% !important;
        width: 90% !important;
        justify-content: space-between !important;
        gap: 0;
    }


    .spec-item .value {
        font-size: 1.1rem !important;
    }


    .spec-item .label {
        font-size: 0.75rem !important;
    }


    .vip-seat-section {
        height: 85vh; /* È­¸é ²Ë */
    }


    .vip-seat-section img {
        height: 100%;
        object-fit: cover; /* ¼¼·Î·Î ±æ°Ô */
    }



/* ±âº» ¼½¼Ç ¼³Á¤ */
.vip-detail-section {
    padding: 20px 0;
    background-color: #000;
  }


/* ÀÌ¹ÌÁö ÄÁÅ×ÀÌ³Ê */
  .detail-container {
    display: flex;
    padding: 0 5%;           /* ÁÂ¿ì ¿©¹é */
    gap: 12px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
  }


  .detail-container::-webkit-scrollbar {
    display: none;           /* ½ºÅ©·Ñ¹Ù ¼û±è */
  }
  .detail-item {
    flex: 0 0 90%;           /* ÀÌ¹ÌÁö ³Êºñ 90% */
    scroll-snap-align: center;
    /* ¼¼·Î·Î ±æ°Ô ¸¸µé±â À§ÇÑ ¼³Á¤ */
    height: 365px;            /* È­¸é ³ôÀÌÀÇ 60% Á¤µµ Â÷Áö (¼ýÀÚ¸¦ Å°¿ì¸é ´õ ±æ¾îÁü) */
    overflow: hidden;
    border-radius: 15px;
  }



.detail-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    
    /* 50%°¡ Á¤Áß¾ÓÀÔ´Ï´Ù. 
       60%~70% Á¤µµ·Î ¼³Á¤ÇÏ¸é ÀÌ¹ÌÁö°¡ ¿ÞÂÊÀ¸·Î ¹Ð¸®¸é¼­ 
       °á°úÀûÀ¸·Î ÀÌ¹ÌÁöÀÇ ¿À¸¥ÂÊ ºÎºÐÀÌ ´õ ¸¹ÀÌ º¸ÀÌ°Ô µË´Ï´Ù. */
    object-position: 15% center; 
    
    display: block;
  }


  .detail-indicator {
    display: flex;
    justify-content: center;
    gap: 8px;
    margin-top: 20px;
  }
.dot {
  width: 8px;
  height: 8px;
  background-color: #555;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.3s ease;
}
.dot.active {
  background-color: #fff;   /* È°¼ºÈ­µÈ Á¡Àº Èò»ö */
}


  .custom-gallery-container {
    /* ¸ð¹ÙÀÏ¿¡¼­´Â ÆÐµùÀ» »ìÂ¦ ÁÙ¿©¼­ °ø°£ È®º¸ */
    margin-left: 25px; 
    gap: 15px;
  }


  .custom-gallery-item {
    flex: 0 0 85%; /* ´ÙÀ½ Ä«µå°¡ »ìÂ¦ º¸ÀÌµµ·Ï */
    scroll-snap-align: start; /* ÆÐµùÀÌ ÀÖÀ» ¶§´Â centerº¸´Ù start°¡ ±ò²ûÇÔ */
  }


  .custom-image-wrapper {
    width: 100%;
    height: auto;
    /* ³ôÀÌ¸¦ ´õ ³ôÀÌ±â À§ÇØ 440¿¡¼­ 520À¸·Î »óÇâ Á¶Á¤ */
    aspect-ratio: 580 / 520 !important; 
    border-radius: 12px;
    overflow: hidden;
  }
  
  .custom-image-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
.custom-text-wrapper h3 { font-size:14px;}
.custom-text-wrapper p { font-size:12px; }
.custom-layout-header h2 { font-size: 20px;}
.custom-layout-header p { font-size:12px;}
  .special-space {

    height: 100vh;          /* È­¸é ÀüÃ¼ */
    min-height: 700px;      /* ÃÖ¼Ò ³ôÀÌ À¯Áö */
    background:
      linear-gradient(
        to bottom,
        rgba(0, 0, 0, 1) 0%,      /* »ó´Ü ÃÖ´ëÄ¡ */
        rgba(0, 0, 0, 0.95) 10%,  /* »ó´Ü ÁøÇÏ°Ô À¯Áö */
        rgba(0, 0, 0, 0.4) 40%,   /* Áß´Ü ¾àÇÏ°Ô ½ÃÀÛ */
        rgba(0, 0, 0, 0.2) 70%,   /* ÇÏ´Ü ´õ ¾àÇÏ°Ô */
        rgba(0, 0, 0, 0) 100%      /* ³¡Àº Åõ¸í */
      ),
      url('../img/images/special.jpg') center / cover no-repeat;
  }
 .special-space {
    height: 100vh;      /* ¸ð¹ÙÀÏÀº È­¸é ±âÁØÀÌ ´õ ÀÚ¿¬½º·¯¿ò */
    min-height: 700px;  /* ³Ê¹« ÀÛ¾ÆÁö´Â °Å ¹æÁö */
    background-position: center;
  }
    .special-space__title {
      font-size: 22px;
       text-align:center;
    }
    .image-flex-box {
        flex-direction: column;
    }
.text-group{max-width:100%;margin-top:80px;right:50px;width:auto;}
.text-group h2 {font-size: 20px;}
.text-group p{font-size:12px;line-height:20px;}

.custom-layout-section { 
  padding: 80px 0; 
}
.img-fit {
object-position:60% center !important;
}
 .arrow.left { left: 30px;font-size:39px;}   
  .arrow.right { right: 30px;font-size:35px;}
  .arrow { width: 50px; height: 50px; font-size: 24px;  background: rgba(0,0,0,0.6); /* ¸ð¹ÙÀÏ¿¡¼­ ¹è°æ ÀÖÀ½ */ }
 .slider-container {
    height:400px; /* ¸ð¹ÙÀÏÀº È­¸é ºñÀ²·Î ÃæºÐÈ÷ Å©°Ô */
     object-position :10% center !important;
  }
.sub-text {
  font-size: 12px;
  line-height:160%;
}
.main-text {
  font-size: 22px;
 line-height:33px;
}
.slider-text-area {
width:360px;

}
.slider-section{padding:80px 0;}
.slide img {

  object-position: 50% center;
}


.card-link {width: 100%;}

.section-title span{font-size:22px;}

.section-title h2{font-size:12px;}

.section-title{margin-bottom:20px;}



.flow { 
    width: 100%; padding: 0 10px; box-sizing: border-box;
    display: flex; flex-wrap: wrap; justify-content: space-around; gap: 60px 20px;
  }
  
  /* ±âÁ¸ row¿Í center ±¸Á¶ ÇØÁ¦ */
  .row.top, .row.bottom { display: contents; }
  .step.center { position: static; order: 4; } /* Step 4¸¦ ¼ø¼­¿¡ ¸Â°Ô ¹èÄ¡ */


  /* ¼ø¼­ °­Á¦ Á¶Á¤ (Step 5,6,7ÀÌ µÚÁýÈ÷Áö ¾Ê°Ô) */
  .row.top .step:nth-child(1) { order: 1; }
  .row.top .step:nth-child(2) { order: 2; }
  .row.top .step:nth-child(3) { order: 3; }
  /* Step 4´Â order: 4 */
  .row.bottom .step:nth-child(3) { order: 5; } /* Step 5 */
  .row.bottom .step:nth-child(2) { order: 6; } /* Step 6 */
  .row.bottom .step:nth-child(1) { order: 7; } /* Step 7 */


  /* ¸ð¹ÙÀÏ¿ë ¿ø Å©±â Á¶Àý (ÇÑ ÁÙ¿¡ 2°³°¡ µé¾î°¡¾ß ÇÏ¹Ç·Î) */
  .step { width: 145px; height: 145px; padding-top: 35px; }


  /* PC ¿¬°á¼± ¼û±â±â */
  .curve-top, .curve-bottom, .step::after, .step::before { display: none !important; }









  /* ¸ð¹ÙÀÏ¿ë Áö±×Àç±× SÀÚ ¼± (¼±ÅÃ »çÇ×: ¿ø »çÀÌ ¿¬°á¼±) */
  .step:not([style*="order: 7"])::after {
    content: ""; position: absolute; background: #555; z-index: 1;
  }
  
  /* 1-2, 3-4, 5-6 °¡·Î¼± */
  .step:nth-child(odd):not([style*="order: 7"])::after {
    top: 50%; right: -25px; width: 25px; height: 1px;
  }



 .flow { 
      display: flex; flex-wrap: wrap; 
      justify-content: space-between; gap: 50px 35px; 
    }
    .row.top, .row.bottom { display: contents; }
    
    /* ÇÑ ÁÙ¿¡ 2°³¾¿ Á¤·Ä */
    .step { width: 45%; height: 42vw; max-height: 170px; max-width: 170px; padding:0;}




    /* ¼ø¼­: 1-2 / 3-4 / 5-6 / 7 */
    .row.top .step:nth-child(1) { order: 1; }
    .row.top .step:nth-child(2) { order: 2; }
    .row.top .step:nth-child(3) { order: 3; }
    .step.center { order: 4; position: relative !important; } 
    .row.bottom .step:nth-child(1) { order: 5; } /* Step 5 */
    .row.bottom .step:nth-child(2) { order: 6; } /* Step 6 */
    .row.bottom .step:nth-child(3) { order: 7; } /* Step 7 */






  


    .curve-top, .curve-bottom, .step::after { display: none !important; }


.num{font-size:12px;}
.text{font-size:14px;}


 .contact-section .contact-container {
    flex-direction: column;
    text-align: center;
    gap: 30px;
  }


  .contact-text {
    max-width: 100%;
  }


  .contact-text h1 {
    font-size: 28px;
  }


  .contact-text p {
    font-size: 15px;
  }


  .contact-buttons {
    margin-left: 0;
    justify-content: center;
    flex-wrap: wrap;
  }


  .contact-btn {
    width: 100%;
    max-width: 260px;
  }
 

}








/* Áß°£ È­¸é (769px ~ 1200px) ´ëÀÀ */
@media (min-width: 769px) and (max-width: 1200px) {
    .hero {
        background-size: cover;      /* ÇÊ¿äÇÏ¸é Á¶Á¤ */
        width: 100%;                /* °¡º¯ ³Êºñ À¯Áö */
        height: auto;               /* ºñÀ² ¸Â°Ô Á¶Á¤ °¡´É */
        min-height: 500px;          /* ÃÖ¼Ò ³ôÀÌ ÁöÁ¤ */
    }


    .hero-info h1 {
        font-size: 30px;            /* Á¦¸ñ ±ÛÀÚ Å©±â */
        letter-spacing: 1px;        /* ±ÛÀÚ °£°Ý */
    }


    .hero-info .slogan {
        font-size: 16px;            /* ½½·Î°Ç ±ÛÀÚ Å©±â */
        letter-spacing: 2px;
    }


}