/* BASIC css start */
/* ======================== */
/* ±ÝÂî °øÅë + »ó´Ü + ¸ÞÀÎ µðÀÚÀÎ CSS */
/* ======================== */

/* ±âº» ÃʱâÈ­ */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  -webkit-text-size-adjust: none;
}
html, body {
  font-family: 'Pretendard', 'Helvetica Neue', Helvetica, sans-serif;
  font-size: 14px;
  line-height: 1.5;
  color: #000;
  background: #fff;
}
ul, ol {
  list-style: none;
}
a {
  color: inherit;
  text-decoration: none;
}
img {
  max-width: 100%;
  display: block;
}

/* °øÅë À¯Æ¿ */
.dn { display: none !important; }
.txt-center { text-align: center; }
.fl { float: left !important; }
.fr { float: right !important; }
.mt5 { margin-top: 5px; }

/* ¹öÆ° °øÅë */
.btn {
  display: inline-block;
  padding: 10px 15px;
  text-align: center;
  font-weight: 500;
  border: none;
  cursor: pointer;
}
.btn_Black {
  background: #000;
  color: #fff;
}
.btn_White {
  background: #fff;
  border: 1px solid #ccc;
  color: #333;
}

/* wrap */
#wrap {
  min-width: 320px;
  overflow: hidden;
}

/* ¸ÞÀÎ ºñÁÖ¾ó ¹è³Ê */
#mainspot {
  position: relative;
}
#mainspot .swiper-slide img {
  border-radius: 0 0 12px 12px;
}
#mainspot .swiper-pagination-fraction {
  position: absolute;
  bottom: 16px;
  left: 16px;                     /* ¿ÞÂÊ ¿©¹éÀº ±×´ë·Î */
  background: rgba(0,0,0,0.5);
  border-radius: 4px;
  padding: 2px 6px;
  font-size: 12px;
  color: #fff;
  width: auto !important;         /* ¡ç ÅؽºÆ® ±æÀ̸¸Å­¸¸ */
  display: inline-block !important; /* ¡ç ¹Ú½º°¡ ±æ°Ô ¾È ´Ã¾î³ªµµ·Ï */
}

/* ¾ÆÀÌÄÜ Ä«Å×°í¸® */
#category-grid {
  padding: 20px 10px;
  margin-top: 20px;
  background: #fff;
}
.category-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
}
.category-grid li {
  border: 1px solid #eee;
  background: #fff;
}
.category-grid li a {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 14px;
  height: 40px;
  transition: background 0.3s, color 0.3s;
}
.category-grid li a:hover {
  background: #000;
  color: #fff;
}

/* ÅÇ »óÇ° */
#section3.product_tab {
  padding: 20px 10px;
  background: #fff;
}
#section3 .tab_title ul {
  display: flex;
  justify-content: space-between;
  margin-bottom: 8px;
}
#section3 .tab_title li {
  font-size: 14px;
  padding: 6px 12px;
  cursor: pointer;
  border-bottom: 2px solid transparent;
}
#section3 .tab_title li.active {
  font-weight: bold;
  border-bottom: 2px solid #000;
}

/* ÅÇ »óÇ° ¸®½ºÆ® */
#section3 .list_shopping2x ul.items {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 0;
  padding: 0;
}
#section3 .item-list {
  width: 50%;
  padding: 0 6px;
  box-sizing: border-box;
}
.item-list .thumb img {
  display: block;
  width: 100%;
  aspect-ratio: 365 / 536;
  object-fit: cover;
}
.item-list .desc {
  margin-top: 8px;
  text-align: center;
}
.item-list .desc p {
  margin: 4px 0;
  font-size: 13px;
  line-height: 1.4;
}

/* ÅÇ »óÇ° hover Ç¥½Ã */
.item-list .desc,
.item-list .prd-info {
  opacity: 0;
  transition: opacity 0.3s;
}
.item-list.hover .desc,
.item-list.hover .prd-info {
  opacity: 1;
}

/* À̺¥Æ® ¹è³Ê */
#section10,
#section11 {
  margin-top: 15px;
  background: #f5f5f5;
}
#section10 .title,
#section11 .title {
  margin-bottom: 16px;
  text-align: center;
  font-weight: bold;
  font-size: 16px;
}
#section10 .swiper-slide img,
#section11 .swiper-slide img {
  width: 100%;
  height: auto;
  border-radius: 0;
}

