/* 1100px 이하: 페이지 너비 100% */
@media screen and (max-width: 1100px) {
  .layout-full {
    width: 100%;
  }

  .wrapper {
    padding: 0 4.55%;
    /* 50 / 1100 */
  }

  .event-nav-list {
    min-height: 64px;
  }

  .event-nav-list a {
    padding: 16px 0;
  }

  .benefit-section,
  .shortform-section,
  .brand-section,
  .bulk-section,
  .category-section,
  .membership-section,
  .review-section {
    padding: 44px 0 60px;
    scroll-margin-top: 64px;
  }

  .brand-tab-menu {
    margin-left: -4.55%;
    margin-right: -4.55%;
  }

  .brand-list {
    display: flex;
    flex-wrap: nowrap;
    align-items: flex-start;
    justify-content: safe center;
    gap: 15px;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    cursor: grab;
    touch-action: pan-x;
    padding: 0 4.55%;
  }

  .brand-list::-webkit-scrollbar {
    display: none;
  }

  .brand-list>li {
    flex: 0 0 90px;
    width: 90px;
  }

  .brand-products.prod-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 28px 16px;
  }

  .bulk-products.prod-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 28px 16px;
  }

  .bulk-tab-menu {
    margin-left: -4.55%;
    margin-right: -4.55%;
  }

  .bulk-tabs {
    justify-content: center;
    padding: 0 4.55%;
  }

  .shortform-slider {
    margin-left: -4.55%;
    margin-right: -4.55%;
  }

  .shortform-track {
    padding: 0 4.55%;
  }

  .shortform-nav.is-prev {
    left: 4.55%;
  }

  .shortform-nav.is-next {
    right: 4.55%;
  }

  .bulk-deco-1 {
    left: clamp(-215px, -19.55vw, -140px);
    top: clamp(19px, 2.64vw, 29px);
    width: clamp(74px, 10.27vw, 113px);
  }

  .bulk-deco-2 {
    right: clamp(-235px, -21.36vw, -153px);
    top: clamp(-21px, -1.91vw, -14px);
    width: clamp(127px, 17.82vw, 196px);
  }

  .category-section {
    scroll-margin-top: 64px;
  }

  .category-deco {
    left: clamp(-20px, -1.8vw, 10px);
    top: clamp(-48px, -4.5vw, -28px);
    width: clamp(140px, 18vw, 200px);
  }

  .category-tabs {
    gap: 12px;
    max-width: none;
    width: auto;
    margin-left: -4.55%;
    margin-right: -4.55%;
    margin-bottom: 40px;
    padding: 4px 4.55%;
    overflow-x: auto;
    overflow-y: hidden;
    justify-content: center;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;

  }

  .category-tabs::-webkit-scrollbar {
    display: none;
  }

  .category-tab {
    flex-shrink: 0;
    width: 78px;
  }

  .category-tab-icon {
    width: 78px;
    height: 78px;
  }


  .category-products.prod-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 24px 14px;
  }
}

