/* 사용자 공통 스타일 파일입니다. 공통으로 적용할 스타일 코드를 작성해주세요. */

/* 새 메뉴 바(GNB) 디자인 - 260303 */
.new-gnb {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 10px; 
    background-color: #ffffff;

    border-bottom: 1px solid var(--gray200);
    
    /* 텍스트 낙하 방지 핵심 코드 */
    overflow-x: auto;    /* 공간 부족 시 옆으로 스크롤 생성 */
    white-space: nowrap; /* 글자가 아래로 떨어지는 것 방지 */
}

/* 수정된 메뉴 스타일 */
.new-gnb a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px 16px;
    line-height: 22px;
    text-decoration: none;
    color: #222;
    font-size: 16px;
    font-weight: 400;
    flex-shrink: 0;
    
    /* [추가] 하단 테두리 공간 미리 확보 (투명하게) */
    border-bottom: 2px solid transparent; 
    
    /* [선택] 부드러운 전환을 원한다면 추가 */
    transition: color 0.2s, border-color 0.2s; 
}

.new-gnb a.active {
  /* font-weight: 500; -> 글자 굵기 변화로 인한 미세한 떨림도 싫다면 주석 처리하세요 */
  font-weight: 500; 
  color: #FF2C2E;
  
  /* [수정] 이미 그려진 transparent 라인에 색상만 입힘 */
  border-bottom-color: #FF2C2E; 
}

/* 마이페이지 URL일 때 .new-gnb 숨기기 */
  body[id*="my-page"] .new-gnb,
  body[class*="my-page"] .new-gnb,
  #myPage .new-gnb {
    display: none;
}


/* 1. 기본 상태 (메인): 서브 로고 숨김 */
.logo-sub {
    display: none !important;
}
.logo-main {
    display: block !important;
  
}

/* 2. 서브 페이지 상태: body나 상위 요소에 .is-sub가 붙었을 때 반전 */
.is-sub .logo-main, 
body[path-name*="sub"] .logo-main { 
    display: none !important;
}

.is-sub .logo-sub, 
body[path-name*="sub"] .logo-sub {
    display: block !important;
}


/* 상품진열상세페이지 디자인 */
.display-detail .total-sort-flex,
.event-detail .total-sort-flex{
  display:flex;
  justify-content:end;
  gap:10px;
}
.pd0 {padding:0;}
.pd20 {padding:20px;}
.pd0-20 {padding:0 20px;}
.pdl0 {padding-left:0;}
.pdr20 {padding-right:20px !important;}
.pdt0 {padding-top:0 !important;}
.thumb-item__icon-box span,
.product-thumb__sticker {
    background:#F0F1F4;
    color: #52585E;
    padding: 2px 5px;
    font-size: .7rem;
}
.select-sort-section button{
  border:none !important;
}
.event-detail .tabs .tab-menu {
  display:flex;
  justify-content:center;
  gap:0;
  width:100%;
  padding-bottom:20px;
}
.event-detail .tabs .tab-btn{
  width:100%;
  height:50px;
  background-color: #fff;
  border: 1px solid var(--gray200);
  border-top: none;
  border-radius:0;
  cursor:pointer;
  font-weight:500;
  font-size:16px;
  border-radius:0;
  color: 000;
  -webkit-appearance: none;
    appearance: none;
}
.event-detail .tabs .tab-btn.active{
  background-color:#FF2C2E;
  border:#FF2C2E;
  color:#fff;
  font-weight:700;
}
.event-detail .tabs .tab-content{
  display:none;
}

.event-detail .tabs .tab-content.active{
  display:block;
}

select:focus {
  outline: none;
}
.total-sort .select {
  padding-inline:20px;
}
.d-flex {display:flex ;}