/* ½º¿ÍÀÌÇÁ ³×ºñ ¹öÆ° */
.swiper-button-next,
.swiper-button-prev {
  width: 24px;
  height: 24px;
  background: rgba(0,0,0,0.3);
  border-radius: 0;
}
.swiper-button-next:after,
.swiper-button-prev:after {
  font-size: 14px;
  color: #fff;
}







/* -------------------------------------------
   [Ãß°¡] ÅÇ»óÇ° Ä«µå: ÇÏ´Ü 40% ¹ÝÅõ¸í ¿À¹ö·¹ÀÌ + Á¤º¸ Ç¥½Ã
   - ±âÁ¸ .desc ¸¦ À̹ÌÁö À§·Î ¿Ã·Á¼­ ¿À¹ö·¹ÀÌ·Î »ç¿ë
   - PC : :hover ½Ã ³ëÃâ / ¸ð¹ÙÀÏ : .is-hover ¶Ç´Â .hover Ŭ·¡½º°¡ ºÙÀ¸¸é ³ëÃâ
--------------------------------------------*/

/* Ä«µå/À̹ÌÁö Æ÷Áö¼Å´× ±âº»°ª */
#section3 .item-list {
  position: relative;
  overflow: hidden; /* ¿À¹ö·¹ÀÌ°¡ ±ò²ûÇÏ°Ô À߸®µµ·Ï */
}
#section3 .item-list .thumb {
  position: relative; /* ¿À¹ö·¹ÀÌ ±âÁØÁ¡ */
}

/* ¿À¹ö·¹ÀÌ·Î »ç¿ëÇÒ desc ÀçÁ¤ÀÇ */
#section3 .item-list .desc {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  overflow: hidden; /* µÕ±Ù ¸ð¼­¸® ¹Ù±ù À߸®µµ·Ï */

  /* ³ôÀÌ: À̹ÌÁöÀÇ ÇÏ´Ü 40% ¿µ¿ª */
  height: 45%;

  /* ¹è°æ: ºí·¢ 40% Åõ¸íµµ */
  background: rgba(0,0,0,0.4);

  color: #fff;
  margin: 0;            /* ±âÁ¸ margin-top:8px ¹«È¿È­ */
  
  
  /* À§ÂÊ ¿©¹éÀ» Á¶±Ý Å°¿ö¼­ ù ÁÙÀ» ´õ ¾Æ·¡·Î ³»¸² */
  padding: 20px 10px 8px; /* top right/left bottom */
  /* ÇÊ¿ä½Ã 12~16px »çÀ̷θ¸ ¹Ì¼¼ Á¶Á¤ */
  
  display: flex;
  flex-direction: column;
  justify-content: flex-end; /* ÅؽºÆ®¸¦ ¾Æ·¡ Á¤·ÄÇÏ¸é ¾ÈÁ¤Àû */

  opacity: 0;           /* ±âº» ¼û±è */
  transform: translateY(8px);
  transition: opacity .25s ease, transform .25s ease;
  pointer-events: none; /* ¿À¹ö·¹ÀÌ°¡ ¶°µµ ¾Æ·¡ Ŭ¸¯ ¹æÇØ X (ÇÊ¿ä½Ã Á¦°Å) */
}

/* desc ÅؽºÆ® ºÎµå·¯¿î ÆäÀ̵å + »ì¦ ¾Æ·¡¿¡¼­ ¿Ã¶ó¿À±â */
#section3 .item-list .desc {
  opacity: 0;
  transform: translateY(10px); /* »ì¦ ¾Æ·¡¿¡¼­ */
  transition: opacity var(--tab-dur, 220ms) var(--tab-ease, cubic-bezier(.2,.6,.2,1)),
              transform var(--tab-dur, 220ms) var(--tab-ease, cubic-bezier(.2,.6,.2,1));
}

/* È°¼º ÅÇ¿¡¼­¸¸ desc Ç¥½Ã */
#section3.product_tab .tab_content.is-current .item-list .desc {
  opacity: 1;
  transform: translateY(0);
}





