@charset "utf-8";

html, body {
  overflow-x: hidden;
}
body {
    margin:0; padding:0; font-size:14px; height:100%; 
    font-family:'Noto Sans KR',sans-serif;
    -ms-text-size-adjust:100%;
    -webkit-text-size-adjust:100%;
    font-weight: 500;
    letter-spacing: -0.02em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    color: #333;
}
* {box-sizing: border-box; margin:0;padding:0;border:0; transition: all 0.3s ease;}
h1, h2, h3, h4, h5, h6 {margin:0;padding:0;border:0; letter-spacing: -0.04em; font-weight: 600;}
label, input, button, select, img {vertical-align:middle; font-weight: 600;}

::selection {background-color: #25282B; color: #fff;}

button {cursor:pointer; padding: 0px; margin: 0px; background-color: transparent; border:0px;}
textarea, select {font-size:14px;}
a {color:#000;text-decoration:none;}
ul,li,dl,dt,dd{padding:0;margin:0;list-style:none;}
b,strong{font-family:'font-B',sans-serif;}

input:focus {outline: none !important;}
textarea:focus {outline: none !important;}
button:focus {outline: none !important;}

.mask_black {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 99;
    opacity: 0;
    visibility: hidden;
    transition: opacity .25s ease;
    pointer-events: auto;
    touch-action: none;
}

.container_wrap {position: relative; width: 100%; min-height: 100vh; box-sizing: border-box;}


/************************************************************************************* 메인페이지 */

section.index {
    position: relative;
    width: 100%;
    margin: 0 auto;
    padding: 0;
}
section.sub {
    position: relative;
    width: 100%;
    margin: 0 auto;
    padding: 0;
}

.index-deco {
    position: absolute;
    top: -50px;
    left: 0;
    z-index: -1;
    width: 100%;
    height: 500px;
    opacity: .2;
}   
.index-deco img {
    width: 100%;
    object-fit: cover;
}   
.empty-gary {
    width: 100%;
    height: 5px;
    background: #f5f5f5;
}

/* main renew hero */
.main-renew-hero {
    width: 100%;
    padding: 0 10px;
    margin: 10px 0;
}

.hero-container {
    max-width: 100%;
    margin: 0 auto;
    border-radius: 10px;
    overflow: hidden;
}

.hero-swiper {
    width: 100%;
}

.hero-swiper img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 1.818 / 1;
    border-radius: 10px;
}
.main-section.main-renew-sbanner {
    padding: 0;;
}
.sbanner-swiper {
    width: 100%;
}
.sbanner-swiper .swiper-slide {
    overflow: hidden;
}
.sbanner-swiper img {
    position: relative;
    left: -40%;
    display: block;
    width: 180%;
    height: auto;
}
/* pagination */
.swiper-pagination {
    bottom: 10px !important;
}
.sbanner-swiper .swiper-pagination {
    bottom: 0px !important;
}

.swiper-pagination-bullet {
    width: 6px !important;
    height: 6px !important;
    background: rgba(0,0,0,.3) !important;
    opacity: 1 !important;
    margin: 0 2px !important;
}

.swiper-pagination-bullet-active {
    background: rgba(0,0,0,.6) !important;
}

/* main-section */
.main-section {
    padding: 30px 10px 20px 10px;
}
.section-container {
    width: 100%;
    margin: 0 auto;
}
.main-section-title {
    margin-bottom: 20px;
    text-align: center;
}
.main-section-title h2 {
    font-size: 1.4rem;
    margin-bottom: 5px;
}
.main-renew-golf .main-section-title h2 {
    text-align: center;
}
.main-section-title p {
    font-size: .8rem;
    color: #666;
}
.main-section-title p span {
    color: #0D8467;
}


.location-swiper, .hot-swiper {
    width: 100%;
    overflow: visible;
}
.main-renew-location {
    padding: 0px;
    display: flex;
    flex-direction: column;
}
.main-renew-location h1 {
    padding: 10px;
    margin: 20px 0 0px 0;
    font-weight: 300;
    text-align: center;
    order: 0;
}
.main-renew-location h1 span {
    font-weight: 700;
}
.main-renew-location h2 {
    padding: 0 10px 10px 10px;
    font-weight: 400;
    text-align: center;
    font-size: 1rem;
    order: 2;
}

.location-info {
    position: absolute;
    z-index: 1;
    width: 100%;
    height: 100%;
    padding: 20px 20px 0px 20px;
    color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.location-slide .location-info strong {
    font-size: 1.6rem;
    font-weight: 600;
    margin-bottom: 5px;
    text-align: center;
}
.location-info ul {
    display: none;
}

.location-section {
    padding: 20px 0;
    overflow: hidden;
    order: 1;
}
.location-swiper {
    width: 100%;
    overflow: visible;
    padding: 0;
}

.location-swiper.swiper {
    overflow: visible;
}
.location-swiper .swiper-wrapper {
    align-items: center;
}

.location-swiper .swiper-slide {
    width: 180px;
    height: 200px;
    border-radius: 10px;
    overflow: hidden;
    transition: transform .35s ease, box-shadow .35s ease;
    filter: brightness(1.2);
}

.location-swiper .swiper-slide-active {
    box-shadow: 0 1px 10px rgba(0, 0, 0, 0.2);
    filter: brightness(1);
}
.location-swiper .swiper-slide-active .location-info strong {
    text-align: left;
}
.location-swiper .swiper-slide-active .location-info {
    padding: 30px 20px 0px 20px;
}
.location-swiper .swiper-slide-active .location-info ul {
    display: block;
}

.location-swiper .swiper-slide a {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
}

.location-swiper .swiper-slide img {
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* 핫상품 */
.hot-swiper .swiper-slide {
    width: 40%;
    border-radius: 10px;
    transform: scale(0.9) !important;
    transition: transform .3s ease;
}
.hot-swiper .swiper-slide-active {
  transform: scale(1) !important;
}
.location-swiper img, .hot-swiper img {
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    border-radius: 12px;
}


/* main renew quick */
.main-renew-PCquick {
    display: none;
}
.main-renew-Mquick {
    width: 100%;
    padding: 0 10px;
    margin: 10px 0;
}
.Mquick-container {
    max-width: 100%;
    margin: 0 auto;
}
.Mquick-ico-wrap {
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    list-style: none;
    gap: 5px;
}
.Mquick-ico {
    width: auto;
    height: auto;
    background: #05CD77;
    border-radius: 16px;
}
.Mquick-ico.swiper-slide {
    width: auto;
}
.Mquick-ico a {
    padding: 0 15px;
    line-height: 32px;
    color: #fff;
    display: block;
}

.box_btn_main_wrap {
    margin-top: 15px;
}
.box_btn_main_wrap .box_btn_main {
    flex-direction: row;
    justify-content: space-between;
    gap: 0;
}
.box_btn_main_wrap .box_btn_main .box_btn {
    border-radius: 5px;
    width: 49%;
    height: 32px;
    line-height: 32px;
    padding-left: 30px;
    font-size: .7rem;
}
.box_btn_main_wrap .box_btn_main .box_btn.golf {background:url(/img/ico_golf.png) #d3fff3 7px center no-repeat;  background-size: 20px;}
.box_btn_main_wrap .box_btn_main .box_btn.muine {background:url(/img/ico_car.png) #ffeabe 7px center no-repeat;  background-size: 20px;}
.box_btn_main_wrap .box_btn_main .box_btn.ghandy {background:url(/img/ico_cup.png) #DFF6FF 7px center no-repeat;  background-size: 20px}

.main-renew-PCquick {
    width: 100%;
    padding: 0 10px;
    margin: 10px 0;
}
.PCquick-ico-wrap {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    list-style: none;
    gap: 10px;
}
.PCquick-ico {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background-color: #ffecfc;
    cursor: pointer;
    padding: 20px 5px;
    border-radius: 10px;
}

.PCquick-ico:nth-child(1) { background: #ffe4e1; }
.PCquick-ico:nth-child(2) { background: #e9ffdd; }
.PCquick-ico:nth-child(3) { background: #e7f5ff; }
.PCquick-ico:nth-child(4) { background: #e8f7ef; }
.PCquick-ico:nth-child(5) { background: #f0ecff; }
.PCquick-ico:nth-child(6) { background: #fff0f6; }
.PCquick-ico:nth-child(7) { background: #eef9ff; }
.PCquick-ico p {
    font-size: 1.1rem;
    margin: 10px 0 0px 0;
    font-weight: 600;
}
.PCquick-ico span {
    font-size: .8rem;
    font-weight: 400;
}
.PCquick-ico img {
    width: 32px;
    height: 32px;
}


/* accordion */
.main-renew-accordion {
    background: #ffffff00;
    padding: 30px 0px 20px 0px;
}
.accordion-wrap {
    width: 100%;
    padding: 5px;
    border-bottom: 1px solid #ededed;
    transition: box-shadow .3s ease, background .3s ease;
}
.accordion-wrap.accordion-active {
    width: 100%;
    padding: 10px 5px 20px 5px;
    border-bottom: 1px solid #cfcfcf;
    box-shadow: 0 1 1px rgba(0,0,0,0.3);
    overflow: hidden;
}

.accordion-body {
  overflow: hidden;
  height: 0;
  transition: height .3s ease;
}
.accordion-item.is-open .accordion-body {
  height: auto;
  padding: 5px 10px;
}
.accordion-body {
    overflow: hidden;
    transition: 0.3s ease-in-out;  /* 부드러운 애니메이션 */
}
.accordion-header {
    width: 100%;
    padding: 15px 20px;
    font-size: 1.1rem;
    text-align: left;
    border-radius: 10px;
    cursor: pointer;
    position: relative;
    color: #555
}
.accordion-active .accordion-header {
    padding: 15px 20px 10px 20px;
}
.accordion-header .num {
    margin-right: 10px;
    color: #4DDB00;
}
.accordion-header::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 10px;
    width: 10px;
    height: 10px;
    border-right: 2px solid #555;
    border-bottom: 2px solid #555;
    transform: translateY(-50%) rotate(45deg);
    transition: transform .3s ease;
}
.accordion-active .accordion-header::after {
    transform: translateY(-50%) rotate(225deg);
}
.product-swiper {
    width: 100%;
    padding: 5px 0;
}
.thumb {
    position: relative;
    width: 100%;
    height: auto;
    border-radius: 10px;
    overflow: hidden;
}
.thumb > img {
    width: 100%;
    height: auto;
}
.thumb .ico_sale {
    position: absolute;
    z-index: 1;
    top: -4px;
    right: 10px;
    width: 50px;
}
.thumb .ico_sale img{
    width: 100%;
    height: auto;
}

.info {
    padding: 5px 0 0 0;
    text-align: center;
}
.name {
    max-height: 40px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
}

.price-wrap {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
    letter-spacing: -0.08rem;
}
.origin-price-wrap {
   max-height: 1rem;
   line-height: 1rem;
}
.sale-price-wrap {
    display: block;
}
.price-wrap span {
    display: inline-block;
    height: .8rem;
    line-height: 1;
    vertical-align: middle;
}
.sale-cost {
    font-size: .9rem;
}
.sale-cost.krw-cost {
    font-size: .75rem;
    color:#666;
}
.origin-cost {
    font-size: .75rem;
    color:#999;
    text-decoration: line-through;
}
.sale-per {
    font-size: .85rem;
    color: #FF3B30;
}
.accordion-wrap .golf-item .sale-cost.krw-cost {
    display: block;
}
.accordion-wrap .golf-item .origin-cost.krw-cost {
    display: none;
}

/* 골프 */
.glf-category {
    display: flex;
    overflow-x: auto;
    gap: 5px;
    margin:20px 0;
}
.glf-category .category-item {
    flex: 0 0 auto;
    padding: 10px 15px;
    background-color: #fff;
    border-radius: 5px;
    border: 1px solid #ccc;
    font-size: 0.8rem;
    cursor: pointer;
    white-space: nowrap;
    transition: background-color 0.3s;
}
.category-item.active {
  background-color: #05cd77;
  color: #fff;
  border-color: #05cd77;
}

.category-item.active .text-muted {
  color: #fff;
}
/* ✅ Swiper 컨테이너 */
.main-renew-golf .golf-swiper {
  overflow: hidden;
}

/* ✅ Swiper wrapper */
.main-renew-golf .golf-product-list {
  display: flex;              /* swiper-wrapper */
}

/* ✅ 카드 (swiper-slide) */
.main-renew-golf .golf-item {
  flex-shrink: 0;
  transition: opacity .3s ease;
}

/* ✅ 숨김 처리 (필터용) */
.main-renew-golf .golf-item.is-hidden {
  display: none !important;
}