/* 배너 + 네비 반응형: 네비 가로 스크롤 없이 2줄 */
@media screen and (max-width: 768px) {
  .main-banner-section {
    aspect-ratio: 1100 / 557;
  }

  .main-banner-copy {
    width: min(697px, 92%);
  }

  .main-banner-desc {
    margin-top: 2px;
    white-space: normal;
    text-align: center;
  }

  .main-badge-7th {
    left: calc(90 / 1100 * 100%);
    top: calc(72 / 557 * 100%);
  }

  .main-bus {
    right: calc(-36 / 1100 * 100%);
    bottom: calc(-70 / 557 * 100%);
    width: calc(420 / 1100 * 100%);
  }

  .event-nav-list {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    align-items: stretch;
    justify-content: initial;
    min-height: 0;
    padding: 0;
  }

  .event-nav-list li {
    display: flex;
  }

  /* 1행 4개 / 2행 3개 */
  .event-nav-list li:nth-child(-n + 4) {
    grid-column: span 3;
  }

  .event-nav-list li:nth-child(n + 5) {
    grid-column: span 4;
  }

  .event-nav-list a {
    width: 100%;
    min-height: 40px;
    padding: 10px 4px;
    font-size: clamp(12px, 3.2vw, 15px);
    white-space: normal;
    text-align: center;
    line-height: 1.25;
  }

  .event-nav-list .nav-bulk-badge {
    width: 18px;
  }

  .benefit-section,
  .shortform-section,
  .brand-section,
  .bulk-section,
  .category-section,
  .membership-section,
  .review-section {
    scroll-margin-top: 90px;
  }

  .brand-section .section-head {
    margin-bottom: 28px;
  }

  .brand-deco {
    top: -20px;
    right: -55px;
    width: 70px;
  }

  .brand-tab-menu {
    margin-bottom: 28px;
  }

  .brand-list {
    gap: 12px;
  }

  .brand-list>li {
    flex-basis: 70px;
    width: 70px;
  }

  .brand-logo {
    max-width: 70px;
  }



  .brand-products.prod-grid,
  .bulk-products.prod-grid,
  .category-products.prod-grid,
  .membership-products-grid.prod-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px 12px;
  }

  .category-products.prod-grid {
    gap: 20px 12px;
  }

  .prod-brand {
    font-size: 12px;
  }

  .prod-name {
    min-height: 40px;
    font-size: 14px;
    line-height: 20px;
  }

  .prod-price {
    font-size: 16px;
  }

  .category-deco {
    left: -12px;
    top: -36px;
    width: 120px;
  }

  .category-tabs {
    gap: 10px;
    margin-bottom: 28px;
  }

  .category-tab {
    width: 70px;
  }

  .category-tab-icon {
    width: 70px;
    height: 70px;
  }



  .category-panel-head {
    margin-bottom: 18px;
  }

  .category-pick-title {
    line-height: 1.35;
  }

  .bulk-section .section-head {
    margin-bottom: 28px;
  }

  .bulk-deco-1 {
    left: -140px;
    top: 19px;
    width: 74px;
  }

  .bulk-deco-2 {
    right: -153px;
    top: -14px;
    width: 127px;
  }

  .bulk-tab-menu {
    margin-bottom: 28px;
  }

  .bulk-tab {
    min-height: 34px;
    padding: 8px 14px;
    font-size: 15px;
  }

  .prod-thumb>img.prod-label {
    width: 52px;
    right: 8px;
    bottom: 8px;
  }

  .prod-unit {
    font-size: 12px;
  }

  .prod-cart {
    min-height: 36px;
    font-size: 14px;
  }

  .section-badge {
    padding: 7px 16px 9px;
  }

  .benefit-deco {
    display: none;
  }

  .benefit-section .section-head {
    margin-bottom: 28px;
  }

  .benefit-section .section-title {
    letter-spacing: 1px;
  }

  .benefit-cards {
    flex-direction: column;
    align-items: stretch;
    gap: 16px;
  }

  .benefit-card {
    max-width: none;
    padding: 28px 20px 20px;
  }

  .benefit-card-title {
    line-height: 1.25;
    letter-spacing: 1px;
  }

  .benefit-card-visual {
    min-height: 220px;
    margin: 16px 0 16px;
    padding: 16px 12px 14px;
  }

  .benefit-card-visual img {
    max-width: min(100%, 320px);
  }

  .benefit-card-visual.last-card img {
    position: relative;
    top: 10px;
    left: 10px;
  }

  .benefit-card-btn {
    min-height: 52px;
    padding: 14px 16px;
  }

  .benefit-card-chevrons {
    width: 20px;
    height: 20px;
  }

  .shortform-section .section-head {
    margin-bottom: 28px;
  }

  .shortform-badge {
    top: -26px;
    right: -69px;
    width: 67px;
  }

  .shortform-track {
    gap: 14px;
  }

  .shortform-card {
    flex-basis: 220px;
    width: 220px;
  }

  .shortform-media {
    width: 220px;
    height: 309px;
    border-radius: 16px;
  }

  .shortform-caption {
    margin-top: 12px;
    font-size: 16px;
    line-height: 24px;
  }

  .shortform-product {
    margin-top: 16px;
  }

  .shortform-product-thumb {
    flex-basis: 60px;
    width: 60px;
    height: 60px;
  }

  .shortform-product-name {
    font-size: 13px;
    line-height: 18px;
  }

  .shortform-product-price {
    margin-top: 6px;
    font-size: 16px;
  }

  .shortform-nav {
    display: none;
  }

  .event-footer {
    padding: 40px 0 32px;
  }

  .footer-notice-group+.footer-notice-group {
    margin-top: 22px;
  }

  .footer-brand {
    margin-top: 28px;
    padding-top: 18px;
  }

  .review-card {
    grid-template-columns: 1fr;
  }

  .review-card-visual {
    min-height: 240px;
    border-radius: 20px 20px 0 0;
  }

  .review-card-visual-product {
    width: min(72%, 320px);
    top: 10px;
    left: 10px;
  }

  .review-card-info {
    padding: 28px 24px 32px;
  }

  .review-card-meta {
    margin-top: 20px;
  }

  .review-card-meta li {
    flex-wrap: wrap;
    row-gap: 6px;
  }

  .category-pick+.category-pick {
    margin-top: 70px;
  }

  .brand-list>li {
    margin-top: 2px;
  }
}