#section3 .item-list .desc p {
  margin: 1px 0;     /* ¼¼·Î °£°Ý »ì¦ ÁÙÀÓ (±âÁ¸ 4px ¡æ 1px) */
  line-height: 1.28; /* ÁÙ°£°Ý ŸÀÌÆ®ÇÏ°Ô */
}


/* ÅؽºÆ® Á¤¸® */
#section3 .item-list .desc p {
  margin: 2px 0;
  line-height: 1.35;
  font-size: 13px;
  color: #fff;
  word-break: keep-all;
}
#section3 .item-list .desc .price strong { color:#fff; }

/* ³ëÃâ Æ®¸®°Å: PC hover */
#section3 .item-list:hover .desc {
  opacity: 1;
  transform: translateY(0);
}

/* ³ëÃâ Æ®¸®°Å: JS·Î ºÙÀ̴ Ŭ·¡½º (¸ð¹ÙÀÏ ÅÇ/Ŭ¸¯) */
#section3 .item-list.is-hover .desc,
#section3 .item-list.hover .desc {
  opacity: 1;
  transform: translateY(0);
}



/* -------------------------------------------
   [Ãß°¡] ÅÇ ÄÁÅ×ÀÌ³Ê ½º¿ÍÀÌÇÁ ¼³Á¤
   - pan-y Çã¿ë: ¼¼·Î ½ºÅ©·ÑÀº ±×´ë·Î, °¡·Î´Â Á¦½ºÃ³·Î »ç¿ë
--------------------------------------------*/


/* ½º¿ÍÀÌÇÁ ¿µ¿ª: ¼¼·Î ½ºÅ©·Ñ¸¸ ºê¶ó¿ìÀú°¡ ó¸® */
#section3.product_tab .tab_container { 
  position: relative; 
  touch-action: pan-y; 
  overflow: hidden;
}

/* ÆгÎÀ» °ãÃijõ°í Å©·Î½ºÆäÀ̵å */
#section3.product_tab .tab_content{
  position: absolute;
  inset: 0;                 /* top:0; right:0; bottom:0; left:0 */
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity var(--tab-dur, 220ms) var(--tab-ease, ease), 
              visibility var(--tab-dur, 220ms) var(--tab-ease, ease);
  will-change: opacity;
  transform: translateZ(0); /* GPU ÈùÆ®: Çø®Ä¿ ¹æÁö */
}

/* ÇöÀç º¸ÀÌ´Â ÆгΠ*/
#section3.product_tab .tab_content.is-current{
  opacity: 1;
  visibility: visible;
  pointer-events: auto;     /* Àüȯ Áß¿¡µµ Áï½Ã Ŭ¸¯ °¡´É */
  z-index: 2;
}

/* µé¾î¿Ã ÆгÎ(¼±Åà »çÇ×: »ì¦ À§¿¡ ¾ñ±â) */
#section3.product_tab .tab_content.is-next{
  z-index: 3;
}

/* ¸ð¼Ç ¹Î°¨ »ç¿ëÀÚ¸¦ ¹è·Á */
@media (prefers-reduced-motion: reduce){
  #section3.product_tab .tab_content{ transition: none; }
}





/* ÅÇ ÄÁÅ×À̳ʴ ÀÏ¹Ý È帧À¸·Î */
#section3.product_tab .tab_container{
  position: static !important;
  overflow: visible !important;
  touch-action: auto !important;
}

/* ÅÇ ÆгÎÀ» ÀÏ¹Ý ºí·ÏÀ¸·Î(Àý´ëÀ§Ä¡/Åõ¸í ¹«·ÂÈ­) */
#section3.product_tab .tab_content{
  position: relative !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: none !important;
  transition: none !important;
  display: none; /* jQuery°¡ show()/hide()·Î Á¦¾î */
}

/* ù ¹ø° ÅǸ¸ ±âº» ³ëÃâ */
#section3.product_tab .tab_content:first-child {
  display: block;
}

/* ¿ÀŸ ¼öÁ¤: 20x -> 20px */
#section3 .item-list .desc{
  padding: 20px 10px 8px; /* ¡ç ¿©±â px */
}

/* ÅÇ ÆгΠ¿µ¿ª: ¼¼·Î ½ºÅ©·ÑÀº ºê¶ó¿ìÀú°¡ ó¸®, °¡·Î Á¦½ºÃ³¸¸ Ä¿½ºÅÒ */
#section3.product_tab .tab_container { touch-action: pan-y; }


/* ÅÇ ÆгÎ: Å©·Î½ºÆäÀ̵å¿ë */
#section3.product_tab .tab_container{ position:relative; touch-action:pan-y; }
#section3.product_tab .tab_content{
  position:absolute; inset:0;
  opacity:0; visibility:hidden; pointer-events:none;
  transition:opacity var(--tab-dur,220ms) var(--tab-ease,cubic-bezier(.2,.6,.2,1));
  will-change:opacity; transform:translateZ(0);
}
#section3.product_tab .tab_content.is-current{
  opacity:1; visibility:visible; pointer-events:auto; z-index:2;
}
#section3.product_tab .tab_content.is-next{ z-index:3; } /* µé¾î¿Ã ÆгÎÀ» »ì¦ À§¿¡ */




/* »ó´Ü GNB ³ôÀÌ(¼öÁ¤ °¡´É) */
:root { --gnbH: 52px; }

/* ¼½¼Ç3 Åǹٸ¦ sticky·Î °íÁ¤ */
#section3 .tab_title{
  position: sticky;
  top: var(--gnbH);   /* °íÁ¤µÉ y À§Ä¡ = GNB ¹Ù·Î ¾Æ·¡ */
  z-index: 200;       /* »óÇ° Ä«µåº¸´Ù À§ */
  background: #fff;   /* °íÁ¤µÉ ¶§ ¾Æ·¡ ÄÁÅÙÃ÷¶û °ãÄ¡Áö ¾Ê°Ô */
}

/* °íÁ¤µÉ ¶§ ½Ã°¢Àû ºÐ¸®(¼±ÅÃ) */
#section3 .tab_title.stuck{
  box-shadow: 0 2px 8px rgba(0,0,0,.06);
  border-bottom: 1px solid #eee;
}


/* ¼½¼Ç3 Àüü´Â ±âº» ½ºÅà */
#section3.product_tab{ position:relative; z-index:0; }

/*  Åǹٸ¦ ÃÖ»ó´ÜÀ¸·Î ¶ç¿ö Ŭ¸¯ °¡´ÉÇÏ°Ô */
#section3 .tab_title{
  position: sticky;
  top: var(--gnbH);
  background:#fff;
  z-index: 10010;          /* ÅÇ ÄÜÅÙÃ÷(¾Æ·¡ 1)º¸´Ù ³ô°Ô */
}

/* ÅÇ ÄÜÅÙÃ÷¿Í ÄÁÅ×À̳ʴ Åǹ٠¾Æ·¡ */
#section3 .tab_container{ position:relative; z-index:1; }
#section3 .tab_content{ z-index:1; }

/* (¼±ÅÃ) ½Ã°¢Àû ±¸ºÐ¼± */
#section3 .tab_title::after{
  content:''; position:absolute; left:0; right:0; bottom:-1px;
  height:1px; background:#eee;
}

/* Ä«µå ¿À¹ö·¹ÀÌ°¡ À§·Î »ßÁ®³ª¿Í µ¤´Â ÀÏ ¹æÁö */
#section3 .item-list{ overflow:hidden; }


/* Ä«µå ¿À¹ö·¹ÀÌ/ÅؽºÆ®´Â Ŭ¸¯ Åë°ú */
#section3 .item-list .desc{ pointer-events: none; }
/* À̹ÌÁö a°¡ Àüü¸¦ ¹Þµµ·Ï */
#section3 .item-list .thumb a{ display:block; }



/* ¼½¼Ç3 ½ºÅà ÃʱâÈ­ */
#section3.product_tab{ position:relative; z-index:0; }

/*  Åǹٰ¡ Ç×»ó Á¦ÀÏ À§ */
#section3 .tab_title{
  position: sticky;
  top: var(--gnbH, 52px);    /* GNB ¹Ù·Î ¾Æ·¡ */
  background:#fff;
  z-index: 10010;            /* ÅÇ ÄÜÅÙÃ÷º¸´Ù ³ô°Ô */
  pointer-events: auto;
}

/* ÅÇ ÄÜÅÙÃ÷´Â Åǹ٠¾Æ·¡ */
#section3 .tab_container{ position:relative; z-index:1; }
#section3 .tab_content{ z-index:1; }