@media screen and (max-width: 767px) {

  .category-tabs,
  .bulk-tabs,
  .brand-list {
    justify-content: flex-start;
  }

}

@media screen and (max-width: 480px) {
  .main-banner-section {
    aspect-ratio: 1100 / 557;
  }

  .main-title {
    letter-spacing: 0.02em;
  }

  .main-bus {
    right: calc(-28 / 1100 * 100%);
    bottom: calc(-58 / 557 * 100%);
    width: calc(400 / 1100 * 100%);
  }

  .event-nav-list a {
    min-height: 36px;
    padding: 8px 2px;
    font-size: clamp(15px, 3.1vw, 18px);
  }

  .event-nav-list .nav-bulk-badge {
    width: 15px;
  }

  .benefit-section,
  .shortform-section,
  .brand-section,
  .bulk-section,
  .category-section,
  .membership-section,
  .review-section {
    scroll-margin-top: 82px;
  }

  .brand-deco {
    top: -16px;
    right: -43px;
    width: 55px;
  }

  .brand-list {
    gap: 10px;
  }

  .brand-list>li {
    flex-basis: 64px;
    width: 64px;
  }



  .bulk-deco-1 {
    left: -94px;
    top: 15px;
    width: 56px;
  }

  .bulk-deco-2 {
    right: -108px;
    top: -11px;
    width: 98px;
  }

  .bulk-tab {
    min-height: 30px;
    padding: 7px 12px;
    font-size: 13px;
  }

  .prod-badge {
    height: 22px;
    max-width: 72px;
  }

  .prod-same-day {
    width: 60px;
  }

  .prod-thumb>img.prod-label {
    width: 44px;
  }

  .prod-name {
    min-height: 36px;
    font-size: 13px;
    line-height: 18px;
  }

  .prod-price {
    font-size: 15px;
  }

  .prod-cart {
    min-height: 34px;
    font-size: 13px;
  }

  .category-tab {
    width: 64px;
  }

  .category-tab-icon {
    width: 64px;
    height: 64px;
  }




  .section-head {
    margin-bottom: 20px;
  }

  .shortform-badge {
    top: -20px;
    right: -55px;
    width: 53px;
  }

  .shortform-card {
    flex-basis: 200px;
    width: 200px;
  }

  .shortform-media {
    width: 200px;
    height: 281px;
  }

  .shortform-caption {
    font-size: 15px;
    line-height: 22px;
  }


  .kf-cart-popup {
    max-width: 300px;
    padding: 24px 16px 22px;
  }

  .kf-cart-title {
    margin: 0 20px 12px;
    font-size: 15px;
  }

  .kf-cart-field {
    width: 132px;
  }

  .kf-cart-submit {
    width: 100%;
    max-width: 190px;
    height: 46px;
    line-height: 46px;
    font-size: 15px;
  }
}