/* Ä«µå°¡ Åǹٸ¦ µ¤Áö ¾Êµµ·Ï */
#section3 .item-list{ overflow:hidden; }



/* ¼³¸í: È£¹ö ¿À¹ö·¹ÀÌ ¾È¿¡¼­ °¡°ÝÀ» ¸Ç ¾Æ·¡·Î ³»¸² + ¿©¹é ¹Ì¼¼ Á¶Á¤ */
.product-item .item-list .prd-info{
  display:flex;                /* Ȥ½Ã³ª ´ëºñ (ÀÌ¹Ì flex¸é ¿µÇâ ¾øÀ½) */
  flex-direction:column;
  justify-content:flex-start;  /* ³»¿ëÀº À§ÂʺÎÅÍ ½×°í¡¦ */
  min-height:45%;              /* ¿À¹ö·¹ÀÌ ³ôÀÌ°¡ ³Ê¹« ³·À¸¸é »ì¦ È®º¸ */
  padding:10px 8px 4px;       /* ¹Ù´Ú ¿©¹é(14px) »ì¦ ´Ã·Á¼­ ´õ ¾Æ·¡ ´À³¦ */
}

.product-item .item-list .prd-info .prd-price{
  margin-top:auto;             /* °¡°ÝÀ» ¹Ù´ÚÀ¸·Î ¡®Åö¡¯ ¶³¾î¶ß¸² */
  padding-bottom:1px;          /* ¹Ù´Ú¿¡¼­ »ì¦ ¶ç¿ì±â(¿øÇÏ¸é ¼öÄ¡ Á¶Àý) */
  }










/* ========================
   [ADD] ÅÇ Àüȯ ¹æÇ⼺ ÆäÀ̵å/½½¶óÀ̵å
   ======================== */

/* ±âº» »óÅÂ: Àüȯ ½Ã JS°¡ show()/hide()¿Í Ŭ·¡½º·Î Á¦¾î */
#section3.product_tab .tab_content{
  position: relative;
  display: none;
  opacity: 0;
  transform: translateX(0);
  will-change: opacity, transform;
}

#section3.product_tab .tab_content.is-current{
  display: block;
  opacity: 1;
  transform: translateX(0);
}

/* µé¾î¿Ã ÆгΠ*/
#section3.product_tab .tab_content.anim-enter{
  display: block;
  opacity: 0;
  transition: opacity .22s cubic-bezier(.2,.6,.2,1),
              transform .22s cubic-bezier(.2,.6,.2,1);
}
#section3.product_tab .tab_content.anim-enter.to-right{  /* ¿À¸¥ÂÊ ÅÇÀ¸·Î À̵¿ */
  transform: translateX(-12px);
}
#section3.product_tab .tab_content.anim-enter.to-left{   /* ¿ÞÂÊ ÅÇÀ¸·Î À̵¿ */
  transform: translateX(12px);
}
#section3.product_tab .tab_content.anim-enter.anim-in{
  opacity: 1;
  transform: translateX(0);
}

/* ³ª°¥ ÆгΠ*/
#section3.product_tab .tab_content.anim-leave{
  display: block;
  opacity: 1;
  transition: opacity .22s cubic-bezier(.2,.6,.2,1),
              transform .22s cubic-bezier(.2,.6,.2,1);
}
#section3.product_tab .tab_content.anim-leave.to-right{
  transform: translateX(12px);
  opacity: 0;
}
#section3.product_tab .tab_content.anim-leave.to-left{
  transform: translateX(-12px);
  opacity: 0;
}

/* ¸ð¼Ç ¹Î°¨ »ç¿ëÀÚ */
@media (prefers-reduced-motion: reduce){
  #section3.product_tab .tab_content,
  #section3.product_tab .tab_content.anim-enter,
  #section3.product_tab .tab_content.anim-leave{
    transition: none !important;
    transform: none !important;
  }
}

/* ========================
   [FIX] Ä«µå ¿À¹ö·¹ÀÌ: Ŭ¸¯ÇÑ Ä«µå¸¸ º¸ÀÌ°Ô
   (ÅÇ Àüü°¡ ´Ù ÄÑÁö´Â ÀÌÀü ±ÔÄ¢ ¹«·ÂÈ­)
   ======================== */
#section3.product_tab .tab_content .item-list .desc{
  opacity: 0 !important;
  transform: translateY(10px) !important;
  transition: opacity .25s ease, transform .25s ease;
}
#section3.product_tab .tab_content .item-list.hover .desc,
#section3.product_tab .tab_content .item-list.is-hover .desc,
#section3.product_tab .tab_content .item-list:hover .desc{
  opacity: 1 !important;
  transform: translateY(0) !important;
}


/* ========================
   [TIP] ½º¿ÍÀÌÇÁ Á¦½ºÃ³¿Í ¼¼·Î ½ºÅ©·Ñ °øÁ¸
   ======================== */
#section3.product_tab .tab_container{
  touch-action: pan-y; /* ¼¼·Î ½ºÅ©·ÑÀº ºê¶ó¿ìÀú°¡ ó¸® */
}


/* ºü¸¥ Àüȯ ÇÁ·ÎÆÄÀÏ */
#section3.product_tab .tab_content.anim-enter,
#section3.product_tab .tab_content.anim-leave{
  transition: opacity .14s cubic-bezier(.2,.6,.2,1),
              transform .14s cubic-bezier(.2,.6,.2,1) !important;
}
#section3.product_tab .tab_content.anim-enter.to-right{ transform: translateX(-8px) !important; }
#section3.product_tab .tab_content.anim-enter.to-left { transform: translateX( 8px) !important; }
#section3.product_tab .tab_content.anim-leave.to-right{ transform: translateX( 8px) !important; }
#section3.product_tab .tab_content.anim-leave.to-left { transform: translateX(-8px) !important; }

/* È£¹ö ¿À¹ö·¹À̵µ Áï°¢ ¹ÝÀÀ */
#section3 .item-list .desc{
  transition: opacity .12s ease, transform .12s ease !important;
  will-change: opacity, transform;
}



/* === [ADD] ÅÇ ÀüȯÀ» '¼ø¼ö ÆäÀ̵å'·Î °íÁ¤ (ºü¸£°í Èçµé¸² ¾øÀ½) === */
#section3.product_tab .tab_content{
  position: relative !important;
  display: none;                 /* JS°¡ show()/hide() */
  opacity: 0;
  transform: none !important;    /* Á¿ì À̵¿ È¿°ú Á¦°Å */
  will-change: opacity;
}
#section3.product_tab .tab_content.is-current{
  display: block;
  opacity: 1;
}
#section3.product_tab .tab_content.anim-enter,
#section3.product_tab .tab_content.anim-leave{
  transition: opacity .12s ease !important;  /* ¸Å¿ì ºü¸¥ ÆäÀ̵å */
}

/* È£¹ö ¿À¹ö·¹ÀÌ´Â Áï°¢ ¹ÝÀÀ */
#section3 .item-list .desc{
  transition: opacity .12s ease, transform .12s ease !important;
}

/* Ȥ½Ã ¿¹Àü translateX ±ÔÄ¢ÀÌ ³²¾ÆÀ־ ¹«·ÂÈ­ */
#section3.product_tab .tab_content.to-left,
#section3.product_tab .tab_content.to-right{ transform:none !important; }


/* -------------------------------------------
   [ADD] ÅÇ Àüȯ: ¼ø¼ö ÆäÀ̵å(ºü¸§) + Èçµé¸² Á¦°Å
--------------------------------------------*/
#section3.product_tab .tab_content{
  position: relative !important;
  display: none;
  opacity: 0;
  transform: none !important; /* ÁÂ¿ì ¹Ð¸² ¹æÁö */
  will-change: opacity;
}
#section3.product_tab .tab_content.is-current{
  display: block;
  opacity: 1;
}
#section3.product_tab .tab_content.anim-enter,
#section3.product_tab .tab_content.anim-leave{
  transition: opacity .12s ease !important; /* ¸Å¿ì ºü¸¥ ÆäÀ̵å */
}

/* ¿¹Àü translateX Ŭ·¡½º°¡ ³²¾Æ À־ ¹«È¿È­ */
#section3.product_tab .tab_content.to-left,
#section3.product_tab .tab_content.to-right{ transform:none !important; }

/* È£¹ö ¿À¹ö·¹ÀÌ: ÇØ´ç Ä«µå¸¸ Áï½Ã º¸À̱â */
#section3.product_tab .tab_content .item-list .desc{
  opacity: 0 !important;
  transform: translateY(10px) !important;
  transition: opacity .12s ease, transform .12s ease !important;
}
#section3.product_tab .tab_content .item-list.hover .desc,
#section3.product_tab .tab_content .item-list.is-hover .desc,
#section3.product_tab .tab_content .item-list:hover .desc{
  opacity: 1 !important;
  transform: translateY(0) !important;
}



/* ½º¿ÍÀÌÇÁ¿Í ¼¼·Î ½ºÅ©·Ñ °øÁ¸ */
#section3.product_tab .tab_container{ touch-action: pan-y; }

/* Ãʱâ Æø °è»ê Áß Èçµé¸² ¹æÁö */
html, body { overflow-x: hidden; }






/* ---------------------------------------------
  [ADD] ¼½¼Ç3 Åǹ٠»ó´Ü °íÁ¤ (sticky) + Æú¹é Ŭ·¡½º
  - GNB ³ôÀ̸¸Å­ ¶³¾îÁ®¼­ °íÁ¤µÇµµ·Ï CSS º¯¼ö »ç¿ë
----------------------------------------------*/

/* GNB ³ôÀÌ ±âº»°ª(ÇÊ¿ä ½Ã JS¿¡¼­ Àç¼³Á¤) */
:root { --gnbH: 52px; }

#section3.product_tab { position: relative; z-index: 0; }



/* ==============================================
   [GUMZZI] Åǹ٠°íÁ¤: fixed + placeholder (ÃÖÁ¾¾È)
   - JS°¡ .is-fixed¸¦ ºÙ¿´´Ù ¶Ã´Ù ÇÔ
   - top ¿ÀÇÁ¼ÂÀº --tabStickyTop(¾øÀ¸¸é --gnbH¡æ52px)
============================================== */
/* sticky´Â ¾²Áö ¾ÊÀ½(À§¿¡¼­ »èÁ¦ or ¹«·ÂÈ­) */
#section3 .tab_title{
  z-index: 10020;
  background: #fff;
}

#section3 .tab_title.is-fixed{
  position: fixed !important;
  top: calc(var(--tabStickyTop, var(--gnbH, 52px)) + 0px); 
  left: 0;
  right: 0;
  width: 100%;
  box-shadow: 0 2px 8px rgba(0,0,0,.06);
  border-bottom: 1px solid #eee;
}

/* ÀÚ¸®Ã¤¿ò(Á¡ÇÁ ¹æÁö)   ³ôÀÌ´Â JS°¡ offsetHeight·Î ä¿ò */
#section3 .tab_title_placeholder{ height: 0; }




/* Åǹٰ¡ fixed·Î ¹Ù²ð ¶§ Âî±×·¯Áü ¹æÁö¿ë ÀÚ¸®Ã¤¿ò */
#section3 .tab_title_placeholder{ height: 0; }
#section3 .tab_title.is-fixed + .tab_title_placeholder{ height: 48px; } /* Åǹ٠³ôÀÌ¿¡ ¸Â°Ô Á¶Á¤(ÇÊ¿ä½Ã) */



/* ===========================
   [ADD] ½º¿ÍÀÌÇÁ ¾ÈÁ¤È­ º¸Á¶
   - À̹ÌÁö µå·¡±×/¼±Åà ¹æÁö
   - ÅؽºÆ®µµ µå·¡±× ¾È µÇ°Ô
=========================== */
#section3 .tab_container img {
  -webkit-user-drag: none;
  user-select: none;
}
#section3 .tab_container {
  -webkit-user-select: none;
  user-select: none;
  touch-action: pan-y; /* ¼¼·Î ½ºÅ©·ÑÀº ºê¶ó¿ìÀú ó¸® */
}



/* ¸ÞÀΠŸÀÌƲ °øÅë (¿¹: ±âȹÀü) */
.title h2 {
  font-size: 18px;           /* ±âÁ¸º¸´Ù »ì¦ ÁÙÀÓ */
  font-weight: 600;          /* °úÇÑ Bold ´ë½Å ¼¼¹Ìº¼µå */
  color: #222;               /* ¼ø°ËÁ¤º¸´Ù ºÎµå·¯¿î Áøȸ»ö */
  letter-spacing: -0.4px;    /* ÇÑ±Û ÀÚ°£ »ì¦ ÁÙÀ̱â */
  margin: 2px 0;            /* À§¾Æ·¡ °ø°£ ±ÕÇü */
  text-align: center;        /* Áß¾Ó Á¤·Ä (ÇÊ¿ä½Ã) */
  position: relative;
}

/* ¹ØÁÙ ¶óÀÎ Æ÷ÀÎÆ® */
.title h2::after {
  content: "";
  display: block;
  width: 40px;
  height: 2px;
  background: #f1191f;      /* ºê·£µå Æ÷ÀÎÆ® Ä÷¯ */
  margin: 2px auto 0;
  border-radius: 2px;
}
 /* [PATCH] ±âȹÀü Á¦¸ñ ¿µ¿ª À§ÂÊ Æеù Ãß°¡ */
#section10 .title {
  padding-top: 12px;   /* ¿øÇÏ´Â ¸¸Å­ Á¶Àý: 8~16px Ãßõ */
}



/* === ¸ÞÀÎ ½½¶óÀÌ´õ: 460x690 ¼¼·Î ºñÀ² °íÁ¤ === */
.slide-media{
  position: relative;
  width: 100%;
  aspect-ratio: 460 / 690;   /* 460:690 ºñÀ² À¯Áö */
  background: #000;
  overflow: hidden;
}

/* ¿µ»ó/À̹ÌÁö °øÅë */
.slide-media > video,
.slide-media > img{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* ¿µ»ó À§ Àüü Ŭ¸¯ ¿µ¿ª */
.slide-link{
  position: absolute;
  inset: 0;
  z-index: 2;          /* Ç×»ó À§·Î */
  display: block;
}

/* ºñµð¿À´Â ÅÍÄ¡ À̺¥Æ® ¾È ¹Þ°Ô ¡æ Ŭ¸¯ ½Ã ¸µÅ©·Î ¹Ù·Î À̵¿ */
.slide-media > video{ pointer-events: none; }

/* aspect-ratio ¹ÌÁö¿ø ºê¶ó¿ìÀú(±¸Çü Safari µî) ´ëÀÀ */
@supports not (aspect-ratio: 1) {
  .slide-media::before{
    content: "";
    display: block;
    padding-top: 150%;  /* 690/460 * 100 = 150% */
  }
}


/* ¸ÞÀÎ ¹è³ÊÀÇ ºñµð¿À¸¦ À̹ÌÁö¿Í µ¿ÀÏÇÏ°Ô */
#mainspot .slide-media { aspect-ratio: 2 / 3; }      /* 2:3 °íÁ¤ */
#mainspot .slide-media > video{
  object-fit: cover;             /* ²Ë ä¿ò(ÇÊ¿ä½Ã ÀϺΠũ·Ó) */
  object-position: center center;/* Áß¾Ó ±âÁØ */
}





#section3 .item-list .desc .prdcolor{
  margin: 6px 0 4px;
  display:flex; justify-content:center; align-items:center; gap:6px;
  flex-wrap: wrap; /* ĨÀÌ ¸¹À» ¶§ ÀÚµ¿ ÁÙ¹Ù²Þ (¿øÇϸé Áö¿öµµ µÊ) */
}
#section3 .item-list .desc .prdcolor span{
  width:12px; height:12px; border-radius:50%;
  display:inline-block;
  border:1px solid rgba(255,255,255,.65); /* ¾îµÎ¿î ¹è°æ¿¡¼­µµ º¸ÀÌ°Ô */
}


/* [patch] ¼­ºê³×ÀÓ°ú »ö»óĨ »çÀÌ °£°Ý »ì¦ ¡è */
#section3 .item-list .desc .code{ margin-bottom: 6px !important; }   /* 4¡æ6px Á¤µµ */
#section3 .item-list .desc .prdcolor{ margin-top: 6px !important; }  /* ±âÁ¸ 6À̸é 8·Î, ÇÊ¿ä ½Ã 6~8·Î ¹Ì¼¼Á¶Á¤ */





/* BASIC css end */