@charset "utf-8";

/* 시작: 컨텐츠 > subNav */
.style-subNav {
    padding: 13px 0;
    width: 100%;
    z-index: 1000;
    position: sticky;
    background-color: #fff;
    top: 43px;
}
#subNav {
    /*margin-bottom: 10px;*/
}
#subNav swiper-slide {
    width: auto;
    margin: 0 3px;
}
#subNav swiper-slide:first-child {
    margin-left: 16px;
}
#subNav swiper-slide:last-child {
    margin-right: 16px;
}
#subNav swiper-slide a {
    color: #454545;
    height: 36px;
    display: inline-flex;
    opacity: 0.7;
    padding: 0 16px;
    font-size: 1.4rem;
    font-weight: 500;
    border-radius: 20px;
    background-color: #F6F6F6;
    align-items: center;
    justify-content: center;
    vertical-align: middle;
}
#subNav swiper-slide a.on {
    color: #fff;
    opacity: 1;
    font-weight: 700;
    background-color: #6A1CA1;
}
.style-subNav.outline swiper-slide a{
    font-size: 1.4rem !important;
    font-weight: 400 !important;
    background-color: #fff !important;
    border: 1px solid #f0f0f0 !important;
    color: var(--color-gray-900) !important;
    opacity: 1 !important;
}
.style-subNav.outline swiper-slide a.on {
    color: #6A1CA1 !important;
    border-color: #6A1CA1 !important;
}
/* 종료: 컨텐츠 > subNav */

/* 시작: 컨텐츠 > pageDate */
.style-pageDate {

}
.style-pageDate .date {
    color: #8D8D8D;
    padding: 12px 16px;
    font-size: 1.3rem;
    font-weight: 400;
}
/* 종료: 컨텐츠 > pageDate */

/* 시작: 컨텐츠 > pageImg */
.style-pageImg {
    position: relative;
}
.style-pageImg img {
    width: 100%;
}
.style-pageImg-text {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    text-align: center;
    padding: 5px;
    background: #960000;
    color: #fff;
    font-size: 14px;
    font-weight: 600;
}
.style-pageImg-text span {
    color: #F7FF10;
}
/* 종료: 컨텐츠 > pageImg */

/* 시작: 컨텐츠 > chekBox */
.style-chekBox {
    width: 100%;
    height: 40px;
    display: flex;
    padding: 4px 16px 12px;
    position: relative;
    box-sizing: border-box;
    background-color: #fff;
}
.style-chekBoxLabel {
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    margin-right: 16px;
    vertical-align: middle;
    -webkit-tap-highlight-color: transparent;
}
.style-chekBoxButton {
    padding: 0;
    font-size: 1.4rem;
    margin-right: 4px;
    color: rgba(60, 60, 67, 0.6);
    display: inline-flex;
    flex: 0 0 auto;
    overflow: visible;
    text-align: center;
    transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    border-radius: 50%;
    align-items: center;
    justify-content: center;
    vertical-align: middle;
}
.chekBox-label {
    width: 100%;
    display: flex;
    align-items: inherit;
    justify-content: inherit;
    position: relative;
}
.chekBox-label input {
    top: 0;
    left: 0;
    width: 100%;
    cursor: inherit;
    height: 100%;
    margin: 0;
    opacity: 0;
    padding: 0;
    z-index: 1;
    position: absolute;
}
.chekBox-label svg {
    fill: currentColor;
    width: 1em;
    height: 1em;
    display: inline-block;
    font-size: 2.4rem;
    transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    flex-shrink: 0;
    user-select: none;
}
.style-formLabel {
    padding: 0;
    font-size: 1.4rem;
}
/* 종료: 컨텐츠 > chekBox */

/* 시작: 컨텐츠 > itemList */
.style-itemList {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    box-sizing: border-box;
    padding: 0 12px;
}
.style-itemList-inner {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    box-sizing: border-box;
    padding-bottom: 80px;
}
.style-itemList-inner .item {
    padding: 0 4px 24px;
    flex-grow: 0;
    max-width: 50%;
    flex-basis: 50%;
}
.style-itemList a {
    display: block;
    position: relative;
}

.style-itemList-thumbnail {
    display: flex;
    position: relative;
    background: url(../img/placeholder-img.svg) no-repeat 50% 50%;
    background-size: cover;
    overflow: hidden;
    margin-bottom: auto;
    flex-direction: column;

}
/*리스트에서만*/
.item .style-itemList-thumbnail {
    aspect-ratio: 1 / 1;
}
.style-itemList-thumbnailcscs img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.style-itemList-like {
    position: absolute;
    bottom: 7px;
    right: 7px;
    width: 23px;
    height: 23px;
    border-radius: 50%;
    z-index: 25;
}
.style-today-sale-itemList .style-itemList-like {
    right: 6px;
    bottom: 6px;
    width: 21px;
    height: 21px;
    z-index: 25;
}
.style-itemList-like svg {
    width: 21px;
    height: 21px;
}
.style-itemList-thumbnail img {
    width: 100%;
    height: auto;
    position: relative;
    transition: all 0.4s ease;
    z-index: 1;
}
.style-itemList-thumbnail .style-detail-imageArea-freeGift {
    right: 8px;
    left: auto;
    bottom: 8px;
    z-index: 10;
    position: absolute;
    width: 60px;
    height: 60px;
    border: 1px solid #000;
    border-radius: 50%;
}
.style-itemList-thumbnail .imageArea-freeGift-icon {
    top: -5px;
    width: 9px;
    height: 9px;
    left: 50%;
    z-index: 5;
    position: absolute;
    transform: translateX(-50%);
    margin: auto;
    display: block;
    max-width: 100%;
}
.style-itemList-thumbnail .imageArea-freeGift-img {
    width: 100%;
    border: 1px solid #F0F0F0;
    height: 100%;
    overflow: hidden;
    position: relative;
    border-radius: 50%;
    background-color: #fff;
}
swiper-slide .style-itemList-thumbnail .imageArea-freeGift-img {
    width: 100%;
    border: 0;
    height: 100%;
    overflow: hidden;
    position: relative;
    border-radius: 50%;
    background-color: #fff;
}
.style-itemList-thumbnail .imageArea-freeGift-img img {
    top: 50% !important;
    left: 50% !important;
    width: 100% !important;
    height: 100% !important;
    position: absolute;
    transform: translate(-50%, -50%);
    transition: all 0.4s ease;
}
.style-itemList-thumbnail .style-detail-imageArea-freeGift .imageArea-freeGift-txt {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    overflow: hidden;
}
.style-itemList-thumbnail .style-detail-imageArea-freeGift .imageArea-freeGift-txt span {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    background: #000;
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    text-align: center;
    height: 16px;
    line-height: 15px;
    z-index: 2;
}


.style-itemList-soldout {
    top: 0;
    left: 0;
    color: #fff;
    right: 0;
    width: 100%;
    bottom: 0;
    height: 100%;
    display: flex;
    position: absolute;
    font-size: 1.6rem;
    align-items: center;
    font-weight: 600;
    justify-content: center;
    background-color: rgba(0,0,0,0.4);
    z-index: 25;
}
.style-itemList-soldout_wd {
    top: 0;
    left: 0;
    color: #fff;
    right: 0;
    width: 100%;
    bottom: 0;
    height: 100%;
    display: flex;
    position: absolute;
    font-size: 16px;
    letter-spacing: -0.01em;
    align-items: center;
    font-weight: 600;
    justify-content: center;
    background-color: rgba(0,0,0,0.4);
    z-index: 25;
}
.style-itemList-icon {
    left: 8px;
    bottom: 8px;
    position: absolute;
}
.style-itemList-icon img {
    width: 42px;
    height: 42px;
}
.style-itemList-badge {
    position: absolute;
    top: 8px;
    left: 8px;
    color: #fff;
    height: 18px;
    display: inline-flex;
    padding: 0px 4px;
    overflow: hidden;
    font-size: 1.1rem;
    align-items: center;
    flex-shrink: 0;
    font-weight: 700;
    line-height: 1;
    border-radius: 3px;
    letter-spacing: -0.02em;
    justify-content: center;
    background-color: #BD76FF;
    z-index: 3;
}
.style-itemList-badge > span {
    display: inline-block;
    font-family: HGHaeDotum,sans-serif;
}
.style-itemList-badge-left, .style-itemList-badge2 {
    position: absolute;
    top: 8px;
    left: 8px;
    width: 43px;
    height: 43px;
    z-index: 5;
}
.style-itemList-badge3 {
    position: absolute;
    top: 8px;
    left: 8px;
    display: flex;
    gap: 2px;
}
.style-itemList-badge3 span {
    font-size: 11px;
    font-weight: 500;
    color: #fff;
    padding: 2px 4px;
    border-radius: 4px;
    max-height: 18px;
    z-index:2;
}
.style-itemList-badge3 .todaySale {
    background: #E61328;
}
.style-itemList-badge3 .timeSale {
    background: #000;
    font-size: 11px;
    font-weight: 600;
    width: 80px;
    text-align: center;
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum";
}

.style-itemList-badge-popularity {
    background: #FFE761;
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    color: #2A2A2A;
    font-size: 12px;
    font-weight: 700;
    line-height: normal;
    padding: 0 6px;
    height: 20px;
    align-items: center;
    max-width: 90%;
    z-index:1000;
}

.style-itemList-badge-recommend {
    position: absolute;
    top: 0;
    left: 0;
    background: #7543FF;
    padding: 2px 6px;
    font-size: 12px;
    font-weight: 700;
    color: #fff;
    z-index:2;
}
.style-itemList-badge-recommend_small {
    position: absolute;
    top: 0;
    left: 0;
    background: #7543FF;
    padding: 2px 5px;
    font-size: 11px;
    font-weight: 600;
    color: #fff;
    z-index:2;
}

.style-itemList-badge-right {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 43px;
    height: 43px;
    z-index: 5;
}

/* 1+1 badge rmfwk */
.style-itemList-badge-right .gift_badge{
    background-image:url("../img/icon/itemList-black-bg.svg");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color:#FFF;
    font-size:1.6rem;
    font-weight:800;
    letter-spacing: -0.1rem;
}

.style-itemList-badge-bottom-right {
    position: absolute;
    bottom: 8px;
    right: 8px;
    width: 50px;
    height: 50px;
    z-index: 5;
}

/* 1+1 badge rmfwk */
.style-itemList-badge-bottom-right .gift_badge{
    background-image:url("../img/icon/itemList-black-bg.svg");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color:#FFF;
    font-size:1.6rem;
    font-weight:800;
    letter-spacing: -0.1rem;
}

.style-itemList-badge-bottom-left {
    position: absolute;
    bottom: 16px;
    left: 16px;
    width: 54px;
    height: 54px;
    z-index: 5;
}
.style-itemList-badge-bottom-left img {
    width:100%;
    height:100%;
}
.style-itemList-badge-bottom-main-left {
    position: absolute;
    bottom: 10px;
    left: 10px;
    width: 54px;
    height: 54px;
    z-index: 5;
}
.style-itemList-badge-bottom-main-left img {
    width:100%;
    height:100%;
}
.style-itemList-badge2 img {
    width: 45px !important;
    height: 45px !important;
    max-height: 45px !important;
    min-height: 45px !important;
    object-fit: inherit !important;
}
.style-itemList-time {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    background: rgba(0, 0, 0, 0.50);
    padding: 8px;
    text-align: center;
    color: #fff;
    font-size: 13px;
    font-weight: 500;
    z-index: 10;
}
.style-itemList-bgText {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    padding: 8px;
    z-index: 10;
    height: 34px;
    font-size: 13px;
    color:#EFEFEF;
    overflow: hidden;
    text-align: center;
}
.style-itemList-bgText::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,0.5); /* DIM */
    z-index: -1; /* 뒤로 빼서 자식과 레이어 분리 */
}


.style-itemList-bgText .text-wrap {
    /*background: rgba(0, 0, 0, 0.5);*/
}

.style-itemList-bgText .text_static {
    position: absolute;
    width: 100%;
    height: 34px;
    line-height: 20px;
    text-align: center;
    font-weight: 600;
    opacity: 1;
}

.style-itemList-bgText .text_static svg {
    position: relative;
    margin-top:-3px;
    margin-right:3px;
}

.style-itemList-bgText .text {
    position: absolute;
    width: 100%;
    height: 34px;
    line-height: 20px;
    text-align: center;
    font-weight: 600;
    opacity: 1;
    transform: translateY(100%);
}

.style-itemList-bgText .text svg {
    position: relative;
    margin-top:-4px;
    margin-right:3px;
}


/* 첫 번째 텍스트 */
.style-itemList-bgText  .t0 {
    animation: textAniTimesale 5s infinite;
}

/* 두 번째 텍스트 (2초 뒤 시작) */
.style-itemList-bgText .t1 {
    animation: textAniTimesale 5s infinite 2.5s;
}


@keyframes textAniTimesale {
    0%   { transform: translateY(100%); }
    10%  { transform: translateY(0); }
    40%  { transform: translateY(0); }
    60%  { transform: translateY(-100%); }
    100% { transform: translateY(-100%); }
}


.style-itemList-ranking {
    top: 0;
    left: 0;
    color: #fff;
    width: 28px;
    height: 28px;
    display: flex;
    z-index: 10;
    position: absolute;
    font-size: 1.3rem;
    align-items: center;
    font-family: HGHaeDotum,sans-serif;
    line-height: 1;
    justify-content: center;
    background-color: #000;
}
.style-itemListRepeatItem {
    padding: 8px 0;
}
.style-itemListRepeatItem-button {
    color: var(--color-gray-900);
    background-color: #fff;
    font-size: 13px;
    line-height: 19px;
    height: 32px;
    display: flex;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    align-items: center;
    box-shadow: none;
    font-weight: 500;
    text-transform: capitalize;
    border: 1px solid var(--color-gray-400);
    border-radius: 4px;
    width: 100%;
    z-index: 100;
}
.style-itemListRepeatItem-button svg {
    width: 17px;
    height: 17px;
    margin-right: 2px;
}
.style-itemListRepeatItem-button path {
    fill: var(--color-gray-900);
}
.style-itemList-info {
    display: flex;
    width: 100%;
    align-items: flex-start;
    margin-top: 8px;
    padding: 0 2px 0;
    flex-direction: column;
    justify-content: center;
}

.style-itemList-info.limit_mode {
    display: flex;
    width: 100%;
    align-items: flex-start;
    justify-content: flex-start;
    margin-top: 8px;
    padding: 0 2px 0;
    flex-direction: column;
    /*justify-content: center;*/
    min-height: 105px;

}

.style-itemList-info.limit_mode .style-itemList-progressBox {
    margin-top:auto;
}

.style-itemList-shop {
    color: #000;
    width: 100%;
    display: flex;
    font-size: 1.2rem;
    align-items: center;
    font-weight: 600;
    padding-bottom: 1px;
    justify-content: space-between;
}
.style-itemList-shop button {
}
.style-itemList-shop button svg {
    fill: none;
    width: 20px;
    height: 20px;
    display: inline-block;
    font-size: 2.4rem;
    transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    flex-shrink: 0;
    user-select: none;
}
.style-itemList-shop button.like svg path {
    fill: #EA333E;
    stroke: #EA333E;
}
.style-itemList-title {
    position: relative;
    margin: 0;
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 1.4;
    max-height: 40px;
    text-align: left;

    display: -webkit-box;
    overflow: hidden;
    white-space: normal;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;

    margin-bottom:1px;
}

.style-itemList-title_limit {
    position: relative;
    margin: 0;
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 1.4;
    max-height: 40px;
    text-align: left;

    display: -webkit-box;
    overflow: hidden;
    white-space: normal;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}

.style-itemList-title_sm {
    position: relative;
    margin: 0;
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 1.3;
    max-height: 37px;
    text-align: left;

    display: -webkit-box;
    overflow: hidden;
    white-space: normal;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;

    margin-bottom:4px;
}

/* 텍스트 첫 줄만 오른쪽으로 밀기 */
.style-itemList-title_sm .title-text {
    text-indent: 43px;   /* 첫 줄 여백 */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

/* 텍스트 첫 줄만 오른쪽으로 밀기 */
.style-itemList-title .title-text {
    text-indent: 46px;   /* 첫 줄 여백 */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

/* 아이콘 고정 */
.style-itemList-title_sm lottie-player {
    position: absolute;
    left: 0;
    top: 0;
}

/* 아이콘 고정 */
.style-itemList-title lottie-player {
    position: absolute;
    left: 0;
    top: 0;
}
.style-itemList-price {
    /*margin-top: -1px;*/
    position: relative;
    width: 100%;
    /*margin-bottom:-1px;*/
}
.style-itemList-price .price-text {
    font-size: 1.2rem;
    font-weight: 500;
    line-height: 1.4;
    /*padding-right: 2px;*/
    color: #D40022;
}
.style-itemList-price s {
    color: #7a7e85;
    font-size: 1.3rem;
    font-family: Pretendard,sans-serif;
    line-height: 1.4;
    font-weight: 400;
}
.style-itemList-price .discount {
    font-size: 1.4rem;

    color: #D40022;
    /*color:#787878;*/
    font-family: Pretendard,sans-serif;
    font-weight: 600;
    margin-right: 1px;

}

.style-itemList-price .discount.limit {
    font-size: 1.5rem;

    color: #D40022;
    /*color:#787878;*/
    font-family: Pretendard,sans-serif;
    font-weight: 600;
    margin-right: 1px;

}

.style-itemList-price .discountWrap {
    position: relative;
}
.style-itemList-price .btn_list_discount_open {
    display: flex;
    align-items: baseline;
    padding-right: 21px;
    position: relative;
}
.style-itemList-price .btn_list_discount_open svg {
    position: absolute;
    top: 2px;
    right: 0;
    width: 16px;
    height: 16px;
    transition: all ease 0.3s;
}
.style-itemList-price .btn_list_discount_open.open svg {
    /*transform: rotate(-180deg);*/
}
.style-itemList-price .total-discount {
    position: absolute;
    top: 24px;
    left: -7px;
    z-index: 1500;
    background: #fff;

}
.style-itemList-price .total-discount ul {
    margin: 0;
}

.style-itemList-price .total-discount li .price {
    font-weight: 600;
}
.style-itemList-price .total-discount li .won {
    font-weight: 500;
    color:#000;
}
.style-itemList-price .total-discount li.total .won {
    font-weight: 500;
    color:#D40022;
}

.style-today-sale-itemList .price-text {
    color: #E61328;
}
.style-today-sale-itemList .discount {
    position: absolute;
    top: 0;
    right: 0;
    color: #E61328;
    font-size: 25px !important;
    font-weight: 800 !important;
    letter-spacing: -0.05em;
}
.soldout .discount {
    color: #8D8D8D !important;
}
/*
.style-today-sale-itemList .discount span {
    font-size: 17px !important;
}
*/

.style-itemList-price .price {
    font-size: 1.7rem;
    font-family: Pretendard,sans-serif;
    font-weight: 700;

}

.style-itemList-price .price.limit {
    font-size: 1.5rem;
    font-family: Pretendard,sans-serif;
    font-weight: 600;
}

.style-itemList-price .price.my_price {
    font-size: 1.6rem;
    color:#D40022;

}
.style-itemList-price .price_red {
    color:#D40022;
    font-size: 14px;
    font-weight: 600;
    display: inline-flex;
}
.style-itemList-price .red-stxt {
    color:#D40022;
    font-size: 12px;
    display: inline-flex;
    margin-left: 4px;
}
.style-today-sale-itemList .style-itemList-price .price {
    font-size: 17px;
    font-weight: 600;
}
.style-today-sale-itemList .style-itemList-price .price span {
    font-weight: 600;
    /*font-size: 15px;*/
}
.soldout .price {
    color: #8D8D8D !important;
}
.style-itemList-txt {
    display: block;
    color: #111;
    font-size: 13px;
    font-weight: 200;
    padding-top: 4px;
    margin-bottom: 0;
}
.style-itemList-delivery {
    gap: 4px;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    padding-top: 8px;
}
.style-itemList-delivery span {
    color: #232323;
    width: auto;
    display: inline-flex;
    padding: 5px 6px;
    flex-grow: 0;
    font-size: 1rem;
    flex-shrink: 0;
    font-family: Pretendard,sans-serif;
    line-height: 1;
    border-radius: 4px;
    background-color: #F6F6F6;
}
.style-itemList-delivery .deliveryChek {
    color: #6A1CA1;
    /* font-weight: 500;*/
}
.style-itemList-badgeBox {
    display: flex;
    flex-wrap: wrap;
    margin: 0;
    padding: 11px 0 0;
    overflow: hidden;
    list-style-type: none;
    font-size: 0;
}
.style-itemList-badgeBox .style-item-badge {
    margin-right: 4px;
    display: flex;
    align-items: center;
    /*height: 17px;*/
    padding: 3px 4px;
    border-radius: 2px;
    background-color: #f0f1f4;
    font-size: 10px;
    font-weight: 500;
    line-height: 13px;
    color: #444;
}
.style-itemList-badgeBox .style-item-badge.fireSale {
    background-color: #ff5753;
    color: #fff;
}
.style-itemList-badgeBox .style-item-badge.delivery {
    color: #963ecd;
}
.style-itemList-badgeBox .style-item-badge.lowPrice {
    color: #FF5753;
}
.style-itemList-counts {
    color: #545D6D;
    display: flex;
    font-size: 1.1rem;
    align-items: center;
    line-height: 1;
    padding-top: 5px;
    white-space: nowrap;
}
.style-itemList-counts div {
    font-size: 1.2rem;
    letter-spacing: -0.24px;
    display: flex;
    gap:1px;
    align-items: center;
    line-height: 1;
}
.style-itemList-counts div img {
    width: auto;
    height: 15px;
    position: relative;
}
.style-itemList-counts span {
    font-size: 1.3rem;
    padding-left: 1px;
    letter-spacing: -0.24px;
}
.style-itemList-counts span.rate {
    font-size: 1.2rem;
    padding-left: 1px;
    letter-spacing: -0.24px;
}


.skeleton .style-itemList-shop {
    background: #f6f6f6;
    width: 30%;
    height: 16px;
    margin-bottom: 4px;
}
.skeleton .style-itemList-title {
    background: #f6f6f6;
    width: 100%;
    height: 16px;
    margin-bottom: 4px;
}
.skeleton .style-itemList-price div {
    background: #f6f6f6;
    width: 100%;
    height: 16px;
    margin-bottom: 4px;
}
.skeleton .style-itemList-price div:nth-child(1) {
    width: 50%;
}
.skeleton .style-itemList-price div:nth-child(2) {
    width: 40%;
}
.skeleton .style-itemList-txt {
    background: #f6f6f6;
    width: 100%;
    height: 16px;
    margin-bottom: 4px;
}
.skeleton .style-itemList-delivery {
    background: #f6f6f6;
    width: 35%;
    height: 16px;
    margin-bottom: 4px;
    padding: 0;
}
.skeleton .style-itemList-counts {
    background: #f6f6f6;
    width: 20%;
    height: 16px;
    margin-bottom: 4px;
    padding: 0;
}
/* 종료: 컨텐츠 > itemList */

/* 시작: 로그인 */
.style-login {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    margin: auto 0;
    padding: 30px 16px;
}
.style-login .style-login-logo {
    width: auto;
    height: 36px;
    margin: 0 auto 78px;
}
.style-login .style-login-primary {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding-bottom: 37px;
}
.style-login .style-login-secondary {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 24px;
    padding-bottom: 42px;
}
.style-login .style-login-secondaryButton {
    border: 0;
    background-color: transparent;
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 14px;
    font-weight: 500;
}
.style-login .style-login-emailSignUp {
    width: 100%;
    display: flex;
    justify-content: center;
}
.style-login .style-login-emailSignUp a {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: var(--color-gray-900);
    font-weight: 500;
    font-size: 14px;
    text-decoration: underline;
}
.style-login .style-login-emailSignUp a img {
    width: auto;
    height: 14px;
}
.style-login .style-login-problem {
    width: 100%;
    display: flex;
    justify-content: center;
    padding-top: 87px;
}
.style-login .style-login-problem a {
    color: var(--color-gray-400);
    font-weight: 400;
    font-size: 16px;
}
.style-emailLogin {
    padding: 24px 16px 30px;
}
.style-emailLogin .style-emailLogin-inputArea {
    display: flex;
    flex-wrap: wrap;
    gap: 26px;
    padding-bottom: 34px;
}
.style-emailLogin .style-emailLogin-help {
    width: 100%;
    display: flex;
    justify-content: center;
    padding-top: 24px;
}
.style-emailLogin .style-emailLogin-help a {
    color: var(--color-gray-900);
    font-weight: 500;
    font-size: 14px;
    text-decoration: underline;
}
.style-emailLogin .style-login-help {
    width: 100%;
    display: flex;
    justify-content: right;
    padding-top: 12px;
}
.style-newLogin {
    padding: 24px 16px 30px;
}
.style-newLogin .style-newLogin-inputArea {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    padding-bottom: 24px;
}
.style-newLogin .style-emailLogin-help {
    width: 100%;
    display: flex;
    justify-content: center;
    padding-top: 24px;
}
.style-newLogin .style-emailLogin-help a {
    color: var(--color-gray-900);
    font-weight: 500;
    font-size: 14px;
    text-decoration: underline;
}
.style-newLogin .style-login-help {
    width: 100%;
    display: flex;
    justify-content: right;
    padding-top: 12px;
}
.style-newLogin .style-login-help a {
    color: var(--color-gray-500);
    font-weight: 500;
    font-size: 14px;
}
.style-newLogin .style-login-help span {
    display: inline-block;
    color: var(--color-gray-500);
    font-weight: 500;
    font-size: 14px;
    margin: 0 5px;
}
.style-newLogin .style-snslogin {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding-bottom: 24px;
    margin-top: 24px;
}
.style-newLogin .style-snslogin button {
    height: 40px;
    font-size: 14px;
}
.style-newLogin-bottomText {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}
.style-newLogin-bottomText span {
    color: var(--color-gray-700);
}
.style-newLogin-bottomText .style-button {
    padding: 0 8px;
}
.passwordIconBox {
    position: relative;
}
.passwordIconBox .newLogin-passwordIcon {
    position: absolute;
    top: 50%;
    right: 12px;
    transform: translateY(-50%);
}
/* 종료: 로그인 */

/* 시작: 아이디/비밀번호 찾기 */
.style-find .style-find-article {
    padding: 33px 16px 24px;
}
.style-find .style-find-article-title {
    font-size: 24px;
    font-weight: 700;
}
.style-find .style-find-article-input {
    padding-top: 20px;
}
.style-findResult {
    padding: 26px 16px 24px;
}
.style-findResult .style-findResult-title {
    font-size: 24px;
    font-weight: 700;
}
.style-findResult .style-findResult-subTitle {
    padding-top: 8px;
    font-size: 14px;
}
.style-findResult .style-findResult-box {
    margin-top: 16px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 16px 20px;
    border-radius: 6px;
    background-color: var(--color-gray-50);
}
.style-findResult .style-findResult-box-image {
    width: 46px;
    height: 46px;
    overflow: hidden;
    border: 1px solid var(--color-gray-400);
    border-radius: 50%;
    object-fit: cover;
}
.style-findResult .style-findResult-box dl {
    display: flex;
    flex-direction: column;
    font-size: 14px;
}
.style-findResult .style-findResult-box dl dt {
    padding-bottom: 4px;
    font-size: 18px;
    font-weight: 600;
}
.style-findResult .style-findResult-box dl dd {
    color: var(--color-gray-650);
}
.style-findResult .style-findResult-cta {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding-top: 28px;
}
.style-findResult .style-findResult-password {
    display: flex;
    flex-direction: column;
    gap: 26px;
    padding: 20px 0 6px;
}
/* 종료: 아이디/비밀번호 찾기 */

/* 시작: 회원가입 */
.style-signUp {
    padding: 0 16px 24px;
}
.style-signUp-agree {
    width: 100%;
}
.style-signUp .style-signUp-agree-title {
    font-weight: 700;
    font-size: 24px;
    padding: 14px 0 20px;
}
.style-signUp .style-signUp-agree-all label {
    font-size: 16px;
    font-weight: 700;
}
.style-signUp .style-signUp-agree-list {
    border-top: 1px solid var(--color-gray-200);
    margin-top: 18px;
    padding: 16px 0;
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.style-signUp .style-signUp-agree-list label {
    width: 100%;
}
.style-signUp .style-signUp-agree-list label a {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.style-signUp .style-signUp-agree-list label a svg {
    width: auto;
    height: 16px;
}
.style-signUp .style-signUp-agree-list label a svg path {
    fill: var(--color-gray-400);
}
.style-signUp .style-signUp-progress {
    padding: 12px 0 10px;
}
.style-signUp .style-signUp-form h2 {
    font-weight: 700;
    font-size: 24px;
    padding-bottom: 16px;
}
.style-signUp .style-signUp-form-subTitle {
    margin-top: -8px;
    font-size: 14px;
}
.style-signUp .style-signUp-password {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.style-signUp-success {
    padding: 53px 16px 0;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}
.style-signUp-success .style-signUp-success-content {
    padding-top: 34px;
    text-align: center;
    font-size: 16px;
    color: var(--color-gray-700);
}
.style-signUp-success .style-signUp-success-content h2 {
    font-size: 24px;
    font-weight: 700;
    padding-bottom: 4px;
}
.style-signUp-success .style-signUp-success-content p {
    padding-top: 4px;
}
.style-signUp-success-image {
    width: 100%;
    padding: 16px 0 0;
}
.style-signUp-success-image img {
    width: 100%;
}
.style-signUp-success .style-signUp-success-bottom {
    width: 100%;
    margin-top: auto;
    padding: 14px 0 14px;
    color: var(--color-gray-700);
    text-align: center;
}
.style-signUp-error {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 30px;
    width: 100%;
    margin: auto 0;
    padding: 30px 16px;
    text-align: center;
}
.style-signUp-error .style-signUp-error-box {
    display: flex;
    justify-content: center;
}
.style-signUp-error .style-signUp-error-box span {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    border-radius: 6px;
    background-color: var(--color-gray-100);
    padding: 12px 16px;
}
.style-signUpForm-content {
    display: flex;
    flex-direction: column;
    gap: 32px;
}
.style-signUpForm-description {
    font-size: 13px;
    color: var(--color-gray-600);
    margin-top: -9px;
    padding-bottom: 12px;
}
.style-signUpForm-agree {
    padding-top: 24px;
}
.style-signUpForm-agree a {
    color: var(--color-primary-600);
    text-decoration: underline;
}
.style-signUp .style-petAdd-content {
    gap: 15px;
}
.style-signUp .style-petAdd-content .style-invalid-feedback {
    margin: 8px 0 0;
}
.style-signUp .style-petAdd-content .style-mypagePet-input {
    margin: 0 !important;
}
.style-signUp .style-petAdd-content .style-form-input-text {
    position: absolute !important;
    display: flex !important;
    flex-direction: initial !important;
    margin: 0 !important;
    width: auto !important;
    color: #adb1ba;
}
.style-petAdd-image {
    width: 100%;
    text-align: center;
}
.style-petAdd img {
    width: 100%;
}
.style-petAdd-text {
    text-align: center;
    font-size: 1.6rem;
    line-height: 1.5;
}
.style-signUp-form .style-profile-photoInput {
    width: 120px;
    height: 120px;
    margin-top: 30px;
}
.style-signUp-form .style-profile-photoInput-image {
    background-color: #f8f8f8;
}
.style-signUp-form .style-profile-photoInput-image path {
    fill: #f8f8f8;
}
.style-alert .style-alert-dialog.signUpSuccess {
    max-width: calc(340px + 32px);
}
.signUpSuccess-img {
    overflow: hidden;
    margin: 0 auto 16px;
}
.signUpSuccess-img img {
    max-width: 100%;
}
.signUpSuccess-contBox {
    text-align: center;
}
.signUpSuccess-title {
    font-size: 25px;
    color: var(--color-gray-900);
    font-weight: 600;
    line-height: 1.5;
    margin-bottom: 8px;
    display: block;
}
.signUpSuccess-text {
    display: block;
    color: var(--color-gray-650);
}
/* 종료: 회원가입 */


/* 시작: 검색 */
.style-search-bar {
    width: calc(100% - 60px - 24px);
    position: absolute;
    left: 60px;
    top: 4px;
}
.style-search-bar .search-bar {
    width: 100%;
    height: 42px;
    border-radius: 8px;
    background-color: #f4f4f5;
    color: #000000;
    cursor: text;
    display: inline-flex;
    position: relative;
    font-size: 1.6rem;
    box-sizing: border-box;
    align-items: center;
    font-weight: 400;
    line-height: 1.1876em;
}
.style-search-bar .search-bar input {
    height: 36px;
    background-color: var(--color-gray-100);
    border: 0;
    padding: 6px 36px 6px 12px;
    display: block;
    width: 100%;
    font-weight: 400;
    line-height: 1.5;
    color: var(--bs-body-color);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-clip: padding-box;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    box-shadow: none !important;
    border-color: var(--color-gray-400);
    caret-color: var(--color-primary-600);
    font-size: 16px;
    border-radius: 6px;
}
.style-search {
    padding: 16px 0;
    position: relative;
    border-top: 1px solid #9523DC;
}
.style-search .style-search-contents {
    padding-bottom: 25px;
}
.style-search .style-search-contents-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 34px;
    padding: 0 16px;
}
.style-search .style-search-contents-header h3 {
    font-weight: 700;
    font-size: 16px;
}
.style-search .style-search-contents-header h3 span {
    color: #A1A1A1;
    font-size: 1.2rem;
    font-weight: 400;
    padding-left: 8px;
}
.style-search .style-search-contents-header button {
    font-size: 14px;
    color: var(--color-gray-700);
}
.style-search .style-latest-search-chips {
    padding: 8px 0;
}
.style-search .style-latest-search-chips swiper-slide {
    width: auto;
    height: auto;
}
.style-search-results {
    /*padding: 16px 0;*/
}
.style-search-empty {
    color: #646464;
    margin: 0;
    padding: 13px 16px 0;
    line-height: 1.5;
}
.style-search-recommend {
    gap: 8px 7px;
    display: flex;
    padding: 6px 16px;
    overflow: hidden;
    flex-wrap: wrap;
    max-height: 120px;
}
.style-search-recommend button {
    height: 30px;
    padding: 5px 12px;
    font-size: 1.3rem;
    min-width: 0;
    flex-shrink: 0;
    font-weight: 400;
    line-height: 1;
    border-color: #EAEBEE;
    border-radius: 30px;
    color: #4D5159;
    border: 1px solid #EAEBEE;
}
.style-search-popularity {

}
.style-search-popularity ol {
    margin: 0;
    padding: 0 20px;
    list-style: none;
}
.style-search-popularity li {
    border-top: 1px solid #F6F6F6;
}
.style-search-popularity li:first-child {
    border-top: none;
}
.style-search-popularity button {
    width: 100%;
    padding: 16px 0;
    font-size: 1.5rem;
    text-align: left;
    font-family: Pretendard,sans-serif;
    justify-content: flex-start;
}
.style-search-popularity button span {
    color: #A647E3;
    width: 16px;
    display: block;
    text-align: center;
    font-weight: 500;
    margin-right: 14px;
}
.style-search-results-top {
    width: 100%;
    height: 49px;
    display: flex;
    padding: 0;
    position: sticky;
    font-size: 1.2rem;
    box-sizing: border-box;
    align-items: center;
    background-color: #fff;
    top: 50px;
    z-index: 1000;
}
.style-search-total {
    padding-left: 16px;
    color: var(--color-gray-650);
}
.style-search-total strong {
    color: var(--color-gray-900);
}
.style-search-option {
    top: 0;
    right: 16px;
    height: 48px;
    position: absolute;
    font-size: 1.2rem;
    background: none;
    font-weight: 400;
    background-color: transparent;
    padding: 6px 8px;
    color: #000000;
    border: 0;
    cursor: pointer;
    margin: 0;
    display: inline-flex;
    outline: 0;
    align-items: center;
    user-select: none;
    border-radius: 0;
    vertical-align: middle;
    -moz-appearance: none;
    justify-content: center;
    text-decoration: none;
    -webkit-appearance: none;
    -webkit-tap-highlight-color: transparent;
}
.style-search-option .style-formLabel {
    width: 100%;
    display: inherit;
    align-items: inherit;
    justify-content: inherit;
    font-size: 1.2rem;
}
.style-search-option-icon {
    display: inherit;
    margin-left: 8px;
    margin-right: -4px;
}
.style-search-option-icon svg {
    top: 1px;
    width: 18px;
    height: 18px;
    position: relative;
    fill: currentColor;
    display: inline-block;
    font-size: 2.4rem;
    transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    flex-shrink: 0;
    user-select: none;
}
.style-search-autocomplete {
    position: fixed;
    width: 100%;
    max-width: 600px;
    height: calc(100vh - 50px);
    max-height: 100vh;
    top: 50px;
    left: 50%;
    padding-top: 10px;
    background: #fff;
    transform: translateX(-50%);
    z-index: 100;
}
.autocomplete-list {

}
.autocomplete-list li {

}
.autocomplete-list button {
    height: 48px;
    padding: 12px 20px;
    font-size: 1.6rem;
    text-align: left;
    font-weight: 400;
    border-radius: 0;
    justify-content: flex-start;
    width: 100%;
    background-color: transparent;
}
.autocomplete-list .autocomplete-label {
    width: 100%;
    display: inherit;
    align-items: inherit;
    justify-content: inherit;
}
.autocomplete-list .autocomplete {
    color: #A647E3;
}
/* 종료: 검색 */

/* 시작: 검색필터 */
.MuiBackdrop-root {
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    z-index: -1;
    position: fixed;
    align-items: center;
    justify-content: center;
    background-color: rgba(0, 0, 0, 0.5);
    -webkit-tap-highlight-color: transparent;
}
/* 종료: 검색필터 */

/* 시작: 컨텐츠 아이템 */
.style-contItem {
    position: relative;
    padding: 0 0 30px;
}
.style-contItem swiper-container {

}
.style-contItem swiper-slide {
    width: 156px;
    margin-right: 8px;
}
.style-contItem swiper-slide:first-child {
    margin-left: 16px;
}
.style-contItem swiper-slide:last-child {
    margin-right: 16px;
}
.style-contItem-header {
    padding: 0 16px 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.style-contItem-title {
    font-size: 18px;
    font-weight: 700;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
/* 종료: 컨텐츠 아이템 */

/* 시작: 상세페이지 */
.style-detail-imageArea {
    /*margin-top: calc(0px - var(--layout-header-height));*/
    width: 100%;
    /*aspect-ratio: 375/222;*/
    position: relative;
    overflow: hidden;
    aspect-ratio: 1 / 1;
}
.style-swiperDetailThumbnail {

}
.style-swiperDetailThumbnail swiper-slide {
    flex-shrink: 0;
    height: 100%;
    position: relative;
    aspect-ratio: 1 / 1;
}
.style-swiperDetailThumbnail swiper-slide:before {
    content: "";
    display: block;
    padding-top: 100%;
}
.style-swiperDetailThumbnail swiper-slide button {
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    position: absolute;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}
.style-swiperDetailThumbnail swiper-slide img {
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    bottom: 0;
    height: 100%;
    overflow: hidden;
    position: absolute;
    object-fit: cover;
}
.style-swiperDetailThumbnail-fraction {
    right: 16px;
    bottom: 16px;
    display: inline-flex;
    z-index: 20;
    position: absolute;
    align-items: center;
    color: #fff;
    padding: 2px 6px;
    font-size: 1.2rem;
    text-align: center;
    border-radius: 20px;
    justify-content: center;
    top: auto;
    left: auto;
    width: auto;
    background: rgba(93, 93, 93, 0.50);
}
.style-swiperDetailThumbnail-fraction span {
    display: inline-block;
    padding: 0 3px;
}
.style-detail-imageArea-badge {
    top: 16px;
    left: 16px;
    z-index: 10;
    position: absolute;
}
.style-detail-imageArea-badge .imageArea-badge {
    padding: 0 10px;
    height: 24px;
    color: #fff;
    font-size: 1.2rem;
    display: inline-flex;
    overflow: hidden;
    align-items: center;
    flex-shrink: 0;
    font-weight: 700;
    line-height: 1;
    border-radius: 6px;
    letter-spacing: -0.02em;
    justify-content: center;
    background-color: #BD76FF;
}
.style-detail-badge-right {
    position: absolute;
    top: 16px;
    right: 16px;
    width: 76px;
    height: 76px;
    z-index: 5;
}

/* 1+1 badge rmfwk */
.style-detail-badge-right .gift_badge{
    background-image:url("../img/icon/itemList-bogo-bg.svg");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color:#FFF;
    font-size:3.2rem;
    font-weight:800;
    letter-spacing: -0.1rem;
}

.style-detail-badge-bottom-right {
    position: absolute;
    bottom: 16px;
    right: 16px;
    width: 76px;
    height: 76px;
    z-index: 5;
}

/* 1+1 badge rmfwk */
.style-detail-badge-bottom-right .gift_badge{
    background-image:url("../img/icon/itemList-black-bg.svg");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color:#FFF;
    font-size:3.2rem;
    font-weight:800;
    letter-spacing: -0.1rem;
}

.style-detail-badge-bottom-left {
    position: absolute;
    bottom: 16px;
    left: 16px;
    width: 124px;
    height: 124px;
    z-index: 5;
}
.style-detail-badge-bottom-left img {
    width:100%;
    height:100%;
}
.style-detail-badge-right img {
    width: 100%;
    height: 100%;
}
.style-detail-imageArea-freeGift {
    right: 16px;
    bottom: 16px;
    z-index: 10;
    position: absolute;
    width: 164px;
    height: 164px;
}
/* 별도로 사용되는 사은품 이미지 */
.style-detail-imageArea-freeGift-top {
    right: 16px;
    top: 16px;
    z-index: 10;
    position: absolute;
    width: 200px;
    height: 200px;
}

.style-detail-imageArea-freeGift-top .imageArea-freeGift-txt {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    overflow: hidden;
}
.style-detail-imageArea-freeGift-top .imageArea-freeGift-txt span {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    background: #000;
    color: #fff;
    font-size: 38px;
    font-weight: 700;
    text-align: center;
    height: 50px;
    line-height: 45px;
    z-index: 2;
}

.style-detail-imageArea-freeGift-top .imageArea-freeGift-img {
    width: 100%;
    border: 3px solid #000;
    height: 100%;
    overflow: hidden;
    position: relative;
    border-radius: 50%;
    background-color: #fff;
}
.style-detail-imageArea-freeGift-top .imageArea-freeGift-img img {
    top: 50%;
    left: 50%;
    width: 82%;
    height: 82%;
    position: absolute;
    transform: translate(-50%, -50%);
    transition: all 0.4s ease;
}



.style-detail-imageArea-icon {
    left: 10px;
    bottom: 10px;
    z-index: 11;
    position: absolute;
}
.style-detail-imageArea-icon img {
    width: 90px;
    height: 90px;
}
.style-detail-bottom-badge {
    position: absolute;
    bottom: 16px;
    left: 16px;
    z-index: 15;
}
.style-detail-bottom-badge .bottom-badge {
    border-radius: 20px;
    background: rgba(0, 0, 0, 0.50);
    padding: 3px 8px 3px 3px;
    gap: 3px;
    display: flex;
    margin-top: 6px;
    color: #fff;
    font-size: 12px;
    align-items: center;
    font-weight: 600;
}
.style-detail-swiperFullScreen {
    width: 100%;
    height: calc(100% - 111px);
    background-color: #F6F6F6;
}
.style-detail-couponDown-content {
    padding: 0 20px 12px;
    display: flex;
    flex-direction: column;
    gap: 30px;
}
.style-detail-couponDown-close {

}
.style-detail-couponDown-close > div {
    width: 100%;
    /*padding: 6px 20px 20px;*/
    padding-top:6px;
    padding-left:20px;
    padding-right:20px;
    background-color: var(--color-common-white);

    padding-bottom: calc(var(--safe-area-inset-bottom, env(safe-area-inset-bottom, 0px)) + 5px);
}


.style-detail-cp_view-content {
    padding: 0 20px 12px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-height: 250px;
}

.style-detail-cp_view-content h2{
    color:#000;
    font-weight: 700;
    font-size: 22px;
    line-height: 140%;
    text-align: center;

}

.style-detail-cp_view-content .box{
    border:1px solid #E3E3E3;
    border-radius: 10px;
    padding:19px 40px;
    margin-bottom:10px;
    font-size: 16px;
    font-weight: 400;
    line-height: 140%;
    text-align: center;
    margin-left:16px;
    margin-right:16px;
}
.style-detail-cp_view-content .box .red {
    color: #D40022;
    font-weight: 700;
}
.style-detail-cp_view-content .cp_timer{
   color:#8D8D8D;
   font-size: 16px;
   font-weight: 500;
    text-align: center;
}

.style-detail-deliveryList ul {
    gap: 8px;
    margin: 0;
    display: flex;
    padding: 0;
    flex-direction: column;
}
.style-detail-deliveryList li {
    font-size: 1.4rem;
    list-style: none;
}
.style-detail-deliveryList li:first-child {
    font-weight: 600;
}
.style-detail-deliveryList p {
    color: #646464;
    margin: 0;
    padding: 24px 0 0;
    font-size: 1.4rem;
}
.imageArea-freeGift-icon {
    top: -13px;
    width: 26px;
    height: 26px;
    left: 50%;
    z-index: 1;
    position: absolute;
    transform: translateX(-50%);
    margin: auto;
    display: block;
    max-width: 100%;
}
.imageArea-freeGift-img {
    width: 100%;
    border: 1px solid #000;
    height: 100%;
    overflow: hidden;
    position: relative;
    border-radius: 50%;
    background-color: #fff;
}
.imageArea-freeGift-img img {
    top: 50%;
    left: 50%;
    width: 82%;
    height: 82%;
    position: absolute;
    transform: translate(-50%, -50%);
    transition: all 0.4s ease;
}

.style-detail-imageArea-freeGift .imageArea-freeGift-txt {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    overflow: hidden;
}
.style-detail-imageArea-freeGift .imageArea-freeGift-txt span {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    background: #000;
    color: #fff;
    font-size: 22px;
    font-weight: 700;
    text-align: center;
    height: 33px;
    line-height: 31px;
    z-index: 2;
}

.style-detail-today-sale {
    justify-content: center;
    padding: 10px;
    /*background-color: #f6eefa;*/
    background: rgba(0, 0, 0, 0.70);
    display: flex;
    margin-bottom:10px;
}
.style-detail-today-sale .today-sale {
    /*color: #8423D6;*/
    color: #fff;
    font-size: 15px;
    font-weight: 600;
}
.style-detail-content {
    background-color: var(--color-gray-50);
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.style-detail-article {
    background-color: var(--color-common-white);
    padding: 0;
    position: relative;
    border-top: 1px solid #F0F0F0;
    border-bottom: 1px solid #F0F0F0;
}
.style-detail-article-info {
    padding: 5px 16px 20px 16px;
}
.style-detail-article-content {
    padding: 0 0 16px;
}
.style-detail-article:first-child {
    border-top: 0
}
.style-detail-article:last-child {
    margin-bottom: 10px;
}
.style-detail-article img {
    max-width: 100%;
}
.style-detail-info-top {
    display: flex;
    margin-left:-4px;
    margin-bottom: 10px;
    gap: 5px;
}
.style-detail-info-top .r-text {
    background: #F0F0F0;
    display: flex;
    height: 23px;
    padding: 3px 8px;
    align-items: center;
    gap: 2px;
    border-radius: 30px;
    font-size: 12px;
    color: #787878;
    font-weight: 600;
}
.style-detail-info-top .r-text button {
    color: #F0F0F0;
    border: 0;
    background: none;
}
.style-detail-info-top .r-text button svg {
    width: auto;
    height: 16px;
    fill: currentColor;
    display: inline-block;
    font-size: 2.4rem;
    transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    flex-shrink: 0;
    user-select: none;
}
.style-detail-info-top .r-text strong {
    color: #00A000;
    font-weight: 700;
}
.style-detail-info-top .r-text span {
    font-weight: 500;
}
.style-detail-info {
    display: flex;
    flex-direction: column;
}
.style-detail-brand a {
    color: #0073e9;
    text-decoration: none;
}
.style-detail-titleBox {
    position: relative;
    padding-right: 40px;
}
.style-detail-title {
    margin: 0;
    font-size: 1.8rem;
    font-weight: 500;
}
.style-detail-share {
    top: 2px;
    right: 0;
    position: absolute;
    border: 0;
    background: none;
}
.style-detail-share svg {
    fill: currentColor;
    width: 1em;
    height: 1em;
    display: inline-block;
    font-size: 2.4rem;
    transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    flex-shrink: 0;
    user-select: none;
}
.style-detail-review {
    margin-top: 2px !important;
    color: #848BA0;
    display: flex;
    font-size: 1.1rem;
    align-items: center;
    line-height: 1;
    padding-top: 3px;
    white-space: nowrap;
    text-decoration: none;
}
.style-detail-review a {
    display: flex;
    align-items: center;
    text-decoration: none;
}
.style-detail-review .style-detail-rating {
    margin: 0 4px 3px 0;
    display: flex;
}
.style-detail-review .style-detail-rating svg {
    width: 14px;
    height: 14px;
}
.style-detail-badge {
    color: #fff;
    padding: 3px 10px;
    font-size: 11px;
    background: #00BFA7;
    font-weight: 700;
    line-height: 150%;
    margin-left: 3px;
    border-radius: 26px;
}
.style-detail-txt {
    position: relative;
    color: #0060D1;
    font-size: 1.4rem;
    padding-left: 2px;
    text-decoration: none;
    margin-top:-1px;
}
.style-detail-price {
    padding-top: 5px;
    position: relative;
}
.style-detail-price > div {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
}
.style-detail-price div > div {
    display: flex;
    font-size: 1.4rem;
    align-items: baseline;
    font-family: Pretendard,sans-serif;
    font-weight: 400;
    justify-content: flex-start;
    color: #D40022;
}
.style-detail-price .price-chekText {
    color: #C10000;
    display: flex;
    font-size: 1.3rem;
    padding-top: 5px;
    justify-content: flex-start;
}
.style-detail-price .discount {
    color: #787878;
    font-size: 1.6rem;
    font-weight: 700;
    padding-right: 2px;
    letter-spacing: -0.05rem;
}
.style-detail-price s {
    color: #787878;
}
.style-detail-price .price_bk {
    font-size: 22px;
    align-items: center;
    font-family: Pretendard,sans-serif;
    color: #000;
}
.style-detail-price .price {
    font-size: 22px;
    align-items: center;
    font-family: Pretendard,sans-serif;
}
.style-detail-price .price span, .style-detail-price .price_bk span {
    font-size: 16px;
    font-weight: 600;
}
.style-detail-price .price-text {
    font-size: 1.2rem;
    padding-left: 4px;
}
.style-detail-price .price-btext {
    padding: 0 0 0 4px;
    font-size: 16px;
    line-height: 1.5;
    font-weight: 600;
}
.style-detail-price #discountOpen {
    display: flex;
    align-items: baseline;
    padding-right: 21px;
    position: relative;
}
.style-detail-price #discountOpen svg {
    position: absolute;
    top: 9px;
    right: 0;
    width: 16px;
    height: 16px;
    transition: all ease 0.3s;
}
.style-detail-price #discountOpen.open svg {
    transform: rotate(-180deg);
}
.style-detail-price .discountBox {
    position: relative;
    width: 100%;
    margin-top:-5px;
}
.detail-couponButton {
    position: absolute;
    bottom: 0;
    right: 0;
    border-radius: 8px;
    border: 1px solid rgba(212, 0, 34, 0.20);
    background: rgba(212, 0, 34, 0.08);
    display: flex;
    width: 100px;
    height: 38px;
    padding: 12px;
    align-items: center;
    color: #D40022;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
}
.detail-couponButton svg {
    margin-right: 3px;
}
.detail-couponButton-chek {
    position: absolute;
    bottom: 0;
    right: 0;
    border-radius: 8px;
    border: 1px solid #F1F4F6;
    background: #F1F4F6;
    display: flex;
    width: 100px;
    height: 38px;
    padding: 12px;
    align-items: center;
    color: #757575;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
}
.detail-couponButton-chek svg {
    margin-left: 3px;
}
.total-discount {
    width: 100%;
    height: 0;
    overflow: hidden;
    transition: height 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    transition-duration: 300ms;
}
.total-discount.open {
    min-height: 0;
    height: auto;
}
.total-discount ul {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 8px;
    border-radius: 8px;
    border: 1px solid #3F3F3F;
    padding: 15px;
    margin-top: 12px;
}
.total-discount ul li {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.total-discount ul li span {
    color: #7A7A7A;
    font-size: 11px;
    font-weight: 500;
}
.total-discount ul li .price {
    color: #000;
    font-size: 11px;
    font-weight: 400;
}
.total-discount ul li.total {
    border-top: 1px solid #E8ECEF;
    padding-top: 11px;
}
.total-discount ul li.total strong {
    color: #D40022;
    font-size:12px;
}

.style-detail-article-info .total-discount ul li span {
    color: #7A7A7A;
    font-size: 13px;
    font-weight: 500;
}
.style-detail-article-info .total-discount ul li .price {
    color: #000;
    font-size: 13px;
    font-weight: 400;
}
.style-detail-article-info .total-discount ul li.total {
    border-top: 1px solid #E8ECEF;
    padding-top: 11px;
}
.style-detail-article-info .total-discount ul li.total strong {
    color: #D40022;
    font-size:15px;
}

.style-detail-article-info .total-discount ul li.total strong span {
    color: #D40022;
}


.style-detail-coupon {
    /*padding: 0 0 14px;*/
    margin-top: 10px;
}
.detail-coupon {
    color: #A647E3;
    width: 100%;
    border: 1px solid #A647E3;
    display: flex;
    padding: 12px;
    font-size: 1.4rem;
    align-items: center;
    font-family: Pretendard,sans-serif;
    font-weight: 700;
    border-radius: 6px;
    justify-content: space-between;
}
.style-detail-coupon-text {
    gap: 6px;
    display: flex;
    align-items: center;
}
.style-detail-coupon-text svg {
    width: auto;
    height: 20px;
}
.style-detail-coupon-down {
    width: 26px;
    height: 26px;
    display: flex;
    align-items: center;
    flex-shrink: 0;
    border-radius: 50%;
    justify-content: center;
    background-color: #A647E3;
}
.style-detail-coupon-down svg {
    width: auto;
    height: 14px;
}
.style-detail-salePrice {
    display: flex;
    margin-top: 16px;
}
.style-detail-salePrice .detail-salePrice {
    border-radius: 4px;
    background-color: #FBECE9;
    color: #E1450F;
    padding: 5px;
    font-weight: 500;
    font-size: 1.3rem;
    display: flex;
    align-items: center;
}
.style-detail-salePrice .detail-salePrice svg {
    margin-right: 4px;
}
.style-detail-cash {
    padding: 7px 0 23px 0;
}
.style-detail-noCash {
    padding-bottom: 3px;
    color: #A647E3;
    display: flex;
    font-size: 1.3rem;
    justify-content: flex-start;
}
.style-detail-mycash {
    line-height: 1;
    display: flex;
    font-size: 1.5rem;
    background: #fff;
    align-items: center;
    justify-content: flex-start;
}
.style-detail-mycash img {
    width: 18px !important;
    height: 18px !important;
    /*margin-top: -2.5px;*/
    margin-right: -3px;
}
.style-detail-mycash span {
    font-size: 1.4rem;
    padding-left: 6px;
}
.style-detail-freeGift {
    width: 100%;
    margin-top: 2px;
    margin-bottom: 20px;
}
.style-detail-option {

}
.style-detail-unit {
    padding-bottom:4px;
    margin-bottom: 14px;
}
.style-detail-unit-title {
    display: flex;
    width: 100%;
    margin-bottom: 6px;
}
.style-detail-unit-title dl {
    display: flex;
    align-items: center;
}
.style-detail-unit-title dt {
    margin-right: 8px;
    display: inline-flex;
    font-weight: 400;
}
.style-detail-unit-title dd {
    display: inline-flex;
    font-weight: 600;
}
.style-detail-optionList {
}
.style-detail-optionList swiper-slide {
    margin-right: 8px !important;
    width: auto !important;
}
.style-detail-optionList swiper-slide:first-child {
    margin-left: 0 !important;
}
.style-detail-optionList button {
    border: 1px solid rgba(0,0,0,.15);
    border-radius: 4px;
    padding: 12px 10px;
    min-width: 70px;
    display: block !important;
    text-align: center;
    align-items: baseline;
}
.style-detail-optionList.optionStyle2 button {
    min-width: 100px;
    min-height: 95px;
}
.style-detail-optionList button.soldOut {
    border: 1px dotted rgba(0,0,0,.15);
    color: var(--color-gray-400);
}
.style-detail-optionList button.soldOut span {
    color: var(--color-gray-300);
}
.style-detail-optionList button.active {
    border: 1px solid var(--color-mainColor);
    color: var(--color-gray-900);
    /*background: #FCF8FF;*/
}
.style-detail-optionList button div {
    display: block;
    text-align: left;
    font-weight: 600;
    margin-bottom: 5px;;
}
.style-detail-optionList button span {
    display: block;
    font-size: 1.3rem;
    color: var(--color-mainColor);;
}
.style-detail-sample {
    display: flex;
    padding: 20px 0;
    font-size: 1.4rem;
    border-top: 1px solid #F0F0F0;
    align-items: flex-start;
    line-height: 1.5;
}
.style-detail-sample-icon {
    width: 24px;
    line-height: 1;
}
.style-detail-sample-icon svg {
    fill: currentColor;
    width: 1em;
    height: 1em;
    display: inline-block;
    font-size: 2.4rem;
    transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    flex-shrink: 0;
    user-select: none;
}
.style-detail-sample-text {
    margin: 0;
    padding: 0 0 0 8px;
}
.style-detail-sample-more {
    width: 100%;
    padding-top: 8px;
}
.style-detail-sample-more button {
    font-size: 1.3rem;
    font-family: Pretendard,sans-serif;
    text-decoration: underline;
}
.detail-freeGift {
    align-items: flex-start;
    justify-content: space-between;
    width: 100%;
    border: 1px solid #EBD7FA;
    display: flex;
    padding: 9px 13px;
    border-radius: 8px;
    background-color: #FCF8FF;
    color: #000000;
    font-size: 1.4rem;
    min-width: 64px;
    box-sizing: border-box;
    transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    font-weight: 500;
    line-height: 1.75;
    text-transform: uppercase;
}
.detail-freeGift span {
    display: flex;
    align-items: center;
    width: 100%;
    justify-content: inherit;
}
.detail-freeGift-text {
    color: #6A1CA1;
    width: calc(100% - 22px);
    font-size: 1.4rem;
    text-align: left;
    font-weight: 400;
    line-height: 1.2;
    padding-bottom: 1px;
    text-transform: lowercase;
}
.detail-freeGift-arrow {
    display: flex;
}
.detail-freeGift-arrow svg {
    color: #6A1CA1;
    width: 12px;
    height: 12px;
    margin: auto 0;
    margin-right: -6px;
}
.detail-freeGift-arrow path {
    stroke: #6A1CA1;
}
.style-detail-shelfLife {
    align-items: center;
    display: flex;
    padding: 20px 0;
    font-size: 1.4rem;
    border-top: 1px solid #F0F0F0;
    line-height: 1.5;
}
.style-detai-shelfLife-icon {
    width: 24px;
    line-height: 1;
}
.style-detail-shelfLife-text {
    margin: 0;
    display: flex;
    padding: 0 0 0 8px;
    align-items: center;
    line-height: 1;
}
.style-detail-shelfLife-text button {
    color: #fff;
    margin-left: 4px;
    border: 0;
    background: none;
}
.style-detail-shelfLife-text button svg {
    width: auto;
    height: 16px;
    fill: currentColor;
    display: inline-block;
    font-size: 2.4rem;
    transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    flex-shrink: 0;
    user-select: none;
}
.style-detail-delivery {
    border-top: 1px solid #F0F0F0;
    gap: 2px;
    display: flex;
    padding-top: 20px;
    flex-direction: column;
}
.style-detail-delivery dl {
    gap: 2px;
    display: flex;
    flex-direction: column;
}
.style-detail-delivery dt {
    align-items: center;
    line-height: 1;
    display: flex;
}
.style-detail-delivery dt svg {
    width: 24px;
    height: 24px;
    display: inline-block;
    font-size: 2.4rem;
    transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    flex-shrink: 0;
    user-select: none;
}
.style-detail-delivery .delivery-market {
    color: #A647E3;
}
.style-detail-delivery .delivery-market svg path {
    fill: #A647E3;
}
.style-detail-delivery .delivery-brand {
    color: #000000;
}
.style-detail-delivery .delivery-brand svg path {
    fill: #000000;
}
.style-detail-delivery dt span {
    padding-left: 8px;
    line-height: 24px;
}
.style-detail-delivery dd {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    font-size: 1.4rem;
    align-items: center;
    padding-left: 32px;
    justify-content: flex-start;
}
.style-delivery-price {
    color: #646464;
}
.delivery-info-button {
    color: #fff;
    margin-left: 4px;
    border: 0;
    background: none;
}
.delivery-info-button svg {
    width: auto;
    height: 16px;
    fill: currentColor;
    display: inline-block;
    font-size: 2.4rem;
    transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    flex-shrink: 0;
    user-select: none;
}
.style-detail-summary {
    padding: 16px;
    border-bottom: 1px solid #F0F0F0;
}
.style-detail-summary:nth-child(2) {
    border-bottom: none;
}
.style-detail-summary button {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    box-sizing: border-box;
    align-items: center;
    flex-direction: row;
    justify-content: flex-start;
    background: #fff;
}
.style-detail-summary button h4 {
    font-size: 1.7rem;
    font-weight: 600;
    padding-bottom: 8px;
}
.style-detail-summary button .summary-cont {
    width: 100%;
    display: flex;
    font-size: 1.5rem;
    text-align: left;
    align-items: center;
    line-height: 1.6;
    flex-direction: row;
    justify-content: space-between;
}
.style-detail-summary button .summary-cont .textBox {
    width: 100%;
    display: -webkit-box;
    overflow: hidden;
    white-space: break-word;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 5;
}
.style-detail-summary button .summary-cont .arrowBox {
    width: 24px;
    flex-grow: 0;
    flex-basis: 24px;
    text-align: right;
    flex-shrink: 0;
}
.style-detail-summary button .summary-cont .arrowBox svg {
    width: 16px;
    height: 16px;
    fill: currentColor;
    display: inline-block;
    font-size: 2.4rem;
    transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    flex-shrink: 0;
    user-select: none;
}
.style-detail-summary button .summary-cont .arrowBox path {
    fill: #A1A1A1;
}
.style-detail-summaryH {
    border-bottom:1px solid #F0F0F0;
}

.style-detail-summaryH button {
    display: flex;
    align-items: center;      /* 세로 가운데 정렬 */
    width: 100%;
    /* 버튼 기본 스타일 초기화 (필요하면) */
    background: none;
    border: 0;
    padding: 12px 16px;
    text-align: left;
    cursor: pointer;
}

.style-detail-summaryH button h4 {
    margin: 0;
}

.arrowBoxH {
    margin-left: auto;        /* ← 이게 핵심. 남는 공간 다 밀어서 오른쪽 끝으로 */
    display: flex;
    align-items: center;
}

.arrowBoxH svg {
    width: 16px;
    height: 16px;
    fill: currentColor;
    display: inline-block;
    font-size: 2.4rem;
    transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    flex-shrink: 0;
    user-select: none;
}
.arrowBoxH svg path {
    fill:#A1A1A1;
}



.summary-li li {
    position: relative;
    list-style: none;
    margin-top: 2px;
    padding-left: 10px;
}
.summary-li li:before {
    top: 6px;
    left: 0;
    width: 4px;
    height: 4px;
    content: "";
    display: block;
    position: absolute;
    border-radius: 50%;
    background-color: #A1A1A1;
}
.style-detail-summary-cont {
    padding: 16px;
    line-height: 1.6;
    color: var(--color-gray-900);
}
.style-detail-summary-cont h4 {
    margin: 0 0 10px 0 !important;
    font-size: 1.4rem !important;
    font-weight: 700 !important;
}
.style-detail-summary-cont h5 {
    font-size: 1.3rem;
    font-weight: 600;
    margin-bottom: 4px;
}
.style-detail-summary-cont p {
    margin-bottom: 16px;
    line-height: 1.6;

}
.style-detail-summary-cont .summary-li {
    margin-bottom: 16px;
}
.style-detail-shelfLife-button {
    color: #0073e9;
    margin: -10px 0 16px;
}
.style-detail-shelfLife-button.active svg {
    transform:rotate(180deg);
}
.style-detail-shelfLife-cont {
    display: none;
    margin: -10px 0 16px;
}
.style-detail-header {
    border-bottom: 1px solid #F0F0F0;
    background-color: #fff;
}
.style-detail-header.style-detail-header-noline {
    border-bottom: 0;
}
.style-detail-header button, .style-detail-header a, .style-detail-header-title {
    cursor: default;
    width: 100%;
    display: flex;
    padding: 20px 16px;
    align-items: center;
    justify-content: space-between;
}
.style-detail-header button h3, .style-detail-header a h3, .style-detail-header-title h3 {
    margin: 0;
    font-size: 1.8rem;
    font-weight: 700;
}
.style-detail-header button svg, .style-detail-header a svg {
    fill: currentColor;
    width: 1em;
    height: 1em;
    display: inline-block;
    font-size: 2.4rem;
    transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    flex-shrink: 0;
    user-select: none;
}
.style-detail-innerBox {
    padding: 16px 16px 20px;
}
.style-detail-innerBox .swiperBox {
    width: calc(100% + 32px) !important;
    position: relative;
    margin-left: -16px;
}
.style-detail-item {
    padding: 0 16px 20px 16px;
    width: 100%;
    overflow: inherit;
    font-size: 1.4rem;
    background-color: transparent;
}
.style-detail-item a {
    display: flex;
    align-items: start;
    text-align: inherit;
    position: relative;
    border-radius: 0;
    vertical-align: middle;
    justify-content: center;
}
.style-detail-item-thumbnail {
    position: relative;
}
.style-detail-item-thumbnail .detail-item-thumbnail {
    width: 110px;
    background: url(../img/placeholder-img.svg) no-repeat 50% 50%;
    background-size: cover;
    overflow: hidden;
    margin-bottom: auto;
    display: block;
}
.style-detail-item-thumbnail:before {
    display: block;
    height: 0;
    padding-top: 100%;
    content: "";
}
.style-detail-item-thumbnail img {
    top: 50%;
    left: 50%;
    width: 100%;
    height: auto;
    position: absolute;
    transform: translate(-50%, -50%);
}
.style-detail-item-soldout {
    top: 0;
    left: 0;
    color: #fff;
    right: 0;
    width: 100%;
    bottom: 0;
    height: 100%;
    display: flex;
    position: absolute;
    font-size: 1.6rem;
    align-items: center;
    font-weight: 500;
    justify-content: center;
    background-color: rgba(0,0,0,0.2);
}
.style-detail-item-info {
    width: 100%;
    display: flex;
    padding: 8px 0 0;
    flex-grow: 0;
    align-items: flex-start;
    flex-shrink: 1;
    font-family: Pretendard,sans-serif;
    margin-left: 8px;
    flex-direction: column;
    justify-content: center;
}
.style-detail-item-info h3 {
    font-size: 1.4rem !important;
    white-space: normal;
    text-overflow: inherit;
    -webkit-box-orient: inherit;
    -webkit-line-clamp: 1;
    width: 100%;
    margin: 0;
    display: -webkit-box;
    overflow: hidden !important;
    position: relative;
    max-height: 40px;
    text-align: left;
    font-weight: 400;
    line-height: 1.4;
}
.style-detail-item-price {
    font-size: 1.5rem;
    margin-top: 6px;
}
.style-detail-item-price .discount {
    color: #EA333E;
    font-size: 1.3rem;
    font-family: Pretendard,sans-serif;
    font-weight: 600;
    margin-right: 4px;
    font-size: 1.3rem;
}
.style-detail-item-price .price {
    font-size: 1.3rem;
    font-family: Pretendard,sans-serif;
    font-weight: 600;
}
.style-detail-item-price .price-soldOut {
    font-size: 1.3rem;
    font-family: Pretendard,sans-serif;
    font-weight: 600;
    color: #848BA0;
}
.style-detail-item-counts {
    color: #848BA0;
    display: flex;
    font-size: 1.1rem;
    align-items: center;
    line-height: 1;
    padding-top: 10px;
    white-space: nowrap;
}
.style-detail-item-counts div {
    font-size: 1.2rem;
    letter-spacing: -0.24px;
    display: flex;
    align-items: center;
    line-height: 1;
}
.style-detail-item-counts div img {
    width: auto;
    height: 14px;
    position: relative;
}
.style-detail-item-counts span {
    font-size: 1.2rem;
    padding-left: 1px;
    letter-spacing: -0.24px;
}
.style-detail-article swiper-slide {
    width: 156px;
    margin-right: 8px;
}
.style-detail-article swiper-slide:first-child {
    margin-left: 16px;
}
.style-detail-article swiper-slide:last-child {
    margin-right: 16px;
}
.style-detail-introduce-contentWrap {
    padding-top: 16px;
}
.style-detail-introduce-content {
    max-height: 620px;
    overflow: hidden;
    position: relative;
}
figure.image img {
    max-width: 100%;
    display: inherit;
}
.style-detail-introduce-content-more {
    width: calc(100% - 32px);
    margin: 0 auto;
    display: flex;
    color: #A647E3;
    padding: 12px 16px;
    background-color: #fff;
    font-size: 1.6rem;
    text-transform: capitalize;
    min-width: 64px;
    box-sizing: border-box;
    line-height: 1.75;
    border-radius: 4px;
    border: 1px solid #A647E3;
    cursor: pointer;
    vertical-align: middle;
    justify-content: center;
    align-items: center;
    margin-bottom: 16px;
}
.style-detail-introduce-content-more svg {
    fill: currentColor;
    width: 1em;
    height: 1em;
    display: inline-block;
    font-size: 2.4rem;
    transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    flex-shrink: 0;
    user-select: none;
}
.style-detail-introduce-content-more svg path {
    fill: #A647E3;
}
.style-detail-rating {
    margin: 2px 4px 3px 0;
    display: flex;
    color: #ffb400;
    gap:1px;
}
.style-detail-rating svg {
    top: 0;
    width: 11px;
    height: 11px;
    position: relative;
    fill: #ffb400;
    display: inline-block;
    font-size: 2.4rem;
    transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    flex-shrink: 0;
    user-select: none;
    color: #ffb400;
}

.style-detail-rating small{
    position: relative;
    line-height: 1;
    margin-left:3px;
    margin-top:-0.5px;
    color:#2A2A2A;
    font-weight: 600;
    font-size:13px;
}
.style-detail-ctaArea {
    display: flex;
    align-items: center;
    gap: 8px;
}
.style-detail-ctaArea-util {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: -8px;
}
.style-detail-ctaArea-util button {
    width: 42px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    font-size: 11px;
}
.style-detail-ctaArea-util button svg {
    width: auto;
    height: 24px;
}
.style-detail-cta {
    width: 100%;
    display: flex;
    gap: 8px;
}
.style-detail-cta button {
    position: relative;
}
.style-detail-cta svg {
    width: auto;
    height: 18px;
}
.style-detail-cta .style-lottiePlayer {
    width: 18px;
    height: 18px;
}
.style-detail-cta .style-detail-ctaButton-addOn {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 9px;
    display: flex;
    align-items: center;
    gap: 2px;
    padding: 5px 6px;
    border: 1px solid var(--color-common-white);
    border-radius: 24px;
}
.style-detail-cta .style-detail-ctaButton-addOn svg {
    width: auto;
    height: 10px;
}
.style-detail-cta .style-detail-ctaButton-addOn svg path {
    fill: var(--color-common-white);
}
.wishHeartButton svg path {
    fill: #787878;
}
.wishHeartButton.on svg path {
    fill: rgb(255,81,82);
}
.style-detail-optionArea {
    left: 0;
    width: 100%;
    bottom: 0;
    height: auto;
    position: absolute;
    transform: translate(0px, 100%);
}
.style-detail-optionArea.open {
    transform: translate(0px, 0%);
}
.style-detail-optionArea:before {
    top: -20px;
    left: 0;
    width: 100%;
    height: 60px;
    content: "";
    position: absolute;
    background: linear-gradient(360deg,rgba(0, 0, 0, 0.1) 50%,rgba(255, 255, 255, 0) 100%);
    display: none;
}
.style-detail-optionArea.open:before {
    display: block;
}
.style-detail-optionArea-inner {
    height: 100%;
    padding: 0 20px;
    z-index: 1;
    position: relative;
    background: white;
    border-radius: 16px 16px 0px 0px;
    padding-bottom: env(safe-area-inset-bottom);
}
.style-detail-optionArea-close {
    width: 100%;
    height: 32px;
    display: block;
    background: url("../img/icon/ic_sheetBottomButton.png") no-repeat center;
    background-size: 38px 8px;
}
.style-detail-optionArea-form {
    display: -moz-box;
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    grid-gap: 12px;
    gap: 12px;
    padding-bottom: 12px;
}
.style-detail-optionArea-form .optionArea-form {
    display: -moz-box;
    display: flex;
    width: 100%;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    flex-direction: column;
}
.style-detail-optionArea-form .optionArea-form.disabled {
    opacity: 0.38;
}
.style-detail-optionArea-form .style-form-input {
    height: 38px;
    font-weight: 400;
    padding: 0 16px !important;
    font-size: 1.5rem !important;
}
.style-detail-optionArea-form .style-form-input:focus {
    border-color: var(--color-gray-400);
}
.optionArea-accordion {
    display: -moz-box;
    display: flex;
    width: 100%;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    flex-direction: column;
    top: 0;
    left: 0;
    border: 1px solid var(--color-gray-400);
    z-index: 0;
    overflow: hidden;
    position: relative;
    box-shadow: none;
    box-sizing: border-box;
    border-radius: 6px;
}
.optionArea-accordion.disabled {
    opacity: 0.38;
}
.optionArea-accordion-button {
    height: 38px;
    font-weight: 400;
    padding: 0 16px !important;
    display: flex;
    width: 100%;
    color: var(--bs-body-color);
    text-align: left;
    position: relative;
}
.optionArea-accordion-button-text {
    font-size: 1.5rem !important;
    line-height: 1.5;
    display: flex;
    height: 38px;
    align-items: center;
}
.optionArea-accordion-button svg {
    top: 50%;
    right: 16px;
    width: 12px;
    height: 12px;
    position: absolute;
    margin-top: -6px;
    line-height: 1;
    transition: all 300ms ease 0s
}
.optionArea-accordion-button.active svg {
    transform: rotate(180deg);
    transition: all 300ms ease 0s;
}
.optionArea-accordion-collapse {
    display: flex;
}
.optionArea-accordion-hidden {
    display: none;
}
.optionArea-accordion-wrapperInner {
    width: 100%;
}
.optionArea-accordion-details {
    margin: 0;
    display: block;
    padding: 0;
    overflow: auto;
    box-sizing: border-box;
    max-height: 144px;
}
.accordion-details-button {
    width: 100%;
    cursor: pointer;
    display: block;
    outline: none;
    padding: 8px 20px;
    overflow: hidden;
    background: white;
    box-sizing: border-box;
    min-height: 36px;
}
.optionArea-products {
    gap: 12px;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    white-space: nowrap;
}
.optionArea-products-inner {
    width: 100%;
    display: flex;
    padding: 12px;
    position: relative;
    border-radius: 8px;
    flex-direction: column;
    justify-content: space-between;
    background-color: #f4f4f5;
}
.optionArea-products-top {
    width: calc(100% - 24px);
    font-size: 15px;
    text-align: left;
    margin-left: 0;
    padding-bottom: 8px;
}
.optionArea-products-text {
    margin: 0;
    display: inline-block;
    padding: 0;
    word-break: break-all;
    white-space: pre-wrap;
}
.optionArea-products-del {
    top: 0;
    right: 0;
    display: block;
    padding: 12px;
    position: absolute;
}
.optionArea-products-del svg {
    width: 14px;
    cursor: pointer;
    height: 14px;
    display: block;
}
.optionArea-products-del svg path {
    stroke: #c4c4c6;
}
.optionArea-products-bottom {
    width: 100%;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
}
.optionArea-products-restrictions {
    color: #a4a4a4;
    font-size: 1.2rem;
    margin-bottom: 8px;
}
.optionArea-products-quantity {
    width: auto;
    margin: auto 0;
    display: inline-flex;
    overflow: hidden;
    align-items: center;
    flex-shrink: 0;
    border-radius: 4px;
}
.products-quantity-button {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    flex: 0 0 auto;
    color: inherit;
    padding: 12px;
    overflow: visible;
    font-size: 2.4rem;
    background: #fff;
}
.products-quantity-button.disabled{
    background: #fcfcfc;
    border-radius: 50%;
}
.products-quantity-label {
    width: 100%;
    display: flex;
    align-items: inherit;
    justify-content: inherit;
}
.products-quantity-button svg {
    width: 14px;
    height: 14px;
}
.products-quantity-button svg path {
    fill: #454545;
}
.products-quantity-opt {
    color: #232323;
    width: 40px;
    margin: 0 6px;
    font-size: 2rem;
    font-family: HGHaeDotum,sans-serif;
    height: 28px;
    display: flex;
    box-sizing: border-box;
    text-align: center;
    align-items: center;
    justify-content: center;
}
.products-quantity-opt input {
    text-align: center;
    -webkit-appearance: none;
    font: inherit;
    color: currentColor;
    width: 100%;
    border: 0;
    height: 1.1876em;
    margin: 0;
    display: block;
    padding: 6px 0 7px;
    min-width: 0;
    background: none;
    box-sizing: content-box;
    animation-name: mui-auto-fill-cancel;
    letter-spacing: inherit;
    animation-duration: 10ms;
    -webkit-tap-highlight-color: transparent;
}
.products-quantity-price {
    display: flex;
}
.products-quantity-price .price {
    color: #8a8a8e;
    height: 28px;
    display: flex;
    font-size: 1.5rem;
    align-items: center;
    font-weight: 600;
    justify-content: flex-end;
}
.style-detail-optionArea-gift {
    border-radius: 8px;
    border: 1px solid #EBD7FA;
    background: #FCF8FF;
    font-size: 14px;
    color: #6A1CA1;
    width: 100%;
    display: flex;
    justify-content: space-between;
    padding:  10px 12px;
    font-weight: 500;
    gap:8px;
}

.style-detail-optionArea-gift span {
    flex: 1;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    text-align: left;
}

.style-detail-optionArea-totalPrice {
    width: 100%;
    padding: 0 0 12px 0;
    position: relative;
}
.style-detail-optionArea-totalPrice:before {
    width: calc(100% + 40px);
    height: 1px;
    content: "";
    display: block;
    position: relative;
    margin-left: -20px;
    background-color: #F0F0F0;
}
.style-detail-optionArea-totalPrice .totalOrderPrice {
    padding: 12px 4px 8px;
    margin-bottom: 6px;
    display: flex;
    font-size: 1.4rem;
    align-items: center;
    font-weight: 400;
    line-height: 1.5;
    justify-content: space-between;
}
.style-detail-optionArea-totalPrice .price {
    font-size: 1.7rem;
    font-weight: 600;
    letter-spacing: -0.034em;
}
.style-detail-optionArea-totalPrice .totalOrderCart {
    width: 100%;
    display: flex;
    align-items: center;
    flex-direction: row;
    gap: 5px;
}
.style-detail-orderCart {
    width: -moz-calc(100% - 40px);
    width: calc(100% - 40px);
    display: -moz-box;
    display: flex;
    -moz-box-pack: justify;
    justify-content: space-between;
    margin: 0 0 20px 20px;
    padding: 0 0 12px;
    border-bottom: 1px solid #f0f0f0;
}
.style-detail-orderCart-info {
    display: -moz-box;
    display: flex;
    -moz-box-pack: start;
    justify-content: flex-start;
    -moz-box-align: center;
    align-items: center;
}
.style-detail-orderCart-info img {
    width: 48px;
    height: 48px;
    overflow: hidden;
    border-radius: 8px;
    margin: auto;
    display: block;
    max-width: 100%;
}
.style-detail-orderCart-info p {
    margin: 0;
    padding: 0 0 0 12px;
    font-size:15px;
    font-weight: 500;
}
.style-detail-orderCart-more {
    color: #0060d1;
    padding: 6px 8px;
    font-size: 1.4rem;
    display: -moz-box;
    display: flex;
    -moz-box-pack: start;
    justify-content: flex-start;
    -moz-box-align: center;
    align-items: center;
}
.style-detail-incoming{
    padding: 0 16px 16px;
}
.style-detail-incoming  .style-form-label {
    margin-bottom: 5px;
}
.style-detail-incoming  .style-form-input {
    margin-bottom: 5px;
}
.style-detail-incoming  .style-form-input:focus {
    border-color: var(--color-mainColor);
}
.style-detail-incoming .style-button {
    margin-top: 20px;
}
.style-modal-gift {
    display: flex;
    flex-direction: column;
    padding: 16px 20px;
}
.style-modal-giftList-top {
    display: flex;
    flex-direction: column;
    margin-bottom: 20px;
}
.style-modal-giftList-top h3 {
    font-size: 20px;
    color: #000;
    font-weight: 600;
}
.style-modal-giftList-top span {
    font-size: 14px;
    color: #646464;
    font-weight: 400;
}
.style-modal-giftList {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    box-sizing: border-box;
}
.style-modal-giftList .item {
    padding: 0 0 16px;
    flex-grow: 0;
    max-width: calc(50% - 8px);
    flex-basis: calc(50% - 8px);
}
.style-modal-giftList .item:nth-child(odd) {
    margin-right: 16px;
}
.style-modal-giftList .style-form-check {
    padding-left: 0;
}
.style-modal-giftList .style-form-check-input {
    margin: 0;
}
.style-modal-giftList .style-form-check-label {
    line-height: 140%;
}
.style-modal-giftList .style-giftList-thumbnail {
    display: flex;
    position: relative;
    background: url(../img/placeholder-img.svg) no-repeat 50% 50%;
    background-size: cover;
    overflow: hidden;
    margin-bottom: auto;
    flex-direction: column;
    margin: 8px 0;
    box-sizing: border-box;
}
.style-modal-giftList .style-giftList-thumbnail img {
    width: 100%;
    height: auto;
    position: relative;
    transition: all 0.4s ease;
    z-index: 1;
}
.style-modal-giftList .giftList-title {
    font-size: 13px;
    color: #000;
}
.style-modal-giftList .giftList-price {
    font-size: 13px;
    color: #848BA0;
    /*color:#A647E3;*/
}
.style-modal-giftList .style-form-check .style-form-check-input:checked[type='checkbox'] {
    background-image: url(../img/icon/icon_checkbox_on_p.svg);
}
.style-modal-giftList .style-form-check .style-form-check-input:checked[type='checkbox'] + label .style-giftList-thumbnail {
    border: 1px solid #A647E3;
}
.style-modal-giftList .style-form-check .style-form-check-input:checked[type='checkbox'] + label .giftList-title {
    color: #A647E3;
    font-weight: 600;
}
.style-modal-giftList .style-form-check .style-form-check-input:checked[type='checkbox'] + label .giftList-price {
    color: #A647E3;
}
/* 종료: 상세페이지 */

/* 시작: 구매후기*/
.style-review {
    width: 100%;
    margin: 0 auto;
    /*overflow: hidden;*/
    box-sizing: border-box;
}
.section-line {
    width: 100%;
    background: #F2F3F5;
    height: 10px;
}
.style-review-header {
    padding: 16px 16px 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.style-review-header h3{
    font-size: 17px;
    color: #000;
    font-weight: 700;
}
.style-review-header .review-header-more {
    font-size: 14px;
    color: #8D8D8D;
}
.style-review-best-slide {
    padding: 16px 0 26px;
}
#bestSwiper swiper-slide {
    width: calc(100% - 32px); /* 양쪽 16px씩 보이게 */
    min-width: 320px;
    flex-shrink: 0;
}
.style-bestSwiper-link {
    padding: 16px 20px;
    border: 1px solid #E3E3E3;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
}
.style-bestSwiper-top {
    width: 100%;
    display: flex;
    font-size: 1.4rem;
    flex-basis: 100%;
    align-items: center;
    flex-shrink: 0;
    margin-bottom: 4px;
    justify-content: flex-start;
}
.style-bestSwiper-profile {
    width: 42px;
    border: 1px solid #F0F0F0;
    height: 42px;
    display: block;
    overflow: hidden;
    position: relative;
    margin-right: 8px;
    border-radius: 50%;
}
.style-bestSwiper-profile img {
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    bottom: 0;
    height: 100%;
    position: absolute;
    object-fit: cover;
    background-color: #F6EEFA;
}
.style-bestSwiper-info {
    flex: 1;
    color: #787878;
    font-size: 1.2rem;
    font-weight: 500;
    display: flex;
    justify-content: space-between;
}
.style-bestSwiper-info-name {
    width: 100%;
    display: flex;
    flex-direction: column;
}
.style-bestSwiper-info-name .name {
    font-weight: 600;
    font-size: 14px;
    color: #000;
}
.style-bestSwiper-info-name .date {
    font-weight: 400;
    font-size: 12px;
    color: #8D8D8D;
}
.style-bestSwiper-rating {
    display: flex;
    padding: 8px 0;
    gap: 2px;
    font-weight: 600;
    color: #7A7E85;
    font-size: 13px;
}
.style-bestSwiper-rating .bestSwiper-rating {
    display: flex;
    gap: 2px;
}
.style-bestSwiper-rating .bestSwiper-rating svg {
    width: 14px;
    height: 14px;
    top: 0;
    position: relative;
    fill: #ffb400;
    display: inline-block;
    font-size: 2.4rem;
    transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    flex-shrink: 0;
    user-select: none;
    color: #ffb400;
}
.style-bestSwiper-contents {
    display: flex;
    justify-content: space-between;
    padding-right: 93px;
    position: relative;
}
.style-bestSwiper-text {
    display: flex;
    font-size: 16px;
    color: #393A40;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
}
.style-bestSwiper-photo {
    width: 85px;
    height: 85px;
    position: absolute;
    right: 0;
    top: 0;
    border-radius: 4px;
    overflow: hidden;
}
.style-bestSwiper-photo .thumbnail-photo {
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
    position: relative;
}
.style-bestSwiper-photo .thumbnail-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: hidden;
    position: absolute;
}
.style-bestSwiper-photo .thumbnail-count {
    color: white;
    right: 0;
    width: 28px;
    bottom: 0;
    height: 28px;
    display: flex;
    position: absolute;
    align-items: center;
    justify-content: center;
    background-color: rgba(0,0,0,0.5);
    border-top-left-radius: 4px;
}
.review-ratingArea {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px;
    gap: 16px;
    border-top: 1px solid #F0F0F0;
}
.review-rating-inner {
    width: 40%;
    /*width: 146px;*/
    flex-shrink: 0;
    justify-content: center;
    display: flex;
    flex-direction: column;
}
.review-rating-title {
    margin: 0;
    font-size: 1.4rem;
    font-weight: 500;
}
.review-rating-counts {
    color: rgba(60, 60, 67, 0.6);
    font-size: 1.4rem;
    font-weight: 400;
    justify-content: center;
    display: flex;
}
.review-rating-counts strong {
    color: #000000;
    font-size: 49px;
    font-weight: 700;
    line-height: 1;
    margin-right: 6px;
}
.review-rating-counts span {

}
.review-ratingBox {
    display: flex;
    padding: 0;
    align-items: center;
    justify-content: center;
}
.review-ratingBox .review-rating {
    display: inline-flex;
    position: relative;
    text-align: left;
    gap: 1px;
}

.review-ratingBox .review-rating span {
    position: relative;
    line-height: 1;
    display: inline-flex;
    align-items: center;
}

.review-ratingBox .review-rating svg {
    width: 14px;
    height: 14px;
}
.review-ratingBox .review-rating svg path {
    fill: #FFBF48;
}
.review-rating-text {
    padding-top: 8px;
    font-size: 12px;
    color: #949494;
    gap: 3px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.review-progress {
    width: 60%;
    /*width: calc(100% - 146px);*/
    font-size: 1.2rem;
}
.review-progress-inner {
    margin: 2px 0;
    display: flex;
    align-items: center;
}
.review-progress-button {
    width: 100%;
    padding: 0;
}
.review-progress-label {
    width: 100%;
    display: inherit;
    align-items: inherit;
    justify-content: inherit;
}
.review-progress-text {
    color: #454545;
    width: 30px;
    margin: 0;
    padding: 0;
    min-width: 0;
    flex-basis: 30px;
    flex-shrink: 0;
    font-weight: 400;
}
.review-progressBar {
    width: 100%;
}
.progress-root {
    height: 8px;
    border-radius: 8px;
    background-color: #EEEEEF;
    overflow: hidden;
    position: relative;
}
.Progress-bar {
    top: 0;
    left: 0;
    width: 0;
    bottom: 0;
    position: absolute;
    border-radius: 6px;
    transform-origin: left;
    background: #999;
    -webkit-transition: 2s width cubic-bezier(0.6, 0.4, 0.4, 1.1);
    transition: 2s width cubic-bezier(0.6, 0.4, 0.4, 1.1);
}
.review-progress-num {
    color: rgba(60, 60, 67, 0.60);
    width: 40px;
    flex-basis: 40px;
    text-align: right;
    flex-shrink: 0;
    font-weight: 500;
}
.review-progress-button.active .Progress-bar {
    background: #999;
}
/*.review-progress-button.active .review-progress-text {
    font-weight: 600;
}*/
.review-progress-button.active .review-progress-text {
    font-weight: 600;
}
.style-detail-reviewRating {
    display: flex;
    padding: 16px;
    font-size: 1.6rem;
    align-items: center;
    font-weight: 500;
}
.style-detail-reviewRating .style-detail-rating {
    height: auto;
}
.style-detail-reviewRating .style-detail-rating svg {
    width: 24px;
    height: 24px;
}
.style-detail-reviewRating strong {
    color: #000000;
    font-size: 2rem;
    margin-right: 5px;
}
.style-detail-reviewRating .style-detail-txt {
    color: rgba(60, 60, 67, 0.6);

}
.style-reviewThumbnail {
    display: flex;
    overflow: hidden;
    flex-wrap: wrap;
    justify-content: space-around;
    padding: 6px 16px 30px;
    border-bottom: 1px solid #F0F0F0;
}
.style-reviewThumbnail.onlyImages {
    padding: 0;
    border-bottom: none;
}
.style-reviewThumbnail ul {
    margin: -2.5px;
    width: 100%;
    height: auto;
    display: flex;
    padding: 0;
    flex-wrap: wrap;
    list-style: none;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}
.style-reviewThumbnail.onlyImages {
    margin: -3px;
}
.style-reviewThumbnail li {
    box-sizing: border-box;
    flex-shrink: 0;
    width: 25%;
    height: auto;
    padding: 2.5px;
}
.style-reviewThumbnail.onlyImages li {
    width: 33.33%;
}
.style-reviewThumbnail li .thumbnail {
    width: 100%;
    overflow: hidden;
    height: 100%;
    display: block;
    position: relative;
    border-radius: 4px;
}
.style-reviewThumbnail.onlyImages li .thumbnail {
    border-radius: 0;
}
.style-reviewThumbnail li .thumbnail:before {
    content: "";
    display: block;
    padding-top: 130%;
}
.style-reviewThumbnail li .thumbnail a {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    position: absolute;
    display: inline-block;
}
.style-reviewThumbnail li .thumbnail-photo {
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
    position: relative;
}
.style-reviewThumbnail li .thumbnail-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: hidden;
    position: absolute;
}
.style-reviewThumbnail li .thumbnail-count {
    color: white;
    right: 0;
    width: 28px;
    bottom: 0;
    height: 28px;
    display: flex;
    position: absolute;
    align-items: center;
    justify-content: center;
    background-color: rgba(0,0,0,0.5);
    border-top-left-radius: 4px;
}
.style-reviewThumbnail .review-more {
    top: 0;
    left: 0;
    color: white;
    right: 0;
    bottom: 0;
    display: flex;
    position: absolute;
    text-align: center;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.70);
    font-size: 1.4rem;
    flex-direction: column;
}
.style-reviewThumbnail .review-more strong {
    font-size: 15px;
    font-weight: 600;
    display: flex;
}
.style-reviewThumbnail .review-more span {
    font-size: 15px;
    font-weight: 600;
    display: flex;
}
.style-review-filter {
    width: 100%;
    display: flex;
    padding: 12px 16px;
    /*position: relative;*/
    font-size: 1.4rem;
    box-sizing: border-box;
    align-items: start;
    border-bottom: 1px solid #F0F0F0;
    justify-content: space-between;
    background-color: #fff;
    flex-direction: column;

}
.switch-li {
    display: flex;
    gap: 12px;
}
.switch-li li {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 14px;
    color: #000;
}
.switch-li .style-form-switch {
    height: 22px;
    width: 38px;
}
.switch-li .style-form-switch .form-check-input:checked {
    border-color: #4377FD;
    background-color: #4377FD;
}
.style-review-filter #petListSwiper {
    margin-top: 12px;
    margin-left:0;
}
.style-review-filter swiper-slide {
    /*width: calc(50% - 6px);*/
    width: auto;
}
.style-review-filter .style-mypet-link {
    width: 100%;
    display: flex;
    height: 38px;
    background-color: #fff;
    justify-content: center;
    align-items: center;
    padding: 4px 13px 4px 6px;
    box-sizing: border-box;
    border-radius: 38px;
    border: 1px solid #E3E3E3;
    color: #454545;
    font-size: 14px;
    font-weight: 500;
}
.style-review-filter .style-mypet-link.last {
    padding: 4px 13px;
}
.style-review-filter .style-mypet-link.active {
    background-color: #F6F6F6;
    font-weight: 600;
    color: #000;
}
.style-review-filter .style-mypet-name {
    display: flex;
    align-items: center;
    gap: 6px;
    width: 100%;
}
.style-review-filter .style-mypet-name img {
    width: auto;
    height: 30px;
}
.style-review-filter .style-mypet-name-image {
    width: 30px;
    height: 30px;
    /*border: 1px solid var(--color-gray-400);*/
    overflow: hidden;
    border-radius: 50%;
    position: relative;
}
.style-review-filter .style-mypet-name-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    background-color: #fff;
    /*background-color: #F6EEFA;*/
}
.style-review-filter .style-mypet-link.active .style-mypet-name-image img {
    background-color: #fff;
}
.style-review-filter-btn {
    display: flex;
    align-items: center;
}
.review-filter-button {
    padding: 6px 8px;
}
.review-filter-button span {
    width: 100%;
    display: inherit;
    align-items: inherit;
    justify-content: inherit;
}
.review-filter-button-active {
    color: #A647E3;
}
.review-filter-line {
    width: 1px;
    height: 10px;
    display: inline-block;
    background: #c4c4c6;
}
.review-filter-pet {
    font-size: 1.5rem;
    color: #A647E3;
    border: 0 none;
    background-color: #F6EEFA;
    padding: 2px 14px;
    border-radius: 4px;
    box-shadow: none !important;
    border-color: #dcdcdd;
    text-transform: capitalize;
    line-height: 1.8;
}
.review-filter-label {
    width: 100%;
    display: inherit;
    align-items: inherit;
    justify-content: inherit;
}
.review-filter-label svg {
    width: 18px;
    height: 18px;
    margin-right: 2px;
}
.review-filter-label path {
    fill: #A647E3;
}
.style-review-total {
    width: 100%;
    height: 41px;
    display: flex;
    padding: 0px 16px;
    position: relative;
    font-size: 1.4rem;
    box-sizing: border-box;
    align-items: center;
    border-bottom: 1px solid #cfcfd0;
    justify-content: space-between;
    background-color: #fff;
}
.style-chip-buttonBox {
    position: sticky;
    top: 45px;
    display: flex;
    gap: 6px;
    padding: 12px 16px;
    background: #FFF;
    border-bottom: 1px solid #F0F0F0;
    /* position: relative; */
    z-index: 100;
}
.style-chip-asbox {
    position: absolute;
    top: 54px;
    left: 16px;
    padding: 14px 18px;
    border-radius: 6px;
    border: 1px solid #A1A1A1;
    background: #FFF;
    z-index: 10;
    display: none;
}
.style-chip-asbox.open {
    display: block;
}
.style-chip-asbox ul {
    gap: 15px;
    display: flex;
    flex-direction: column;
}
.style-chip-asbox button {
    color: #4D5159;
    font-size: 14px;
}
.style-chip-asbox button.active {
    color: #212124;
    font-weight: 700;
}
.tooltipBox {
    position: absolute;
    bottom: 20px;
    left: -11px;
    padding: 8px 11px;
    background: #3A6EFF;
    color: #fff;
    font-size: 12px;
    width: 220px;
    border-radius: 4px;
    text-align: left;
    z-index: 10;
    display: none;
}
.tooltipBox.open {
    display: block;
}
.tooltipBox:after {
    position: absolute;
    width: 0;
    height: 0;
    left: 10px;
    bottom: -5px;
    overflow: hidden;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-top: 8px solid #3A6EFF;
    content: "";
}
.style-reviewList {

}
.reviewList-item {
    width: 100%;
    padding: 16px 16px;
    position: relative;
    box-sizing: border-box;
    border-bottom: 1px solid #F0F0F0;
}
.reviewList-item-top {
    width: 100%;
    height: 46px;
    display: flex;
    font-size: 1.4rem;
    flex-basis: 100%;
    align-items: center;
    flex-shrink: 0;
    margin-bottom: 6px;
    justify-content: flex-start;
}
.reviewList-item-profile {
    width: 36px;
    border: 1px solid #F0F0F0;
    height: 36px;
    display: block;
    overflow: hidden;
    position: relative;
    margin-right: 5px;
    border-radius: 50%;
}
.reviewList-item-profile img {
    top: 0;
    left: 0;
    right: 0;
    width: 36px;
    bottom: 0;
    height: 36px;
    position: absolute;
    object-fit: cover;
    background-color: #F6EEFA;
}
.reviewList-item-info {
    flex: 1;
    color: #787878;
    font-size: 1.2rem;
    font-weight: 500;
    display: flex;
    justify-content: space-between;
}
.reviewList-item-info-name {
    width: 100%;
    display: flex;
    flex-direction: column;
    margin-top:5px;
}
.reviewList-item-info-name .name {
    font-weight: 600;
    font-size: 13px;
    color: #212124;

}

.reviewList-item-info-name .name small{
    font-size: 13px;
    font-weight: 300;
    color: #7A7E85;
    margin-left:2px;
}

.reviewList-item-info-name .date {
    font-weight: 400;
    font-size: 12px;
    color: #8D8D8D;
    margin-top:3px;
}
.reviewList-item-actionButton {
    margin-left: auto;
}
.reviewList-item-actionButton svg {
    width: auto;
    height: 24px;
}
.reviewList-item-info-rating {
    display: flex;
    padding: 2px 0;
    gap: 2px;
    font-weight: 600;
    color: #7A7E85;
    font-size: 13px;
}
.reviewList-item-info-rating .style-detail-rating {
    display: flex;
    gap: 2px;
}
.reviewList-item-info-rating .style-detail-rating svg {
    width: 14px;
    height: 14px;
}
.reviewList-item-info-text {
    padding: 2px 0;
    color: #2A2A2A;
    font-size: 13px;
    flex: 1;
    word-break: break-word;
    line-height: 1.45;
}
.reviewList-item-info-text span {
    display: inline-flex;
    position: relative;
    margin-right: 12px;
}
.reviewList-item-info-text span:before {
    position: absolute;
    top: 50%;
    right: -10px;
    width: 3px;
    height: 3px;
    margin-top: -1.5px;
    border-radius: 50%;
    background: #ADB1BA;
    content: "";
}
.reviewList-item-info-text span:last-child {
    margin-right: 0;
}
.reviewList-item-info-text span:last-child:before {
    display: none;
}
.reviewList-item-info-top .style-detail-rating {
    flex: 1;
    margin-right: 3px;
}
.reviewList-item-info-top .style-detail-rating svg {
    width: 16px;
    height: 16px;
}
.reviewList-item-experience {
    padding: 12px 0 2px 0;
    color:#666666;
    font-size:13px;
    font-weight: 400;
}

.reviewList-item-experience svg{
    position: relative;
    vertical-align: middle;
    margin-top:-3px;
}

.reviewList-item-experience .experience-badge {
    height: 22px;
    padding: 4px 8px;
    font-size: 1rem;
    line-height: 1;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    font-weight: 500;
    justify-content: center;
    background-color: #A647E3;
    color: #fff;
    margin: 0;
    position: relative;
}
.reviewList-item-option {
    padding: 0 0;
    color: #8A8A8A;
    font-size: 13px;
    display: flex;
    align-items: flex-start;
    margin-top:-3px;
}

.reviewList-item-option .title {
    position: relative;
    display: inline-block;
    padding: 0 0;
    color: #8A8A8A;
    font-size: 13px;
    margin-right:3px;
    width:45px;
    flex-shrink: 0;
    margin-top:2px;
    line-height: 1.4;
}

.style-reviewItem-content-box {
    background:#F2F3F6;
    border-radius:4px;
    min-height: 34px;
    font-size:13px;

    font-weight: 500;
    color:#2A2A2A;
    letter-spacing: -0.009em;
    padding:11px 14px 7px 13px;
    /*margin-top:4px;*/
    /*margin-top:-1px;*/


}

.reviewList-item-cont {
    /*margin-left: 50px;*/
    padding-top: 10px;
}
.reviewList-item-cont-inner {
    flex-direction: column-reverse;
    display: flex;
    margin-top: 6px;
}
.reviewList-item-thumbnailBox {
    margin-bottom: 11px;
    display: flex;
    position: relative;
    flex-wrap: wrap;
    justify-content: space-between;
    border-radius: 8px;
    overflow: hidden;
    margin-top:15px;
}
.reviewList-item-thumbnailBox.lay_photo_list {
    border-radius: 0;
}
.reviewList-item-thumbnail {
    width: calc(50% - 3px);
    margin: 0 3px 0;
    overflow: hidden;
    position: relative;
    flex-grow: 0;
    flex-basis: calc(50% - 3px);
    flex-shrink: 0;
    /*max-height: 228px;*/
}
.onlyImages .reviewList-item-thumbnail {
    max-height: 100%;
}
.reviewList-item-thumbnail:nth-child(odd) {
    margin-left: 0;
}
.reviewList-item-thumbnail:nth-child(2) {
    width: calc(50% - 3px);
    margin: 0 0 0 3px;
    flex-basis: calc(50% - 3px);
}
.reviewList-item-thumbnail:after {
    content: "";
    display: block;
    padding-top: 100%;
}
.reviewList-item-thumbnail.full {
    width: 100%;
    margin: 0;
    flex-basis: 100%;
}
.reviewList-item-thumbnail.fullsize-img {
    max-height: 100%;
    margin: 3px 0 !important;
    width: 100%;
    flex-basis: 100%;
    border-radius: 8px;
}
.reviewList-item-thumbnail.fullsize-img button {
    position: relative;
}
.reviewList-item-thumbnail.fullsize-img .reviewList-item-thumbnail-photo {
    position: relative;
}
.reviewList-item-thumbnail.fullsize-img .reviewList-item-thumbnail-photo img {
    position: relative;
}
.reviewList-item-thumbnail.fullsize-img:after {
    display: none !important;
}
.reviewList-item-thumbnail button {
    top: 0;
    left: 0;
    position: absolute;
    width: 100%;
    height: 100%;
    display: inline-block;
}
.reviewList-item-thumbnail-photo {
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    position: absolute;
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
}
.reviewList-item-thumbnail-photo img {
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    bottom: 0;
    height: 100%;
    overflow: hidden;
    position: absolute;
    object-fit: cover;
    margin: auto;
    display: block;
    max-width: 100%;
}
.reviewList-item-thumbnail .thumbnail-count {
    display: flex;
    color: white;
    right: 0;
    width: 28px;
    bottom: 0;
    height: 28px;
    position: absolute;
    align-items: center;
    justify-content: center;
    background-color: rgba(0,0,0,0.5);
}
.reviewList-item-thumbnail-more {
    display: flex;
    color: white;
    right: 10px;
    width: 28px;
    bottom: 10px;
    height: 28px;
    position: absolute;
    align-items: center;
    justify-content: center;
    background-color: rgba(0,0,0,0.2);
    border-radius: 4px;
    z-index: 5;
}
.reviewList-item-thumbnail-more svg {
    width: 11px;
    height: 11px;
}
.reviewList-item-thumbnail-count {
    top: 0;
    left: 0;
    color: white;
    right: 0;
    bottom: 0;
    font-size: 3.5rem;
    display: flex;
    position: absolute;
    text-align: center;
    align-items: center;
    justify-content: center;
    background-color: rgba(0,0,0,0.3);
    z-index: 2;
}
.reviewList-item-cont-textBox {
    padding: 0 0;
}
.reviewList-item-cont-title {
    font-size: 1.6rem;
    margin-top: 0;
    font-weight: 500;
    margin-bottom: 8px;
}
.reviewList-item-cont-text {
    font-size: 16px;
    color: #393A40;
    line-height: 1.4;
}
.reviewList-item-cont-text .text-more {
    color: #868B94;
}
.reviewList-item-buttonBox {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top:20px;
}
.reviewList-item-help {
    color: #A1A1A1;
    background-color: #fff;
    height: 29px;
    padding: 0 12px;
    font-size: 1.4rem;
    min-width: 0;
    box-shadow: none;
    font-weight: 500;
    text-transform: capitalize;
    border: 1px solid #C0C0C0;
    border-radius: 4px;
    min-width: 136px;
}
.reviewList-item-help span {
    width: 100%;
    display: inherit;
    align-items: inherit;
    justify-content: inherit;
    font-weight: normal;
}
.reviewList-item-help svg {
    width: 16px;
    height: 16px;
    margin-right: 6px;
}
.reviewList-item-help svg path {
    fill: #A1A1A1;
}
.reviewList-item-help.active {
    color: #A647E3;
    border: 1px solid #A647E3;
}
.reviewList-item-help.active svg path {
    fill: #A647E3;
}
.reviewList-item-util {
    display: flex;
    align-items: center;
    gap: 16px;
}
.reviewList-item-util button {
    font-size: 14px;
    font-weight: 700;
    gap: 4px;
    line-height: 1;
}
.reviewList-item-util button:last-of-type {
    margin-left: auto;
}
.reviewList-item-util .style-reviewItem-util button {
    margin-left: inherit;
}
.reviewList-item-util svg {
    width: auto;
    height: 24px;
}
.reviewList-item-util .style-like-active path {
    stroke: var(--color-primary-600);
    fill: var(--color-primary-600);
}
.reviewList-item-product {
    margin-top: 16px;
    border-radius: 8px;
    border: 1px solid #E3E3E3;
}
.reviewList-item-product-link {
    display: flex;
    padding: 8px 10px;
    justify-content: space-between;
    align-items: center;
}
.reviewList-item-product-link .inner {
    display: flex;
    gap: 6px;
    align-items: center;
}
.reviewList-item-product-link .reviewList-item-product-thumbnail {
    width: 40px;
    height: 40px;
    overflow: hidden;
    position: relative;
    flex-grow: 0;
    flex-basis: 40px;
    flex-shrink: 0;
    border-radius: 4px;
}
.reviewList-item-product-link .reviewList-item-product-thumbnail img {
    width: 40px;
    height: 40px;
    object-fit: cover;
}
.reviewList-item-product-link .reviewList-item-product-info {

}
.reviewList-item-product-title {
    color: #454545;
    font-size: 12px;
    font-weight: 500;
}
.reviewList-item-product-price {
    color: #000;
    font-size: 12px;
    font-weight: 600;
    gap: 4px;
    display: flex;
}
.reviewList-item-product-price .discount {
    color: #EA333E;
    font-size: 12px;
    font-weight: 600;
}
.reviewList-item-report {
    color: #787878;
    cursor: pointer;
}
.reviewList-item-bottom {
    padding: 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.reviewList-item-bottom .reviewList-item-more {
    background-color: #f4f4f5;
    padding: 13px 16px;
    font-size: 1.6rem;
    box-shadow: none !important;
    font-weight: 500;
    text-transform: capitalize;
    width: 100%;
    border-radius: 4px;
    text-align: center;
    color: #8a8a8e;
}
.style-detail-reportList {
    padding: 0 20px 20px;
}
.style-detail-reportList h2 {
    height: 44px;
    display: flex;
    font-size: 30px;
    line-height: 39px;
    margin-bottom: 20px;
}
.style-detail-reportList .form-check {
    margin: 0 0 20px;
    line-height: 150%;
}
.style-detail-reportList-close > div {
    width: 100%;
    padding: 6px 20px 20px;
    background-color: var(--color-common-white);
}
.style-reviewList .swiper-button-next, .style-reviewList .swiper-button-prev  {
    position: fixed;
    top: 50%;
    right: 0;
    background-color: rgba(0,0,0,0.2);
    transform: translate(0%, -50%)
}
.style-reviewList .swiper-button-next {
    right: 0;
}
.style-reviewList .swiper-button-prev {
    left: 0;
}
.style-reviewList .swiper-button-next:after, .style-reviewList .swiper-button-prev:after {
    font-size: 20px;
    color: #fff;
}
@media (min-width: 600px) {
    .style-reviewList .swiper-button-next {
        right: 50%;
        margin-right: -300px;
    }
    .style-reviewList .swiper-button-prev {
        left: 50%;
        margin-left: -300px;
    }
}
.review-filter-offcanvas-button {
    display: flex;
    padding: 13px 0;
    justify-content: center;
    width: 100%;
}
.review-filter-offcanvas-contents {
    padding: 0 20px;
}
.review-filter-offcanvas-title {
    display: flex;
    font-size: 18px;
    font-weight: 700;
    color: #121212;
    padding: 12px 0;
}
.review-filter-offcanvas-list {
    height: 315px;
    overflow-y: scroll;
    -ms-overflow-style: none;
}
.review-filter-offcanvas-list::-webkit-scrollbar{
    display:none;
}
.review-filter-offcanvas-list li {
    padding: 18px 0;
    border-bottom: 1px solid #F2F3F6;
}
.review-filter-offcanvas-list .style-form-check-label {
    font-size: 15px;
    color: #121212;
}
.review-filter-offcanvas-list .style-form-check-input:checked[type='checkbox'] {
    background-image: url(../img/icon/icon_check_bk_on.svg) !important;
}
.review-filter-offcanvas-list .style-form-check-input:checked[type='checkbox'] + label {
    font-weight: 700;
}
.review-filter-offcanvas-bottom {
    position: relative;
    background: #fff;
    margin-top: -1px;
    padding: 16px;
    display: flex;
    gap: 6px;
}
.review-filter-offcanvas-bottom:before {
    content: "";
    position: absolute;
    top: -16px;
    left: 0;
    height: 20px;
    width: 100%;
    display: block;
    opacity: 0.05;
    background: linear-gradient(359deg, #000 0.35%, rgba(0, 0, 0, 0.00) 98.99%);
    z-index: -1;
}
.review-filter-offcanvas-bottom .style-button-large {
    background: #7346F3;
    border: 1px solid #7346F3;
    width: 75%;
}
.review-filter-offcanvas-bottom .style-button-large.cancel {
    background: #fff;
    border: 1px solid #E3E3E3;
    color: #000;
    width: 25%;
}
/* 종료: 구매후기*/

/* 시작: 장바구니*/
.style-cart {
    width: 100%;
    margin: 0 auto;
    position: relative;
    max-width: 1200px;
    background-color: #f4f4f5;
    gap: 10px;
}
.style-cart-header {
    top: 50px;
    left: 0;
    padding: 12px 16px;
    z-index: 1000;
    position: sticky;
    min-height: 52px;
    background-color: #fff;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.style-cart-header .style-form-check {
    padding: 0;
    font-size: 1.4rem;
}
.style-cart-header .form-check-input {
    margin-left: 0 !important;
}
.style-cart-header .style-cart-delAll {
    color: #000;
    height: 28px;
    padding: 0 10px;
    line-height: 1.5;
    background-color: #F6F6F6;
    border: 0 none;
    border-radius: 4px;
}
.style-cart-article {
    background: #fff;
    margin-top: 10px;
}
.style-cart-article-topTxt-wrap {
    padding: 0 16px;
    background: #fff;
    margin: 0 0 -10px;
}
.style-cart-article-topTxt {
    background: #fff0ec;
    color: #000;
    padding: 12px 16px;
    border-radius: 8px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.style-cart-article-topTxt svg {
    width: 12px;
}
.style-cart-article-topTxt strong {
    color: #ff4713;
}
.style-cart-article-header {
    cursor: default;
    width: 100%;
    display: flex;
    padding: 16px 16px 0 16px;
    align-items: center;
    justify-content: space-between;
}
.style-cart-article-header h3 {
    margin: 0;
    font-size: 1.8rem;
    font-weight: 700;
}
.style-cart-itemList {
    padding: 0 16px;
}
.style-cart-item {
    display: flex;
    flex-direction: column;
    border-bottom: 1px solid #F0F0F0;
    padding: 16px 0;
}
.style-cart-item:last-child {
    border-bottom: none;
}
.style-cart-item .style-form-check .style-form-check-label {
    text-indent: -999999px;
}
.style-cart-item-thumbnail {
    height: 84px;
    display: inline-block;
}
.style-cart-item-thumbnail div {
    width: 84px;
    height: 84px;
    overflow: hidden;
    position: relative;
    flex-grow: 0;
    flex-basis: 84px;
    flex-shrink: 0;
    border-radius: 8px;
}
.style-cart-item-thumbnail div img {
    width: 84px;
    height: 84px;
    object-fit: cover;
}
.style-cart-item-detail {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    padding-left: 8px;
    flex-direction: column;
}
.style-cart-item-info {
    padding: 0 34px 6px 0;
    min-height: 60px;
}
.style-cart-item-info a {
    color: inherit;
    text-decoration: none;
}
.style-cart-item-info a h4 {
    margin: 0;
    padding: 0;
    font-size: 1.2rem;
    font-weight: 400;
    line-height: 1.5;
}
.style-cart-item-info a div {
    padding-left: 0px !important;
    color: #A647E3;
    font-size: 1.4rem;
    font-weight: 400;
    background-color: #fff;
}
.style-cart-item-info a h3 {
    width: 100%;
    margin: 0;
    display: -webkit-box;
    overflow: hidden !important;
    position: relative;
    font-size: 15px;
    max-height: 35px;
    text-align: left;
    font-weight: 400;
    line-height: 1.2;
    white-space: pre-wrap;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    color: #000;
}
.style-cart-item-option {
    color: #646464;
    font-size: 1.3rem;
    font-weight: 400;
    line-height: 1.5;
    margin-top:3px;
}
.style-cart-item-chekText {
    font-size: 1.3rem;
    line-height: 1.5;
    color: #C10000;
    margin-top:4px;
}
.style-cart-item-bottom {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top:2px;
}
.style-cart-item-quantity {

}
.cart-item-quantity {
    width: 87px;
    border: 1px solid #f4f4f5;
    display: flex;
    overflow: hidden;
    border-radius: 4px;
    background-color: #fff;
}
.cart-quantity-button {
    flex: 0 0 auto;
    color: inherit;
    opacity: 1;
    background: #f4f4f5;
    cursor: default;
    width: 24px;
    height: 22px;
    padding: 0;
    box-sizing: border-box;
    border-radius: 0;
}
.cart-quantity-label {
    width: 100%;
    display: flex;
    align-items: inherit;
    justify-content: inherit;
}
.cart-quantity-button svg {
    width: 16px !important;
    height: 16px !important;
}
.cart-quantity-opt {
    height: 22px;
    font-size: 1.4rem;
    border-left: 1px solid #f4f4f5;
    border-right: 1px solid #f4f4f5;
    width: 52px;
    display: flex;
    box-sizing: border-box;
    text-align: center;
    align-items: center;
    justify-content: center;
    font-weight: 400;
}
.cart-quantity-opt input {
    height: 100%;
    padding: 0;
    line-height: 1;
    font: inherit;
    color: currentColor;
    width: 100%;
    border: 0;
    margin: 0;
    text-align: center;
    -webkit-appearance: none;
}
.style-cart-item-price {
    display: flex;
}
.style-cart-item-price .price {
    font-size: 16px;
    align-items: center;
    font-family: Pretendard,sans-serif;
    font-weight: 600;
}
.style-cart-del {
    top: 1px;
    right: 0;
    position: absolute;
}
.style-cart-del svg {
    fill: #646464;
    width: 16px;
    height: 16px;
}
.style-cart-del svg path {
    stroke: #646464;
}
.style-cart-itemaAllPrice {
    margin: 0;
    line-height: 1.5;
    background-color: #fff;
    border-top: 1px solid #F0F0F0;
}
.style-cart-item-inner {
    display: flex;
    overflow: hidden;
    position: relative;
}
.itemaAllPrice-inner {
    padding: 16px;
    position: relative;
}
.itemaAllPrice-inner strong {
    font-family: Pretendard,sans-serif;
    font-weight: 400;
}
.itemaAllPrice-inner .price, .itemaAllPrice-inner .delivery, .itemaAllPrice-inner .total-price {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.itemaAllPrice-inner .delivery, .itemaAllPrice-inner .total-price {
    padding-top: 8px;
}
.itemaAllPrice-inner .delivery-chek {
    color: #646464;
    display: block;
    font-size: 1.2rem;
    text-align: right;
}
.itemaAllPrice-inner .total-price strong {
    font-weight: 700;
}
.style-cart-totalPrice {
    margin: 10px 0 0 0;
    border-top: 1px solid #F0F0F0;
    background-color: #fff;
}
.style-cart-fixButton {
    left: 50%;
    width: 100%;
    bottom: 0;
    display: flex;
    padding: 8px 16px;
    z-index: 1300;
    position: fixed;
    min-height: 64px;
    align-items: center;
    padding-bottom: calc(var(--safe-area-inset-bottom, env(safe-area-inset-bottom, 0px)) + 8px);
    background-color: #fff;
    max-width: var(--layout-max-width);
    transform: translate(-50%, 0);
}
.style-cartButton {
    color: #fff;
    width: 100%;
    height: 48px;
    display: flex;
    font-size: 1.6rem;
    align-items: center;
    font-weight: 860;
    line-height: 1;
    border-radius: 6px;
    justify-content: center;
    background-color: #A647E3;
}
.style-cart-fixButton-count {
    height: 16px;
    display: inline-flex;
    font-size: 1.5rem;
    font-weight: 400;
    border-right: 1px solid rgba(255,255,255,0.3);
    margin-right: 8px;
    padding-right: 8px;
}
.style-cartButton.disabled {
    color: #A1A1A1;
    background-color: #F6F6F6;
}
.style-cartButton.disabled .style-cart-fixButton-count {
    border-right: 1px solid #e5e5e5;
}
.style-cart-fixButton-price span {
    font-family: Pretendard,sans-serif;
}
.style-cart-empty {
    display: flex;
    padding: 40px 16px;
    flex-wrap: wrap;
    box-sizing: border-box;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    background-color: #f4f4f5;
}
.cart-empty-icon {
    margin-bottom: 20px;
}
.cart-empty-icon svg {
    width: 24px !important;
    height: 24px !important;
}
.cart-empty-icon svg path {
    fill: #c4c4c6;
}
.cart-empty-btn {
    width: 100%;
    margin-top: 70px;
}
.cart-empty-button {
    color: #A647E3;
    width: 100%;
    padding: 12px 16px;
    background-color: #fff;
    font-size: 1.6rem;
    box-shadow: none !important;
    font-weight: 500;
    text-transform: capitalize;
    border-radius: 6px;
    border: 1px solid #A647E3;
    display: block;
    text-align: center;
}
.style-cart-article .swiperBox {
    margin-top: 10px;
}
.style-cart-article swiper-slide {
    width: 156px;
    margin-right: 8px;
}
.style-cart-article swiper-slide:first-child {
    margin-left: 16px;
}
.style-cart-article swiper-slide:last-child {
    margin-right: 16px;
}
.style-cart-toast {
    color: #fff;
    display: flex;
    padding: 8px 12px 8px 16px;
    border-radius: 40px;
    width: auto;
    opacity: 1 !important;
    bottom: calc(70px + env(safe-area-inset-bottom, 0.5vh));
    top: auto;
}
.style-cart-toast .style-toast-content {
    white-space: nowrap;
}
.style-cart-toast a {
    color: #fff;
    display: flex;
}
.style-cart-toast svg {
    width: 18px;
    height: 18px;
}
#offcanvasBottom-cartRepeat {
    z-index: 1400;
}
.style-cartRepeat-title {
    display: -moz-box;
    display: flex;
    -moz-box-pack: start;
    justify-content: flex-start;
    -moz-box-align: center;
    align-items: center;
    padding: 0 0 16px 16px;
    margin: 0;
    font-size: 1.8rem;
    font-weight: 700;
    color: var(--color-gray-900);
}
.style-cartRepeat-contItem {
    padding: 0 16px;
    position: relative;
    background: white;
    max-height: 350px;
    overflow-y: scroll;
    -ms-overflow-style: none; /* 인터넷 익스플로러 */
    scrollbar-width: none; /* 파이어폭스 */
}
.style-cartRepeat-contItem::-webkit-scrollbar {
    display: none;
}
.style-cartRepeat-list li {
    width: 100%;
    display: -moz-box;
    display: flex;
    -moz-box-pack: justify;
    justify-content: space-between;
    margin-bottom: 16px;
}
.style-cartRepeatItem-info {
    display: -moz-box;
    display: flex;
    -moz-box-pack: start;
    justify-content: flex-start;
}
.style-cartRepeatItem-thumbnail {
    width: 84px;
    height: 84px;
    overflow: hidden;
    position: relative;
    flex-grow: 0;
    flex-basis: 84px;
    flex-shrink: 0;
    border-radius: 4px;
}
.style-cartRepeatItem-thumbnail img {
    width: 84px;
    height: 84px;
    object-fit: cover;
}
.style-cartRepeatItem-cont {
    margin-left: 12px;
}
.cartRepeatItem-purchases {
    display: inline-flex;
    padding: 0 8px;
    border-radius: 4px;
    background-color: #eceff3;
    height: 22px;
    font-size: 11px;
    font-weight: 600;
    line-height: 22px;
    text-align: center;
    color: #4c545e;
    margin-bottom: 3px;
}
.cartRepeatItem-title {
    width: 100%;
    display: -webkit-box;
    overflow: hidden !important;
    position: relative;
    font-size: 1.3rem;
    text-align: left;
    line-height: 1.4;
    white-space: pre-wrap;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    font-weight: 400;
    margin: 4px 0 2px;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.cartRepeatItem-option {
    display: block;
    color: #777D8E;
    font-size: 1.3rem;
    font-weight: 400;
    margin-bottom: 0;
}
.cartRepeatItem-price {

}
.cartRepeatItem-price span {
    font-size: 1.4rem;
    color: #EA333E;
    font-family: Pretendard,sans-serif;
    font-weight: 600;
    margin-right: 4px;
}
.cartRepeatItem-price strong {
    font-size: 1.4rem;
    font-family: Pretendard,sans-serif;
    font-weight: 600;
}
.style-cartRepeatItem-btn {
    display: -moz-box;
    display: flex;
    -moz-box-pack: start;
    justify-content: flex-start;
    -moz-box-align: center;
    align-items: center;
    padding: 0 0 0 16px;
}
.style-cartRepeatItem-button {
    color: var(--color-gray-900);
    background-color: #fff;
    font-size: 13px;
    line-height: 19px;
    height: 32px;
    display: flex;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    align-items: center;
    box-shadow: none;
    font-weight: 500;
    text-transform: capitalize;
    border: 1px solid var(--color-gray-400);
    border-radius: 4px;
    width: 65px;
}
.style-cartRepeatItem-button svg {
    width: 17px;
    height: 17px;
    margin-right: 2px;
}
.style-cartRepeatItem-button path {
    fill: var(--color-gray-900);
}
.style-cartRepeatItem-button.include {
    border: 1px solid var(--color-gray-300);
    color: var(--color-gray-500);
}
.style-cartRepeatItem-button:active {
    background-color: var(--color-gray-100);;
}
.style-cartRepeatItem-button.include:active {
    background-color: #fff;
}
.style-cartRepeat-bottom {
    display: -moz-box;
    display: flex;
    -moz-box-pack: start;
    justify-content: flex-start;
    -moz-box-align: center;
    align-items: center;
    padding: 16px;
}
/* 종료: 장바구니*/

/* 시작: 총 결제 금액*/
.style-totalPrice {
    padding: 20px 16px 16px;
}
.style-totalPrice li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 12px;
}
.style-totalPrice li:last-child {
    padding-bottom: 0;
}
.style-totalPrice li.full {
    display: inherit;
}
.style-totalPrice li.small {
    color: #8D8D8D;
    font-size: 1.2rem;
}
.style-totalPrice .discount {
    display: flex;
    align-items: center;
}
.style-totalPrice .discount button {
    font-weight: 600 !important;
    color: #A647E3;
    font-size: 1.4rem;
    font-family: Pretendard,sans-serif;
}
.style-totalPrice .discount svg {
    width: 18px;
    height: 18px;
    transition: all ease 0.3s;
}
.style-totalPrice .discount svg path {
    fill: #000;
}
.style-totalPrice #discountOpen.open svg {
    transform: rotate(180deg);
}
.style-totalPrice .pay-option li {
    padding-bottom: 3px !important;
    text-align: right;
    justify-content: inherit;
    display: block;
}
.style-totalPrice .pay-option li button {
    color: #346AFF;
    margin: 0;
    padding: 0;
    font-size: 1.3rem;
    font-weight: 700;
    text-decoration: underline;
}
.discountAll {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.discountDetail {
    display: inherit;
    width: 100%;
    height: 0;
    overflow: hidden;
    transition: height 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    transition-duration: 300ms;
}
.discountDetail.open {
    min-height: 0;
    height: 24px;
}
.discountDetail-inner {
    color: #8D8D8D;
    display: flex;
    font-size: 1.2rem;
    align-items: center;
    padding-top: 6px;
    justify-content: space-between;
}
.discountDetail-inner div {
    color: #A647E3;
    font-size: 1.3rem;
    font-family: Pretendard,sans-serif;
}
.style-totalPriceAll {
    margin: 15px 0 0 0;
    display: flex;
    padding: 15px 0 0;
    flex-wrap: wrap;
    border-top: 1px solid #F0F0F0;
    align-items: center;
    justify-content: space-between;
}
.style-totalPriceAll span {
    width: 140px;
    margin: 0;
    padding: 0;
    font-weight: 700;
}
.style-totalPriceAll strong {
    color: #C10000;
    width: calc(100% - 140px);
    margin: 0;
    padding: 0;
    font-size: 2.0rem;
    text-align: right;
    font-family: Pretendard,sans-serif;
    font-weight: 700;
}
/* 시작: 총 결제 금액*/

/* 시작: 주문결제*/
.style-order {
    width: 100%;
    margin: 0 auto;
    position: relative;
    max-width: 1200px;
    background-color: #f4f4f5;
    gap: 10px;
}
.style-order-header {
    top: 50px;
    left: 0;
    padding: 12px 16px;
    z-index: 1000;
    position: sticky;
    min-height: 52px;
    background-color: #fff;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.
.style-order-header .style-form-check {
    padding: 0;
    font-size: 1.4rem;
}
.style-order-header .form-check-input {
    margin-left: 0 !important;
}
.style-order-header .style-cart-delAll {
    color: #000;
    height: 28px;
    padding: 0 10px;
    line-height: 1.5;
    background-color: #F6F6F6;
    border: 0 none;
    border-radius: 4px;
}
.style-order-article {
    background: #fff;
    margin-top: 10px;
}
.style-order-article-header {
    cursor: default;
    width: 100%;
    display: flex;
    padding: 16px 16px 0 16px;
    align-items: center;
    justify-content: space-between;
    position: relative;
}
.style-order-article-header h3 {
    margin: 0;
    font-size: 1.8rem;
    font-weight: 700;
}
.style-order-article-button {
    right: 16px;
    bottom: -2px;
    display: flex;
    position: absolute;
}
.style-order-addressChange {
    color: #A647E3;
    border: 0 none;
    background-color: #F6EEFA;
    height: 28px;
    padding: 0 10px;
    font-size: 1.3rem;
    min-width: 0;
    font-weight: 600;
    border-radius: 4px;
}
.style-order-coupontext {
    display: inline-block;
    padding: 7px 0;
    font-size: 14px;
}
.style-order-coupontext span {
    color: #A647E3;
    font-weight: 700;
}
.style-order-article-summary {
    top: 18px;
    right: 16px;
    display: flex;
    position: absolute;
    align-items: center;
}
.order-summary {
    gap: 8px;
    color: #000;
    align-items: center;
    padding-right: 8px;
    display: none;
}
.order-summary .line {
    width: 1px;
    height: 12px;
    display: block;
    background: #ccc;
}
.order-summary.open {
    display: inline-flex;
}
.order-productInfo {
    margin: 0;
    transform: rotate(180deg);
    transition: all 0.3s ease;
}
.order-productInfo.open {
    transform: rotate(0deg);
}
.style-order-article-inner {
    padding: 16px;
}
.style-orderForm {
    padding-bottom: 16px;
}
.style-orderForm .style-form-label {
    margin-bottom: 5px;
}
.style-orderForm .style-imageUploader {
    margin-left: -16px;
}
.style-orderForm-w2 {
    display: flex;
}
.zipCode-button {
    font-weight: 400;
    margin-left: 0.5rem;
    font-size: 1.5rem;
}
.style-orderAddress {
    margin-bottom: 8px;
}
.style-orderAddress li {
    display: flex;
    margin-top: 8px;
    word-break: break-all;
    align-items: flex-start;
}
.style-orderAddress li strong {
    width: 90px;
    flex-shrink: 0;
    font-weight: 700;
}
.style-orderAddress .addressChange {
    padding-top: 8px;
}
.style-orderAddress .addressChange-button {
    background-color: #F6EEFA;
    height: 28px;
    display: flex;
    padding: 0 10px;
    font-weight: 600;
    color: #A647E3;
    border: 0 none;
    border-radius: 4px;
}
.orderList-inner {
    width: 100%;
    padding: 0;
    height: auto;
    overflow: hidden;
}
#productInfo-view.close {
    height: 0;
    padding-bottom: 16px;
}
.style-orderList {

}
.style-orderList-header {
    width: 100%;
    padding: 18px 16px;
    background-color: #F6F6F6;
    display: flex;
    font-size: 1.4rem;
    justify-content: space-between;
    margin-top: 16px;
}
.style-orderList-header strong {
    font-weight: 700;
}
.style-orderList-heade span {
    font-size: 1.3rem;
    font-weight: 400;
}
.style-orderList-item {
    overflow: hidden;
    position: relative;
    list-style: none;
}
.style-orderList-item li {
    display: flex;
    padding: 0 16px;
    position: relative;
    flex-direction: column;
    background-color: #fff;
    width: 100%;
    justify-content: flex-start;
    text-decoration: none;
}
.style-orderList-item li:before {
    width: 100%;
    content: "";
    display: block;
    border-top: 1px solid #eeeeef;
}
.style-orderList-item li:first-child:before {
    display: none;
}
.style-orderList-item .orderItem {
    padding: 14px 0;
    width: 100%;
    display: flex;
}
.orderItem-thumbnail {
    width: 94px;
    display: flex;
    flex-grow: 0;
    flex-wrap: wrap;
    flex-basis: 94px;
    flex-shrink: 0;
}
.orderItem-thumbnail a {
    width: 84px;
    height: 84px;
    overflow: hidden;
    position: relative;
    flex-grow: 0;
    flex-basis: 84px;
    flex-shrink: 0;
    margin-right: 10px;
    display: block;
}
.orderItem-thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    margin: auto;
    display: block;
    max-width: 100%;
}
.orderItem-info {
    width: calc(100% - 130px);
    flex-basis: calc(100% - 130px);
    flex-grow: 1;
    min-width: 0;
}
.orderItem-info-inner {
    width: 100%;
    height: 100%;
    justify-content: space-between;
    display: flex;
    position: relative;
    align-items: flex-start;
    flex-direction: column;
}
.orderItem-title {
    font-size: 1.5rem;
    font-weight: 400;
    width: 100%;
    margin: 0;
    display: -webkit-box;
    overflow: hidden !important;
    position: relative;
    max-height: 40px;
    text-align: left;
    line-height: 1.4;
    white-space: pre-wrap;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}
.orderItem-option {
    color: rgba(60, 60, 67, 0.6);
    font-size: 13px;
    font-weight: 400;
    margin-top: 4px;
    margin-bottom:4px;
}
.orderItem-quantity {
    color: #787878;
    font-size: 1.3rem;
    margin-top: 0;
    font-weight: 500;
    line-height: 1.5;
}
.orderItem-price {
    align-self: flex-end;
    justify-self: flex-end;
    display: inline;
}
.orderItem-price strong {
    font-size: 1.8rem;
    font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,"Malgun Gothic","맑은 고딕",돋움,Dotum,sans-serif;
    font-weight: 600;
}
.style-orderList-bottom {
    padding: 0 16px 16px;
}
.order-coupon {
    color: #A647E3;
    width: 100%;
    border: 1px solid #A647E3;
    display: flex;
    padding: 12px;
    font-size: 1.4rem;
    align-items: center;
    font-family: Pretendard,sans-serif;
    font-weight: 700;
    border-radius: 6px;
    justify-content: space-between;
}
.order-coupon-none {
    color: #000;
    font-weight: 400;
}
.style-order-coupon-text strong {
    color: #A647E3;
    font-weight: 700;
}
.style-order-coupon-text {
    gap: 6px;
    display: flex;
    align-items: center;
    color: #000;
    font-weight: 400;
}
.style-order-coupon-text svg {
    width: auto;
    height: 20px;
}
.style-order-coupon-text2 strong {
    color: #A647E3;
    font-weight: 700;
}
.style-order-coupon-text2 {
    gap: 6px;
    display: flex;
    align-items: center;
    color: #000;
    font-weight: 400;
}
.style-order-coupon-text2 svg {
    width: auto;
    height: 20px;
}
.style-order-coupon-right {
    display: flex;
    align-items: center;
    flex-shrink: 0;
    justify-content: center;
    gap: 12px;
    color: #A647E3;
    font-size: 1.4rem;
    font-weight: 700;
}
.style-order-coupon-right svg {
    width: auto;
    height: 14px;
}
.style-order-coupon-right svg path {
    stroke: #646464;
}
.style-order-article-inner .style-input-cash-button {
    background-color: #6A1CA1 !important;

}
.style-order-article-inner .form-control {

}
.style-input-cash-text {
    width: 100%;
    text-align: right;
    margin-top: 10px;
}
.style-input-cash-text span {
    padding-left: 4px;
}
.style-order-article-inner .style-totalPrice {
    padding: 0;
}
.style-order-article-inner .discountDetail.open {
    height: 48px;
}
.style-totalCash {
    padding: 0;
}
.style-totalCash li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 12px;
}
.style-totalCash li:last-child {
    padding-bottom: 0;
}
.discountDetail {
    display: inherit;
    width: 100%;
    height: 0;
    overflow: hidden;
    transition: height 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    transition-duration: 300ms;
}
.style-totalCashAll {
    margin: 15px 0 0 0;
    display: flex;
    padding: 15px 0 0;
    flex-wrap: wrap;
    border-top: 1px solid #F0F0F0;
    align-items: center;
    justify-content: space-between;
}
.style-totalCashAll span {
    width: 140px;
    margin: 0;
    padding: 0;
    font-weight: 700;
}
.style-totalCashAll strong {
    margin: 0;
    display: flex;
    padding: 0;
    font-size: 14px;
    text-align: right;
    align-items: center;
    font-family: Pretendard,sans-serif;
    font-weight: 700;
    line-height: 1;
}
.style-orderPay li {
    width: 100%;
    display: flex;
    padding: 12px 0;
    position: relative;
    flex-wrap: wrap;
    align-items: center;
}
.style-orderPay li:first-child {
    padding-top: 0;
}
.style-order-article-inner .sbtn {
    font-size: 1.3rem;
    padding-left: 8px;
    text-decoration: underline;
}
.style-order-article-header .allCheck {
    font-size: 1.5rem;
}
.style-order-article-btn {
    margin-top: 25px;
}
.style-order-article-btn button span {
    font-weight: 400;
}
.style-address-body {
    background-color: #f4f4f5;
}
.style-address-add {
    padding: 20px;
}
.style-addressList {
}
.style-address-item {
    padding: 20px 16px;
    border-top: 1px solid #cfcfd0;
    border-bottom: 1px solid #cfcfd0;
    background-color: #fff;
    margin-bottom: 10px;
}
.style-address-item li {
    display: flex;
    margin-top: 8px;
    word-break: break-all;
    align-items: flex-start;
}
.style-address-item li:first-child {
    margin-top: 0;
}
.style-address-item li strong {
    width: 90px;
    flex-shrink: 0;
    font-weight: 700;
}
.style-address-item li span {
    display: flex;
    align-items: center;
}
.style-address-item-button {
    display: flex;
    margin-top: 30px;
    justify-content: space-between;
}
.style-address-item-button .address-btn {
    margin-right: 8px;
    padding: 2px 10px;
    min-width: 0;
    color: #8a8a8e;
    border: 0 none;
    background-color: #f4f4f5;
    font-size: 1.4rem;
    box-shadow: none !important;
    font-weight: 400;
    border-color: #dcdcdd;
    text-transform: capitalize;
    border-radius: 4px;
}
.style-address-item-button .address-selectBtn {
    color: #fff;
    background-color: #A647E3;
}
.address-badge {
    border: 1px solid #A647E3;
    color: #A647E3;
    background-color: #fff;
    height: 20px;
    display: inline-flex;
    padding: 0 8px;
    font-size: 1.2rem;
    align-items: center;
    flex-shrink: 0;
    font-weight: 500;
    line-height: 1;
    justify-content: center;
    margin-left: 6px;
    border-radius: 18px;
}
.style-addressAdd {
    padding: 16px;
}
.style-offcanvasOrder-coupon {
    /*max-height: 100vh !important;*/
}
.style-order-coupon-content {
    padding: 0 16px;
}
.style-order-coupon-content .style-button-secondary {
    background: rgb(246, 238, 250);
}
.style-order-coupon-content {
    padding: 0 20px 12px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.style-order-coupon-close {
    /*position: fixed;
    bottom: 0;*/
    width: 100%;
    /*padding: 10px 20px 10px;*/
    padding-top:10px;
    padding-left:20px;
    padding-right:20px;
    background-color: var(--color-common-white);
    padding-bottom: calc(var(--safe-area-inset-bottom, env(safe-area-inset-bottom, 0px)) + 5px);
}
.style-order-coupon-close .couponbtn {
    display: flex;
}
.coupon-discountPrice {
    font-size: 1.6rem;
    font-family: Pretendard,sans-serif;
    font-weight: 700;
    padding-bottom: 10px;
    display: none;
}
.coupon-discountPrice.open {
    display: flex;
}
.style-order-complete-button {
    display: flex;
    gap: 10px;
    padding: 20px 16px;
}
.style-order-article .swiperBox {
    margin-top: 10px;
}
.style-order-article swiper-slide {
    width: 156px;
    margin-right: 8px;
}
.style-order-article swiper-slide:first-child {
    margin-left: 16px;
}
.style-order-article swiper-slide:last-child {
    margin-right: 16px;
}
.order-complete {
    padding: 15px 16px;
    word-break: break-word;
    border-radius: 4px;
    background-color: #f4f4f5;
}
.order-complete dl {
    margin: 0;
    display: flex;
    padding: 5px 0;
    align-items: flex-start;
    justify-content: flex-start;
}
.order-complete dt {
    width: 90px;
    flex-shrink: 0;
    font-weight: 700;
    margin-right: 6px;
}
.order-complete dd {
    margin: 0;
}
/* 종료: 주문결제*/

/* 시작: 개인정보수집이용*/
.useinfo-pg {
    padding: 0 15px 0;
}
.useinfo-pg .tit-txt-big {
    font-size: 22px;
    font-weight: 700;
}
.scn-useinfo {
    margin-top: 20px;
    line-height: 21px;
}
.scn-useinfo:first-child {
    margin-top: 0;
}
.round-num > li > .number {
    display: inline-block;
    width: 12px;
    margin-left: -18px;
    margin-right: 5px;
}
.round-num > li > .bullet {
    display: inline-block;
    width: 6px;
    margin-left: -18px;
    margin-right: 5px;
}
.round-num > li {
    padding-left: 18px;
}
.static-num > li > .number {
    display: inline-block;
    width: 10px;
    margin-left: -15px;
    margin-right: 5px;
}
.static-num > li {
    padding-left: 15px;
}
.scn-useinfo table {
    width: 100%;
    margin: 15px 0 15px -15px;
}
.scn-useinfo table th {
    padding: 12px 0 10px;
    text-align: center;
    background: #fbfbfb;
    border-top: 1px solid #e0e0e0;
    border-bottom: 1px solid #e0e0e0;
    border-right: 1px solid #e0e0e0;
}
.scn-useinfo table th:first-child {
    border-left: 1px solid #e0e0e0;
}
.scn-useinfo table td {
    padding: 12px 0 10px 10px;
    border-bottom: 1px solid #e0e0e0;
    border-right: 1px solid #e0e0e0;
}
.scn-useinfo table td:first-child {
    border-left: 1px solid #e0e0e0;
}
.scn-useinfo .noThead th,
.scn-useinfo .noThead td {
    text-align: left;
    padding: 12px 10px;
}
.scn-useinfo .noThead th {
    border-top: 0;
    border-left: 1px solid #e0e0e0;
    border-bottom: 1px solid #e0e0e0;
    border-right: 1px solid #e0e0e0;
}
.scn-useinfo .noThead .noTheadFirstRow th,
.scn-useinfo .noThead .noTheadFirstRow td {
    border-top: 1px solid #e0e0e0;
}
.private-lnk {
    border: 1px solid #e0e0e0;
    padding: 20px 30px 15px;
    margin-top: 20px;
}
.private-lnk ul {
    float: left;
    margin-left: 140px;
}
.private-lnk ul:first-child {
    margin-left: 0;
}
.private-lnk li {
    font-weight: bold;
    line-height: 24px;
}
.private-lnk a {
    color: #464646;
}
.useInfoP {
    margin-top: 8px;
}
/* 종료: 개인정보수집이용*/


/* 시작: 마이페이지 메인 */
.style-mypage {
    padding: 0 16px 80px;
}
.style-mypage.mypage-pet {
    background-color: #f4f4f5;
    padding: 0;
}
.style-mypage .style-mypage-top {
    background-color: #fff;
    border-radius: 10px;
}
.style-mypage .style-mypage-profile {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 16px;
}
.style-mypage .style-mypage-name {
    display: flex;
    align-items: center;
    gap: 12px;
    font-weight: 700;
    font-size: 20px;
    width: 100%;
}
.style-mypage .style-mypage-name img {
    width: auto;
    height: 36px;
}
.style-mypage .style-mypage-name-image {
    width: 36px;
    height: 36px;
    border: 1px solid var(--color-gray-400);
    overflow: hidden;
    border-radius: 50%;
    position: relative;
}
.style-mypage .style-mypage-name-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.style-mypage .style-mypage-name-text {
    max-width: 100%;
}
.style-mypage .style-mypage-membership-button {
    display: flex;
    color: var(--color-gray-600);
}
.style-mypage .style-mypage-membership-button svg {
    width: auto;
    height: 14px;
}
.style-mypage .style-mypage-membership-button path {
    fill: var(--color-gray-600);;
}
.style-mypage .style-mypage-myShopping {
    display: flex;
    border-top: 1px solid #F0F0F0;
    width: 100%;
}
.style-mypage .style-mypage-myShopping dl {
    width: 100%;
    align-items: center;
    padding: 20px 16px;
}
.style-mypage .style-mypage-myShopping dl:nth-child(2) {
    border-left: 1px solid #F0F0F0;
    border-right: 1px solid #F0F0F0;
    box-sizing: border-box;
}
.style-mypage .style-mypage-myShopping dt {
    font-weight: 400;
    display: block;
    padding-bottom: 3px;
}
.style-mypage .style-mypage-myShopping dd {
    font-weight: 700;
    display: block;
    font-size: 1.6rem;
}
.style-mypage .style-mypage-saved {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.style-mypage .style-mypage-saved dt {
    font-weight: 600;
    font-size: 16px;
    display: flex;
    align-items: center;
    gap: 4px;
}
.style-mypage .style-mypage-saved dt img {
    width: auto;
    height: 20px;
}
.style-mypage .style-mypage-saved dd {
    font-weight: 500;
    font-size: 14px;
    display: flex;
    align-items: center;
    gap: 1px;
}
.style-mypage .style-mypage-saved dd strong {
    font-size: 18px;
}
.style-mypage .style-mypage-charge {
    width: 100%;
    height: 36px;
    gap: 4px;
    font-size: 14px;
}
.style-mypage .style-mypage-charge svg {
    width: auto;
    height: 16px;
}
.style-mypage .style-mypage-expect {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-top: 1px solid var(--color-gray-100);
    padding-top: 14px;
}
.style-mypage .style-mypage-expect dt {
    display: flex;
    align-items: center;
    gap: 2px;
    font-weight: 400;
    font-size: 13px;
}
.style-mypage .style-mypage-expect dt img {
    width: auto;
    height: 14px;
}
.style-mypage .style-mypage-expect dd {
    display: flex;
    align-items: center;
    gap: 1px;
    font-size: 12px;
}
.style-mypage .style-mypage-expect dd strong {
    font-weight: 700;
    font-size: 13px;
}
.style-mypage .style-mypage-attainableCash {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 13px;
    padding: 12px 14px;
    background-color: var(--color-gray-100);
    border-radius: 10px;
    margin-top: 16px;
}
.style-mypage .style-mypage-attainableCash-right {
    display: flex;
    align-items: center;
    gap: 2px;
    font-size: 12px;
}
.style-mypage .style-mypage-attainableCash svg {
    width: auto;
    height: 14px;
}
.style-mypage-article {
    padding: 16px;
    background-color: #fff;
    border-radius: 10px;
    margin-top: 10px;
    position: relative;
}
.mypage-pet .style-mypage-article {
    border-radius: 0;
}
.mypage-pet .style-mypage-article:first-child {
    margin-top: 0;
}
.style-mypage-article:not(:first-of-type) {
    border-top: 1px solid var(--color-gray-100);
}
.style-mypage-article-title {
    display: flex;
    align-items: center;
    font-size: 16px;
    font-weight: 700;
    padding-bottom: 5px;
}
.style-mypage-article-sbtn {
    position: absolute;
    top: 16px;
    right: 16px;
    font-size: 13px;
    color: var(--color-gray-600);
}
.style-mypage-article li {

}
.style-mypage-menu li a {
    display: flex;
    gap: 10px;
    height: 46px;
    font-size: 16px;
    line-height: 1;
    align-items: center;
}
.style-mypage-menu li a svg {
    width: auto;
    height: 14px;
    margin-left: auto;
}
.style-mypage-menu li a svg path {
    fill: var(--color-gray-650);
}
.style-mypage-pet {
    padding-top: 5px;
}
.mypage-petAdd {
    display: flex;
    border: 1px dotted var(--color-gray-400);
    background-color: var(--color-gray-50);
    width: 100%;
    justify-content: center;
    align-items: center;
    padding: 12px;
    box-sizing: border-box;
    border-radius: 8px;
    font-size: 1.6rem;
    color: var(--color-gray-600);
}
.mypage-petAdd span {
    width: 35px;
    height: 35px;
    display: inline-flex;
    border-radius: 50%;
    background-color: var(--color-gray-200);
    margin-right: 10px;
    justify-content: center;
    align-items: center;
}
.mypage-petAdd span svg {
    width: 18px;
    height: 18px;
}
.mypage-petAdd span svg path {
    fill: var(--color-gray-600);
}
.style-mypage-petList {
    position: relative;
    padding: 0 50px 0 0;
}
.style-mypage-petList swiper-slide {
    /*width: calc(50% - 6px);*/
    width: auto;
}
.style-mypage-petList .style-mypet-link {
    width: 100%;
    display: flex;
    background-color: var(--color-gray-50);
    justify-content: center;
    align-items: center;
    padding: 8px 9px;
    box-sizing: border-box;
    border-radius: 55px;
    font-size: 1.6rem;
    color: var(--color-gray-600);
    border: 1px solid var(--color-gray-50);
    color: var(--color-gray-900);
}
.style-petList-select .style-mypet-link {
    opacity: 0.7;
}
.style-petList-select .style-mypet-link.active {
    border: 1px solid var(--color-mainColor);
    color: var(--color-mainColor);
    background-color: var(--color-mainColorBg);
    opacity: 1;
}
.style-mypage-petList .style-mypet-name {
    display: flex;
    align-items: center;
    gap: 6px;
    font-weight: 700;
    width: 100%;
    font-size: 1.4rem;
}
.style-mypage-petList .style-mypet-name img {
    width: auto;
    height: 36px;
}
.style-mypage-petList .style-mypet-name-image {
    width: 30px;
    height: 30px;
    /*border: 1px solid var(--color-gray-400);*/
    overflow: hidden;
    border-radius: 50%;
    position: relative;
}
.style-mypage-petList .style-mypet-name-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    background-color: #fff;
    /*background-color: #F6EEFA;*/
}
.style-petList-select .style-mypet-link.active .style-mypet-name-image img {
    background-color: #fff;
}
.style-mypage-petList .style-mypet-name-text {
    /*width: calc(100% - 40px);
    color: var(--color-gray-900);
    verflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;*/
}
.style-mypage-petMore {
    position: absolute;
    top: 0;
    right: 0;
    justify-content: center;
    align-items: center;
}
.mypage-petMore {
    display: flex;
    flex-wrap: wrap;
    box-sizing: border-box;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    color: var(--color-gray-600);
    font-size: 1.3rem;
}
.mypage-petMore span {
    width: 30px;
    height: 30px;
    display: flex;
    border-radius: 50%;
    background-color: var(--color-gray-100);
    justify-content: center;
    align-items: center;
    margin-bottom: 5px;
}
.mypage-petMore span svg {
    width: 18px;
    height: 18px;
}
.mypage-petMore span svg path {
    fill: var(--color-gray-600);
}
/* 종료: 마이페이지 메인 */

/**/

.style-save-cash {

}
.style-save-cash-gray {
    background: #F9F9F9;
}
.save-cash-list {
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 22px;
}
.mypage-save-cash {
    display: flex;
    gap: 10px;
    align-items: center;
    width: 100%;
}
.mypage-save-cash .save-cash-icon {
    border-radius: 16px;
    /*background: #F7F8FA;*/
    width: 42px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.save-cash-list .mypage-save-cash .save-cash-icon {
    background: #F7F8FA;
    width: 48px;
    height: 48px;
}
.mypage-save-cash .save-cash-icon img {
    width: 42px;
    height: 42px;
}
.mypage-save-cash .save-cash-text {
    display: flex;
    flex-direction: column;
    text-align: left;
    color: #868B94;
    font-size: 14px;
    line-height: 140%;
}
.mypage-save-cash .save-cash-text strong {
    font-weight: 700;
    font-size: 16px;
    color: #2A2A2A;
    line-height: 140%;
}
.save-cash-list .save-cash-text strong {
    font-size: 15px;
}
.mypage-save-cash .save-cash-text .c_b {
    color: #4377FD;
}
.mypage-save-cash .save-cash-right {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 5px;
}
.mypage-save-cash .save-cash-cash {
    padding: 8px;
    background: #F6F6F6;
    border-radius: 16px;
    display: flex;
    gap: 3px;
    color: #454545;
    font-weight: 400;
    align-items: center;
    height: 22px;
    line-height: 22px;
    font-size: 12px;
}
.mypage-save-cash .arrow {
    width: 16px;
    height: 16px;
    margin-left: auto;
}
.save-cash-detail {

}
.save-cash-detail-top {
    padding: 20px 16px;
    display: flex;
    gap: 16px;
    background: #fff;
}
.save-cash-detail-top .save-cash-icon {
    border-radius: 16px;
    background: #F7F8FA;
    width: 72px;
    height: 72px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.save-cash-detail-top .save-cash-icon img {
    width: 62px;
    height: 62px;
}
.save-cash-detail-top .save-cash-text {
    display: flex;
    flex-direction: column;
    text-align: left;
    color: #868B94;
    font-size: 14px;
    padding: 3px 0;
}
.save-cash-detail-top .save-cash-text strong {
    font-weight: 700;
    font-size: 16px;
    color: #2A2A2A;
    margin-bottom: 2px;
}
.save-cash-detail-top .save-cash-cash {
    display: flex;
    gap: 3px;
    color: #2A2A2A;
    font-weight: 600;
    align-items: center;
    margin-top: 2px;
}

.save-cash-detail-top .save-cash-cash img{
    width:14px;
    height:14px;
    margin-top:-2px;
}
.save-cash-detail-guide {
    display: flex;
    gap: 26px;
    flex-direction: column;
    background: #fff;
}
.save-cash-detail-guide div {
    padding: 20px 20px 0;
}
.save-cash-detail-guide div:first-child {
    background: #fff;
}
.save-cash-detail-guide .gr-box {
    background: #F9F9F9;
    padding: 50px 20px;
}
.save-cash-detail-guide h3 {
    font-size: 16px;
    font-weight: 700;
    color: #212124;
    margin-bottom: 5px;
}
.save-cash-detail-guide ul {
    display: flex;
    flex-direction: column;
    gap: 5px;
}
.save-cash-detail-guide li {
    font-size: 16px;
}
.save-cash-detail-guide .dot-list li {
    position: relative;
    padding-left: 10px;
    font-size: 16px;
}
.save-cash-detail-guide .dot-list li:before {
    position: absolute;
    top: 8px;
    left: 0;
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: #212124;
    content: "";
}
.style-save-cash  .style-fixed-bottom-content {
    display: flex;
    width: 100%;
    gap: 10px;
}
.offcanvas-save-cash {
    padding: 30px 20px !important;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
}
.offcanvas-save-cash .title {
    font-size: 26px;
    color: #000;
    font-weight: 700;
}
.offcanvas-save-cash .img {
    text-align: center;
    position: relative;
    overflow: hidden;
    padding: 30px;
}
.offcanvas-save-cash .img img {
    position: relative;
    z-index: 2;
}
.offcanvas-save-cash .cash-img {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    z-index: 0;
}
.offcanvas-save-cash .cash {
    padding: 10px 20px;
    background: #FAFAFA;
    font-size: 14px;
    color: #646464;
    display: inline-flex;
    width: fit-content;
    margin: 0 auto;
    border-radius: 12px;
    margin-bottom: 30px;
}
.offcanvas-save-cash .cash strong {
    font-weight: 500;
    color: #000;
    margin-left: 7px;
}
.save-cash-attendance{
    display: flex;
    flex-direction: column;
    gap: 30px;
    background: #fff;
}
.save-cash-attendance-calendar {
    padding: 20px 16px;
}
.save-cash-attendance-calendar .title {
    font-weight: 700;
    font-size: 22px;
    color: #212124;
    margin-bottom: 20px;
}
.save-cash-attendance-calendar .calendarBox {
    padding: 20px 16px;
    border-radius: 16px;
    border: 1px solid #F0F0F0;
}
.save-cash-attendance-calendar .calendarBox .calendar-month {
    font-weight: 700;
    font-size: 19px;
    color: #000;
}
.save-cash-attendance-calendar .calendarBox .calendar {
    margin: 16px 0 0;
}
.save-cash-attendance-calendar .calendarBox .calendar table {
    width: 100%;
}
.save-cash-attendance-calendar .calendarBox .calendar table th,
.save-cash-attendance-calendar .calendarBox .calendar table td {
    text-align: center;
    vertical-align: top;
}
.save-cash-attendance-calendar .calendarBox .calendar table th {
    color: #000;
    font-size: 14px;
    font-weight: 500;
    padding-bottom: 20px;
}
.save-cash-attendance-calendar .calendarBox .calendar table td {
    font-size: 15px;
    height: 50px;
    color: #8D8D8D;
}
.save-cash-attendance-calendar .calendarBox .calendar table .today {
    color: #000;
    font-weight: 700;
}
.save-cash-attendance-calendar button {
    font-weight: 400;
    font-size: 14px;
    height: 49px;
    border-radius: 8px;
}
.save-cash-attendance-calendar .calendar-cash {
    font-size: 10px;
    color: #8D8D8D;
    text-align: center;
    display: block;
    margin-top: 1px;
}
.save-cash-attendance-guide {
    background: #F9F9F9;
    padding: 50px 20px;
}
.save-cash-attendance-guide h3 {
    font-weight: 700;
    font-size: 15px;
    color: #000;
    margin-bottom: 12px;
}
.save-cash-attendance-guide li {
    position: relative;
    padding-left: 10px;
    font-size: 14px;
    color: #787878;
    margin-bottom: 8px;
}
.save-cash-attendance-guide li:before {
    position: absolute;
    top: 8px;
    left: 0;
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: #787878;
    content: "";
}
    /**/

/* 시작: 마이페이지 > 설정 */
.style-setting-content {
    display: flex;
    flex-direction: column;
    gap: 32px;
    padding: 0 16px 24px;
}
.style-setting .style-setting-article {
    padding: 12px 16px;
    display: flex;
    flex-direction: column;
    gap: 5px;
}
.style-setting .style-setting-article:not(:first-of-type) {
    border-top: 1px solid var(--color-gray-100);
}
.style-setting .style-setting-title {
    height: 40px;
    display: flex;
    align-items: center;
    font-size: 12px;
    font-weight: 700;
}
.style-setting .style-setting-list {
    display: flex;
    flex-direction: column;
    gap: 5px;
}
.style-setting .style-setting-list > li {
    display: flex;
    align-items: center;
    font-size: 16px;
}
.style-setting .style-setting-list > li > a {
    display: flex;
    align-items: center;
    padding: 12px 0;
}
.style-setting .style-setting-withAddOn {
    width: 100%;
    min-height: 46px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.style-setting .style-setting-icon {
    width: auto;
    height: 18px;
}
.style-setting .style-setting-withsubTitle {
    padding: 12px 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.style-setting .style-setting-withsubTitle div {
    font-size: 14px;
    color: var(--color-gray-600);
}
.style-setting .style-setting-addOnButton {
    color: var(--color-primary-600);
}
.style-setting .style-setting-addOnButton-alignTop {
    align-self: flex-start;
    position: relative;
    top: 12px;
}
.style-changeForm {
    padding: 24px 16px;
}
.style-changeForm .style-changeForm-top {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding-bottom: 24px;
}
.style-changeForm .style-changeForm-top h3 {
    font-size: 18px;
    font-weight: 700;
}
.style-changeForm .style-changeForm-top p {
    font-size: 14px;
    color: var(--color-gray-600);
}
.style-changeForm .style-changeForm-certify {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.style-changeForm .style-changeForm-newPassword {
    width: 100%;
    padding-top: 32px;
}
.style-changeForm .style-changeForm-newPassword-again {
    margin-top: 12px;
}
.style-changeForm .style-changeForm-myCash {
    background-color: var(--color-gray-50);
    border-radius: 8px;
    padding: 18px 16px;
    text-align: center;
    font-weight: 500;
    margin-bottom: 20px;
}
.style-changeForm .style-changeForm-myCash span {
    color: var(--color-primary-600);
}
.style-changeForm .style-changeForm-delivery {
    background-color: var(--color-gray-50);
    border-radius: 8px;
    padding: 20px;
    text-align: center;
    font-weight: 500;
    margin-bottom: 20px;

}
.style-changeForm .changeForm-delivery-row {
    display: flex;
    flex-direction: row;
}
.style-changeForm .changeForm-delivery-row:first-child {
    margin-bottom: 10px;
}
.style-changeForm .changeForm-delivery-row div {
    width: 50%;
    border: 0;
    margin: 0;
    display: block;
    padding: 0;
    position: relative;
    min-width: 0;
    vertical-align: top;
    align-items: center;
}
.style-changeForm .changeForm-delivery-row div:first-child {
    padding-right: 10%;
}
.style-changeForm .changeForm-delivery-row span:first-child {
    float: left;
}
.style-changeForm .changeForm-delivery-row span:last-child {
    float: right;
}
.style-changeForm .style-withdraw-reason {
    padding-top: 40px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.style-changeForm .style-withdraw-reason h4 {
    font-size: 16px;
    font-weight: 700;
}
.style-changeForm .style-withdraw-list {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.style-changeForm .style-withdraw-agree a {
    color: var(--color-primary-600);
    text-decoration: underline;
}
/* 종료: 마이페이지 > 설정 */

/* 시작: 마이페이지 > 강아지 등록 */
.style-petAdd {
    padding: 0 16px 24px;
}
.style-petAdd-content {
    display: flex;
    flex-direction: column;
    gap: 32px;
}
.style-petAdd-content .w-100.double {
    width: calc(100% + 20px) !important;
    display: flex;
    margin-left: -10px;
}
.style-petAdd-content .w-100 div {
    display: inline-flex;
    position: relative;
    flex-direction: column;
    vertical-align: top;
    margin: 0 10px 0;
    width: 100%;
}
.style-registerForm-button {

}
.style-petAdd .style-profile {
    padding: 24px 0 0;
}
.style-petAdd .style-profile-photoInput-image {
    border: none !important;
    background-color: #F6EEFA;
}
/* 종료: 마이페이지 > 강아지 등록 */

/* 시작: 마이페이지 > 프로필 */
.style-profile {
    padding: 24px 16px;
}
.style-profile-photoInput {
    margin: 0 auto 26px;
    width: 96px;
    height: 96px;
    position: relative;
}
.style-profile-photoInput-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    overflow: hidden;
    border: 1px solid var(--color-gray-400);
    border-radius: 50%;
}
.style-profile-photoInput-button {
    width: 32px;
    height: 32px;
    overflow: hidden;
    border: 1px solid var(--color-gray-200);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-common-white);
    position: absolute;
    right: 0;
    bottom: 0;
}
.style-profile-photoInput-button svg {
    width: 22px;
    height: 22px;
}
/* 종료: 마이페이지 > 프로필 */


/* 시작: 마이페이지 > 이용내역 */
.style-useList {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 12px 16px;
}
.style-useList h3 {
    font-size: 14px;
    color: var(--color-gray-600);
    height: 28px;
    display: flex;
    width: 100%;
    align-items: center;
}
.style-useList ul {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.style-useList li a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}
.style-useList .style-useList-info {
    display: flex;
    gap: 8px;
    width: 100%;
    align-items: stretch;
}
.style-useList .style-useList-thumbnail {
    flex-shrink: 0;
    width: 48px;
    height: 48px;
    overflow: hidden;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.style-useList .style-useList-thumbnail img {
    width: 24px;
    height: 24px;
    object-fit: unset;
}
.style-useList .style-useList-description {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
}
.style-useList .style-useList-title {
    width: 100%;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.7;
}
.style-useList .style-useList-date {
    width: 100%;
    margin-top: auto;
    font-size: 13px;
    color: var(--color-gray-600);
    display: flex;
    gap: 4px;
}
.style-useList .style-useList-divider {
    color: var(--color-gray-300);
}
.style-useList .style-useList-adjust {
    flex-shrink: 0;
    font-size: 16px;
    font-weight: 700;
}
.style-useList .style-useList-charge .style-useList-adjust {
    color: var(--color-green-400);
}
.style-useList .style-useList-charge .style-useList-thumbnail {
    display: flex;
    align-items: center;
    justify-content: center;
}
.style-useList .style-useList-charge .style-useList-thumbnail img {
    width: 24px;
    height: 24px;
    object-fit: unset;
}
.style-bg-charge {
    background-color: var(--color-gray-50);
}
/* 종료: 마이페이지 > 이용내역 */

/* 시작: 마이페이지 > 보유캐시 */
.style-charge-myCashWrap {
    padding: 12px 16px;
}
.style-charge-myCash {
    width: 100%;
    padding: 18px 16px 16px;
    overflow: hidden;
    background: #fff;
    border-radius: 12px;
    text-align: center;
    color: var(--color-gray-900);
    border: 1px solid var(--color-gray-200);
}
.style-charge-myCash div {
    width: 100%;
    display: flex;
    align-items: center;
    flex-shrink: 0;
    justify-content: center;
}
.style-charge-myCash span {
    display: block;
}
.style-charge-myCash div img {
    width: 28px;
    height: 28px;
    margin-right: 4px;
}
.style-charge-myCash div strong {
    padding-right: 6px;
    font-size: 2.4rem;
    font-weight: 860;
}
.style-charge-myCash .myCash-last {
    padding-top: 6px;
}

/* 종료: 마이페이지 > 보유캐시 */


/* 시작: 마이페이지 > 주문배송 */
.style-mypageOrders {
    flex: 1 1 0;
    width: 100%;
    display: flex;
    padding: 0;
    flex-direction: column;
    background-color: #F6F6F6;
}
.style-mypageOrders.refund {
    background-color: #fff;
}
.style-mypageOrders-article {
    background: #fff;
    margin-top: 10px;
}
.style-mypageOrders-article:first-child {
    margin-top: 0;
}
.style-mypageOrders-article-title {
    margin: 0;
    display: flex;
    padding: 18px 16px;
    font-size: 1.5rem;
    align-items: center;
    font-weight: 400;
    justify-content: space-between;
    background-color: #f4f4f5;
    margin-bottom: -10px;
}
.style-mypageOrders-article-header {
    cursor: default;
    width: 100%;
    display: flex;
    padding: 16px 16px 0 16px;
    align-items: center;
    justify-content: space-between;
}
.style-mypageOrders-article-header h3 {
    margin: 0;
    font-size: 1.8rem;
    font-weight: 700;
}
.style-mypageOrders-article-inner {
    padding: 16px;
}
.style-mypageOrders-article-inner .style-totalPrice {
    padding: 0;
}
.style-mypageOrders-toparea {
    margin: 0;
    display: flex;
    padding: 18px 16px;
    font-size: 1.4rem;
    border-top: 0 none;
    align-items: center;
    font-weight: 400;
    justify-content: space-between;
    background-color: #f4f4f5;
    margin-bottom: -10px;
}
.style-mypageOrders-toparea dl {
    margin: 0;
    display: flex;
    padding: 0;
    align-items: center;
    color: rgba(60, 60, 67, 0.6) !important;
}
.style-mypageOrders-toparea dl:last-child dt {
    display: none;
}
.style-mypageOrders-toparea .mypageOrders-delivery {
    display: flex;
    font-weight: 500;
}
.style-mypageOrdersLst {
    border-top: 0 none;
    margin-bottom: 10px;
    background-color: #f4f4f5;
    overflow: hidden;
    font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,"Malgun Gothic","맑은 고딕",돋움,Dotum,sans-serif;
}
.style-mypageOrdersLst li {
    /*border-top: 1px solid #cfcfd0;
    border-bottom: 1px solid #cfcfd0;*/
    margin-top: 10px;
    background-color: #fff;
}
.style-mypageOrdersLst li:first-child {
    border-top: 0 none;
    margin-top: 0;
}
.style-mypageOrdersLst li:last-child {
    border-bottom: 0 none;
}
.style-mypageOrdersLst-header {
    margin: 0;
    display: flex;
    padding: 16px 16px 17px;
    position: relative;
    font-size: 1.6rem;
    align-items: center;
    font-weight: 500;
    justify-content: space-between;
}
.style-mypageOrdersLst-header:before {
    left: 10px;
    width: calc(100% - 20px);
    bottom: 0;
    height: 1px;
    content: "";
    position: absolute;
    background-color: #F0F0F0;
}
.style-mypageOrdersLst-header .date {
    display: flex;
    flex-direction: row;
}
.style-mypageOrdersLst-header button {
    color: #0073e9;
    font-size: 1.4rem;
    font-weight: 400;
    font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,"Malgun Gothic","맑은 고딕",돋움,Dotum,sans-serif;
}
.style-mypageOrdersLst-header button svg {
    width: auto;
    height: 14px;
}
.style-mypageOrdersLst-header button path {
    fill: #0073e9;;
}
.style-mypageOrdersLst-inner {
    padding: 16px;
}
.style-mypageOrdersLst-state {
    font-weight: 500;
    margin-bottom: 10px;
}
.style-mypageOrdersLst-item {
    display: flex;
    overflow: hidden;
    position: relative;
    border-bottom: 1px solid #F0F0F0;
}
.style-mypageOrdersLst-item:last-child {
    border: none !important;
}
.style-mypageOrdersLst-item-thumbnail {
    height: 84px;
    display: inline-block;
}
.style-mypageOrdersLst-item-thumbnail div {
    width: 84px;
    height: 84px;
    overflow: hidden;
    position: relative;
    flex-grow: 0;
    flex-basis: 84px;
    flex-shrink: 0;
    border-radius: 4px;
}
.style-mypageOrdersLst-item-thumbnail div img {
    width: 84px;
    height: 84px;
    object-fit: cover;
}
.style-mypageOrdersLst-item-detail {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    padding-left: 8px;
    flex-direction: column;
}
.style-mypageOrdersLst-item-info {
    padding: 0 0 6px 0;
    min-height: 60px;
}
.style-mypageOrdersLst-item-info a {
    color: inherit;
    text-decoration: none;
}
.style-mypageOrdersLst-item-info h3 {
    width: 100%;
    margin: 0;
    display: -webkit-box;
    overflow: hidden !important;
    position: relative;
    font-size: 1.3rem;
    max-height: 18px;
    text-align: left;
    font-weight: 400;
    line-height: 1.5;
    white-space: pre-wrap;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
}
.style-mypageOrdersLst-item-info .price {
    font-size: 1.3rem;
    font-family: Pretendard,sans-serif;
    font-weight: 700 !important;
    padding-top: 3px;
}
.style-mypageOrdersLst-item-info .quantity {
    color: rgba(60, 60, 67, 0.6);
    font-size: 13px;
    margin-top: 5px;
    display: flex;
    align-items: center;
}
.style-mypageOrdersLst-item-info .style-form-select {
    margin: 0 5px;
    background-size: 10px 10px;
    border-radius: 4px;
    padding: 2px 10px 2px 5px;
    width: 55px;
}
.style-mypageOrdersLst-item-info .option {
    color: rgba(60, 60, 67, 0.6);
    font-size: 13px;
    margin-top: 4px;
}
.style-mypageOrders-article-inner .style-mypageOrdersLst-item {
    padding: 16px 0;
}
.style-mypageOrders-article-inner .style-mypageOrdersLst-item:first-child {
    padding-top: 0;
}
.style-mypageOrders-article-inner .style-mypageOrdersLst-item:last-child {
    padding-bottom: 0;
    border: none !important;
}
.style-mypageOrders-article-inner .style-mypageOrdersLst-item-detail h3 {
    font-weight: 700;
}
.style-mypageOrders-article-inner .style-mypageOrdersLst-item-info div {
    color: #787878;
    font-size: 1.2rem;
    margin-top: 0;
    font-weight: 600;
}
.style-mypageOrders-article-inner .style-mypageOrdersLst-item-info .price {
    text-align: right;
    font-size: 1.6rem !important;
    font-weight: 600 !important;
    color: var(--color-gray-900) !important;
    position: absolute;
    bottom: 16px;
    right: 0;
}
.style-mypageOrders-article-inner .style-mypageOrdersLst-item-info .option {
    font-weight: 400;
}
.style-mypageOrdersLst-button {
    padding: 0 16px 16px;
}
.style-mypageOrders-article-btn {
    margin-top: 25px;
}
.style-mypageOrders-article-btn button span {
    font-weight: 400;
}
.style-exchange-qnaList {
    margin: 0;
}
.style-exchange-qnaList li {
    margin: 0;
    padding: 16px;
    list-style: none;
    border-bottom: 1px solid #F0F0F0;
    background-color: #fff;
}
.style-exchange-qnaList li:last-child {
    border-bottom: 0;
}
.style-exchange-qnaList .qnaList-date {
    color: rgba(60, 60, 67, 0.6);
    padding: 4px 0;
    font-size: 1.2rem;
}
.style-exchange-qnaList .qnaList-title {
    margin: 0;
    padding: 0 0 12px 0;
    font-size: 1.8rem;
    font-weight: 700;
}
.style-exchange-qnaList .qnaList-text {
    padding-top: 14px;
}
/* 종료: 마이페이지 > 주문배송 */

/* 시작: 마이페이지 > 회원등급안내 */
.style-membership {

}
.style-membership-inner {
    padding: 16px;
}
.style-membership-title {
    padding: 4px 0 20px;
    font-size: 1.8rem;
    font-family: Pretendard,sans-serif;
    font-weight: 700;
}
.style-membership-title strong {
    color: #A647E3;
}
.style-membership-DigitRoll {
    width: 100%;
    display: flex;
    padding: 21px 20px 15px;
    flex-wrap: wrap;
    border-radius: 8px;
    justify-content: center;
    background-color: #FAFAFA;
}
.digitRoll-text {
    width: 100%;
    display: flex;
    line-height: 1.5;
    justify-content: center;
}
.digitRoll-count {
    color: #A647E3;
    width: 100%;
    display: flex;
    font-weight: 700;
    line-height: 1.5;
    padding-top: 2px;
    justify-content: center;
}
.digitRoll-progressBar {
    width: 100%;
    margin-top: 16px;
}
.digitRoll-progressBar-text {
    color: #A1A1A1;
    width: 100%;
    display: flex;
    font-size: 1.2rem;
    line-height: 1.5;
    padding-top: 6px;
    justify-content: space-between;
}
.membership-progressBar {
    width: 100%;
}
.membership-progress-root {
    height: 10px;
    border-radius: 10px;
    background-color: #eeeeef;
    overflow: hidden;
    position: relative;
}
.membership-Progress-bar {
    top: 0;
    left: 0;
    width: 0;
    bottom: 0;
    position: absolute;
    border-radius: 10px;
    transform-origin: left;
    background: var(--color-mainColor);
    -webkit-transition: 2s width cubic-bezier(0.6, 0.4, 0.4, 1.1);
    transition: 2s width cubic-bezier(0.6, 0.4, 0.4, 1.1);
}
.style-membership-grade {
    width: 100%;
    padding-top: 20px;
}
.membership-grade {
    gap: 2px;
    margin: 0;
    display: flex;
    padding: 26px 0 0 0;
    align-items: flex-end;
    justify-content: space-between;
}
.membership-grade li {
    width: 100%;
    max-width: 80px;
    list-style: none;
}
.membership-grade .gradeBox {
    width: 100%;
    max-width: 80px;
}
.membership-grade .grade-img {
    display: flex;
    justify-content: center;
}
.membership-grade .grade-img svg {
    width: auto;
    height: 44px;
}
.membership-grade .grade-txtBox {
    color: #9523DC;
    display: flex;
    padding: 14px 3px 8px;
    font-size: 1rem;
    margin-top: -14px;
    text-align: center;
    align-items: center;
    border-radius: 6px;
    flex-direction: column;
    letter-spacing: -0.07em;
    justify-content: space-between;
    background-color: #FDE5FF;
}
.membership-grade .grade-txtBox .grade-txt {

}
.membership-grade .grade-txtBox .grade-price {
    font-family: Pretendard,sans-serif;
    font-weight: 700;
    padding-top: 13px;
    letter-spacing: -0.04em;
}
.membership-grade .grade-txtBox.color2 {
    background-color: #F7BDFE;
}
.membership-grade .grade-txtBox.color2 .grade-price {
    padding-top: 26px;
}
.membership-grade .grade-txtBox.color3 {
    color: #fff;
    background-color: #A647E3;
}
.membership-grade .grade-txtBox.color3 .grade-price {
    padding-top: 53px;
}
.membership-grade .grade-txtBox.color4 {
    color: #fff;
    background-color: #8423D6;
}
.membership-grade .grade-txtBox.color4 .grade-price {
    padding-top: 103px;
}
.style-membership-gradeType {
    gap: 6px;
    margin: 0;
    display: flex;
    padding: 26px 0 0 0;
    font-family: Pretendard,sans-serif;
    flex-direction: column;
}
.style-membership-gradeType > li {
    border: 1px solid #F0F0F0;
    display: flex;
    padding: 16px 0 16px 16px;
    list-style: none;
    align-items: center;
    border-radius: 8px;
    justify-content: space-between;
}
.style-membership-gradeType > li.active {
    border-color: #000000;
}
.style-membership-gradeType .gradeType-title {
    gap: 2px;
    display: flex;
    font-size: 1.6rem;
    font-weight: 700;
    flex-direction: column;
}
.style-membership-gradeType .gradeType-price {
    color: #A647E3;
    font-size: 1.2rem;
    font-weight: 500;
}
.style-membership-gradeType ul {
    gap: 4px;
    color: #454545;
    width: 170px;
    margin: 0;
    display: flex;
    padding: 0;
    position: relative;
    flex-grow: 0;
    font-size: 1.4rem;
    flex-shrink: 0;
    padding-left: 16px;
    flex-direction: column;
}
.style-membership-gradeType ul:before {
    top: 50%;
    left: 0;
    width: 1px;
    height: 42px;
    content: "";
    display: block;
    position: absolute;
    transform: translateY(-50%);
    background-color: #F0F0F0;
}
.style-membership-gradeType ul li {
    gap: 6px;
    display: flex;
    list-style: none;
    align-items: center;
    letter-spacing: -0.03em;
}
.style-membership-gradeType ul li svg {
    width: auto;
    height: 18px;
}
.style-membership-gradeType ul li svg path {
    fill: #8D8D8D;
}
.style-membership-notandum {
    width: calc(100% + 32px);
    padding: 24px 16px 40px;
    margin-top: 30px;
    margin-left: -16px;
    background-color: #FAFAFA;
}
.style-notandum-title {
    color: #646464;
    margin: 0;
    padding: 0;
    font-size: 1.4rem;
    font-weight: 700;
    line-height: 1.5;
}
.style-membership-list {
    gap: 8px;
    margin: 0;
    display: flex;
    padding: 16px 0 0 0;
    flex-wrap: wrap;
    list-style: none;
    line-height: 1.4;
}
.style-membership-list li {
    color: #646464;
    width: 100%;
    margin: 0;
    display: flex;
    padding: 0 0 0 20px;
    position: relative;
    flex-wrap: wrap;
    font-size: 1.2rem;
}
.style-membership-list li:before {
    top: 7px;
    left: 6px;
    width: 4px;
    height: 4px;
    content: "";
    display: block;
    position: absolute;
    border-radius: 50%;
    background-color: #C0C0C0;
}
/* 종료: 마이페이지 > 회원등급안내 */

/* 시작: 마이페이지 > 반려동물 관리 */
.mypage-pet .style-profile-photoInput {
    margin: 20px auto 4px;
}
.mypage-pet .style-profile-photoInput-image {
    background-color: #f8f8f8;
}
.style-mypagePet-menu li a {
    display: flex;
    gap: 10px;
    padding: 16px 0;
    line-height: 1;
    align-items: center;
    border-bottom: 1px solid #F0F0F0;
}
.style-mypagePet-menu li a svg {
    width: auto;
    height: 14px;
    margin-left: auto;
}
.style-mypagePet-menu li a svg path {
    fill: var(--color-gray-650);
}
.style-mypagePet-menu li strong {
    display: block;
}
.style-mypagePet-menu li span {
    display: block;
    padding-top: 6px;
    color: var(--color-gray-650);
}
.style-mypagePet-delbox {
    display: flex;
    padding-top: 20px;
}
.style-mypagePet-del {
    color: var(--color-gray-500);
    text-decoration: underline;
}
.style-mypagePet {
    padding: 0 16px 24px;
}
.style-mypagePet-form {

}
.style-mypagePet .style-mypagePet-progress {
    padding: 12px 0 0;
}
.style-mypagePet .style-mypagePet-form h2 {
    font-weight: 700;
    font-size: 24px;
    padding-bottom: 16px;
    margin-top: 24px;
}
.style-mypagePet .style-mypagePet-form h2 span {
    color: var(--color-mainColor);
}
.style-mypagePet .style-mypagePet-form-subTitle {
    margin-top: -8px;
    font-size: 14px;
}
.style-mypagePet-form .style-profile-photoInput {
    width: 120px;
    height: 120px;
}
.style-mypagePet-form .style-profile-photoInput-image {
    background-color: #f8f8f8;
}
.style-mypagePet-form .style-profile-photoInput-image path {
    fill: #f8f8f8;
}
.style-mypagePet-searchBar {
    width: 100%;
    height: 52px;
    color: inherit;
    font-size: 1.6rem;
    line-height: 1;
    cursor: text;
    display: inline-flex;
    position: relative;
    box-sizing: border-box;
    align-items: center;
    font-weight: 400;
    border: 1px solid var(--color-gray-400);
    border-radius: 6px;
    margin: 0 !important;
    flex-direction: inherit !important;
}
.style-mypagePet-searchBar .style-searchBar {
    padding: 17px 70px 16px 20px;
    caret-color: #A647E3;
    width: 100%;
    -webkit-appearance: none;
    font: inherit;
    color: currentColor;
    border: 0;
    height: 1.1876em;
    margin: 0;
    display: block;
    min-width: 0;
    background: none;
    box-sizing: content-box;
    animation-name: mui-auto-fill-cancel;
    letter-spacing: inherit;
    animation-duration: 10ms;
    -webkit-tap-highlight-color: transparent;
}
.style-mypagePet-searchBar .style-searchBar:focus {
    outline:none;
}
.style-searchBar::placeholder {
    color: var(--color-gray-500);
}
.style-mypagePet-searchBar .style-searchBar-button {
    right: 10px;
    padding: 9px 10px;
    top: 0;
    height: 100%;
    position: absolute;
    align-items: center;
    justify-content: center;
}
.style-mypagePet-searchBar .style-searchBar-button svg path {
    fill: var(--color-gray-500);
}
.style-mypagePet .style-fixed-bottom-content {
    display: flex;
    width: 100%;
    gap: 10px;
}
.style-mypagePet-searchLay {
    padding: 0 16px 16px;
}
.style-mypagePet-searchList {
    margin: 12px 0 0;
    max-height: calc(100vh - 350px);
    overflow-y: auto;
}
.style-mypagePet-searchList button {
    padding: 10px 20px;
    font-size: 1.6rem;
    text-align: left;
    font-weight: 400;
    border-radius: 0;
    justify-content: flex-start;
    display: flex;
    width: 100%;
}
.style-mypagePet-empty {
    background-color: #f4f4f5;
    border-radius: 6px;
    padding: 16px;
    font-size: 1.4rem;
    color: var(--color-gray-700);
}
.style-mypagePet-empty h4 {
    font-size: 1.5rem;
    font-weight: 700;
}
.style-mypagePet-empty a {
    text-decoration: underline;
    color: var(--color-gray-900);
}
.style-mypagePet-input {
    position: relative;
}
.style-mypagePet-input .style-form-input {
    padding-right: 50px;
}
.style-mypagePet-input .style-form-input-text {
    position: absolute;
    top: 0;
    right: 20px;
    text-align: right;
    align-items: center;
    height: 52px;
    display: flex;
}
.style-mypagePet-button {
    display: flex;
    gap: 10px;
}
.style-mypagePet-button button {
    width: 100%;
    font-size: 1.5rem;
}
.style-mypagePet-button ul {
    margin-right: -5px;
    margin-left: -5px;
}
.style-mypagePet-button li {
    float: left;
    width: calc(25% - 10px);
    margin: 0 5px 10px;
}
.style-mypagePet-button .active {
    border-color: var(--color-mainColor) !important;
    color: var(--color-mainColor) !important;
}
/* 종료: 마이페이지 > 반려동물 관리 */


/* 시작: 마이페이지 > 쿠폰 */
.style-coupon-list-article {
    padding: 16px;
}

.style-coupon-list {
    width: 100%;
    gap: 16px;
    margin: 0;
    display: flex;
    list-style: none;
    overflow-y: auto;
    flex-direction: column;
}
.style-coupon-list li {
    width: 100%;
    border: 1px solid #E3E3E3;
    height: auto;
    padding: 20px;
    list-style: none;
    font-family: Pretendard,sans-serif;
    border-radius: 8px;
}
.style-coupon-list li .couponSelect {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.style-coupon-list li .couponSelecttext {
    width: 100%;
    padding-right: 16px;
}
.style-coupon-list li .coupon-title {
    display: flex;
    font-size: 2.8rem;
    align-items: flex-end;
    line-height: 1.2;
    color: #A647E3;
    font-weight: 700;
    letter-spacing: -0.02em;
}
.style-coupon-list li .coupon-stext {
    width: 100%;
    min-height: 46px;
    align-items: center;
    padding-top: 12px;
}
.style-coupon-list li .coupon-stext .text {
    width: 100%;
    flex-wrap: wrap;
    align-items: center;
    color: #000;
    font-size: 1.5rem;
    word-break: break-all;
    line-height: 1.4;
}
.style-coupon-list li .coupon-stext .stext {
    color: #787878;
    font-size: 1.2rem;
    word-break: break-all;
    line-height: 1.5;
    padding-top: 2px;
}
.style-coupon-list li .coupon-stext .stext .expire {
    color: #C10000;
}
.style-coupon-list li .couponSelect-button {
    width: 24px;
    border: 1px solid #E3E3E3;
    height: 24px;
    display: flex;
    align-items: center;
    flex-shrink: 0;
    border-radius: 50%;
    justify-content: center;
}
.style-coupon-list li .couponSelect-button svg {
    width: 18px;
    height: auto;
}
.style-coupon-list li .couponSelect-button svg path {
    fill: #fff;
    stroke: #fff;
}
.style-coupon-list .couponSelect.active .couponSelect-button {
    border-color: #A647E3;
    background-color: #A647E3;
}

.style-coupon-list2 {
    width: 100%;
    gap: 10px;
    margin: 0;
    display: flex;
    list-style: none;
    overflow-y: auto;
    flex-direction: column;
}
.style-coupon-list2 li {
    width: 100%;
    border: 1px solid #E3E3E3;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 16px 20px;
    /*align-items: center;*/
    align-self: stretch;
    border-radius: 8px;
    position: relative;
}
.style-coupon-list2 li .couponSelect {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.style-coupon-list2 li .couponSelect2 {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.style-coupon-list2 li .couponSelecttext {
    width: 100%;
    padding-right: 16px;
}
.style-coupon-list2 li .coupon-title {
    display: flex;
    font-size: 18px;
    align-items: flex-end;
    line-height: 1.2;
    color: #D40022;
    font-weight: 700;
    letter-spacing: -0.02em;
}
.style-coupon-list2 li .coupon-stext {
    width: 100%;
    min-height: 46px;
    align-items: center;
    padding-top: 8px;
}
.style-coupon-list2 li .coupon-stext .text {
    width: 100%;
    flex-wrap: wrap;
    align-items: center;
    color: #000;
    font-size: 13px;
    word-break: break-all;
    line-height: 1.4;
    font-weight: 600;
}
.style-coupon-list2 li .coupon-stext .stext {
    color: #787878;
    font-size: 13px;
    word-break: break-all;
    line-height: 1.5;
    padding-top: 2px;
}
.style-coupon-list2 li .coupon-stext .stext .expire {
    color: #C10000;
}
.style-coupon-list2 li .couponDown-button {
    display: flex;
    height: 21px;
    padding: 3px 6px;
    align-items: center;
    gap: 1px;
    background: #000;
    border-radius: 4px;
    font-size: 11px;
    color: #fff;
    position: absolute;
    top: 16px;
    right: 20px;
}
.style-coupon-list2 li .couponDown-button svg {
    width: 10px;
    height: auto;
}
.style-coupon-list2 li .couponDownOk-button {
    display: flex;
    height: 21px;
    padding: 3px 6px;
    align-items: center;
    gap: 1px;
    background: #F0F0F0;
    border-radius: 4px;
    font-size: 11px;
    color: #757575;
    position: absolute;
    top: 16px;
    right: 20px;
}
.style-coupon-list2 li .couponDownOk-button svg {
    width: 9px;
    height: auto;
}

.style-coupon-list2 li .couponSelect-button {
    width: 24px;
    border: 1px solid #E3E3E3;
    height: 24px;
    display: flex;
    align-items: center;
    flex-shrink: 0;
    border-radius: 50%;
    justify-content: center;
}
.style-coupon-list2 li .couponSelect-button svg {
    width: 18px;
    height: auto;
}
.style-coupon-list2 li .couponSelect-button svg path {
    fill: #fff;
    stroke: #fff;
}

.style-coupon-list2 .couponSelect.active .couponSelect-button {
    border-color: #000;
    background-color: #000;
}

.style-coupon-list2 .couponSelect2.active .couponSelect-button {
    border-color: #000;
    background-color: #000;
}

.style-coupon-list.couponSelect.active .couponSelect-button {
    border-color: #A647E3;
    background-color: #A647E3;
}


.couponSelect-disabled {
    cursor: not-allowed;
    background: #FAFAFA;
}
.couponSelect-disabled .coupon-title {
    color: #C0C0C0 !important
}
.couponSelect-disabled .coupon-stext .text {
    color: #C0C0C0 !important
}
.couponSelect-disabled .coupon-stext .stext {
    color: #C0C0C0 !important
}
.couponSelect-disabled .couponSelect-button {
    background: none !important;
}
.couponSelect-disabled .couponSelect.active .couponSelect-button {
    border: 1px solid #E3E3E3;
    background: none !important;
}
.couponSelect-disabled .couponSelect.active .couponSelect-button path {
    fill: #FAFAFA;
    stroke: #FAFAFA;
}
.couponSelect-disabled .coupon-stext .stext .expire {
    color: #C0C0C0 !important
}
.couponProducts-button {
    gap: 2px;
    width: 100%;
    display: flex;
    font-size: 1.4rem;
    align-items: center;
    font-family: Pretendard,sans-serif;
    padding-top: 16px;
    margin: 16px 0 -4px;
    border-top: 1px solid #F0F0F0;
}
.couponProducts-button svg {
    width: auto;
    height: 12px;
}
.couponProducts-button svg path {
    stroke: #000000;
}
.style-coupon-list li .couponDown {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.style-coupon-list li .couponDown-button {
    color: #646464; /* #646464 */
    width: 42px;
    height: 42px;
    display: flex;
    font-size: 1.2rem;
    align-items: center;
    flex-shrink: 0;
    font-family: Pretendard,sans-serif;
    border-radius: 50%;
    flex-direction: column;
    justify-content: center;
    background-color: #A647E3; /* #A647E3 */
}
.couponDown-disabled {
    cursor: not-allowed;
    background: #FAFAFA;
}
.couponDown-disabled .coupon-title {
    color: #C0C0C0 !important
}
.couponDown-disabled .coupon-stext .text {
    color: #C0C0C0 !important
}
.couponDown-disabled .coupon-stext .stext {
    color: #C0C0C0 !important
}
.couponDown-disabled .coupon-stext .expire {
    color: #C0C0C0 !important
}
.couponDown-disabled .couponDown-button {
    background: none !important;
}

.couponDown-issued {
    cursor: not-allowed;
}
.couponDown-issued .coupon-title {
}
.couponDown-issued .coupon-stext .text {
}
.couponDown-issued .coupon-stext .stext {
}
.couponDown-issued .coupon-stext .expire {
}
.couponDown-issued .couponDown-button {
    background: none !important;
}

.style-couponProducts-top {
    display: flex;
    line-height: 19px;
    margin-bottom: 19px;
    justify-content: space-between;
    padding: 0 16px;
}
.style-couponProducts-top ul {
    width: 100%;
    padding: 16px 0;
    border-bottom: 1px solid #F0F0F0;
}
.style-couponProducts-top li {
    color: #646464;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.5;
}
.style-couponProducts-top li.discount {
    color: #A647E3;
    font-size: 25px;
    font-weight: 700;
    line-height: 30px;
    letter-spacing: -0.02em;
    margin-bottom: 5px;
}
.style-couponProducts-top li.txt {
    font-size: 14px;
    font-weight: 700;
    line-height: 17px;
    letter-spacing: -0.02em;
    color: #000000;
    margin-bottom: 5px;
}
.style-couponProducts-top li.date {
    color: #A1A1A1;
    font-size: 12px;
    font-weight: 700;
    line-height: 17px;
}
/* 종료: 마이페이지 > 쿠폰 */

/* 시작: 마이페이지 > 구매후기 */
.style-reviews {
    padding: 16px;
}
.style-reviews.bg {
    flex: 1 1 0;
    width: 100%;
    display: flex;
    padding: 0;
    flex-direction: column;
    background-color: #F6F6F6;
}
.style-reviews.bgnone {
    flex: 1 1 0;
    width: 100%;
    display: flex;
    padding: 0;
    flex-direction: column;
}
.style-reviews-article {
    background: #fff;
    margin-top: 10px;
    padding: 16px;
}
.style-reviews-article:first-child {
    margin-top: 0;
}
.style-reviews-list-article {
    margin-top: -16px;
}
.style-reviews-item {
    overflow: hidden;
    position: relative;
    border-bottom: 1px solid #F0F0F0;
    padding: 16px 0;
}
.style-reviews-item:last-child {
    border: none !important;
}
.style-reviews-item-inner {
    display: flex;
}
.style-reviews-item-thumbnail {
    height: 95px;
    display: inline-block;
}
.style-reviews-item-thumbnail div {
    width: 95px;
    height: 95px;
    overflow: hidden;
    position: relative;
    flex-grow: 0;
    flex-basis: 95px;
    flex-shrink: 0;
    border-radius: 4px;
}
.style-reviews-item-thumbnail div img {
    width: 95px;
    height: 95px;
    object-fit: cover;
}
.style-reviews-image {
    background-color: #f8f8f8;
}
.style-reviews-item-detail {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    padding-left: 12px;
    flex-direction: column;
}
.style-reviews-item-info {
    display: flex;
    position: relative;
    align-items: flex-start;
    flex-direction: column;
}
.style-reviews-item-info a {
    color: inherit;
    text-decoration: none;
}
.style-reviews-item-info .cash {
    gap: 3px;
    display: flex;
    align-items: center;
    line-height: 1;
    margin-bottom: 5px;
}
.style-reviews-item-info .cash img {
    width: 24px;
    height: 24px;
    margin: -2px 1px 0 0px;
}
.style-reviews-item-info h3 {
    width: 100%;
    margin: 0;
    display: -webkit-box;
    overflow: hidden !important;
    position: relative;
    font-size: 1.3rem;
    max-height: 40px;
    text-align: left;
    font-weight: 700;
    line-height: 1.4;
    white-space: pre-wrap;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}
.style-reviews-item-info .option {
    color: rgba(60, 60, 67, 0.6);
    font-size: 13px;
    margin-top: 4px;
}
.style-reviews-item-info .date {
    color: rgba(60, 60, 67, 0.6);
    font-size: 13px;
    margin-top: 8px;
}
.style-reviews-write {
    width: 100%;
    margin-top: 12px;
    font-weight: 400 !important;
    color: var(--color-gray-700) !important;
}
.style-reviews .style-reviews-form {
}
.style-reviews .style-reviews-form h2 {
    font-weight: 700;
    font-size: 24px;
    padding-bottom: 16px;
}
.style-reviews-cashBox {
    background-color: #F6F6F6;
    padding: 12px;
    text-align: center;
    border-radius: 4px;
    margin-bottom: 16px;
}
.style-reviews-cashBox img {
    width: 24px;
    height: 24px;
    margin: -2px 1px 0 0px;
}
.style-reviewWrite {
    text-align: center;
    padding-top: 20px;
}
.style-reviewWrite h3 {
    margin: 0;
    font-size: 1.6rem;
    text-align: center;
    font-weight: 500;
}
.style-reviewWrite-star {
    display: flex;
    justify-content: center;
    padding: 12px 0 20px;
}
.style-reviews .style-reviews-article:first-child .style-reviews-item {
    margin-bottom: -16px;
    margin-top: -16px;
}
.style-reviews .style-imageUploader {
    margin-left: 0;
    margin-bottom: 16px;
}
.style-reviews .style-imageUploader swiper-slide:first-child {
    margin-left: -16px;
}
.style-reviews .style-mypage-petList {
    /*padding: 0;*/
}
.style-reviews .style-mypage-petList {
    margin: 20px 0;
}
.style-reviews .style-mypage-petList h3 {
    margin: 0 0 5px;
    font-size: 1.6rem;
    font-weight: 500;
}
.style-mypage-reviewBox {
    margin-top: 16px;
}
.cashImg {
    position: absolute;
    top: -100px;
    left: 0;
    right: 0;
    margin: auto;
    width: 244px;
}
.cashImg img {
    width: 100%;
    height: auto;
}
.style-modal-cash {
    max-width: calc(330px + 32px) !important;
}
.style-modal-cash .modal-content {
    overflow: inherit !important
}
.cashTitle {
    margin-top: 40px;
    font-size: 30px;
    font-weight: 400;
    text-align: center;
}
.cashText {
    text-align: center;
}
.cash-count {
    display: flex;
    background-color: #F6F6F6;
    border-radius: 4px;
    padding: 12px;
    margin-top: 10px;
    align-items: center;
    justify-content: space-between;
}
.cash-count .txt {
    color: var(--color-gray-700);
}
.cash-count .count {
    color: var(--color-gray-700);
}
.cash-count .odometer {
    font-weight: 700;
    color: var(--color-gray-900);
}
.odometer.odometer-auto-theme {
    font-family: Pretendard, -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,"Malgun Gothic","맑은 고딕",돋움,Dotum,sans-serif !important;
}
.style-modal-cash button {
    color: var(--color-mainColor) !important;
}
/* 종료: 마이페이지 > 구매후기 */

/* 시작: 마이페이지 > 좋아요, 자주구매, 최근본 */
.style-mypageProduct .style-itemList {

}
.style-mypageProduct-top {
    width: 100%;
    height: 49px;
    display: flex;
    padding: 0;
    position: relative;
    font-size: 1.2rem;
    box-sizing: border-box;
    align-items: center;
    background-color: #fff;
}
.mypageProduct-brand {
    width: 100%;
}
.mypageProduct-brand .inner {
    width: 100%;
    display: flex;
    padding: 18px 16px 18px;
    align-items: center;
    justify-content: space-between;
}
.mypageProduct-brand .brandLink {
    color: #000;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    text-decoration: none;
}
.mypageProduct-brand .brand-thumbnail {
    width: 56px;
    height: 56px;
    flex-shrink: 0;
}
.mypageProduct-brand .brand-thumbnail .thumbnail {
    border: 1px solid #F0F0F0;
    border-radius: 50%;
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
    position: relative;
}
.mypageProduct-brand .brand-thumbnail .thumbnail img {
    top: -1px;
    left: -1px;
    width: calc(100% + 2px);
    height: calc(100% + 2px);
    max-width: calc(100% + 2px);
    right: 0;
    bottom: 0;
    overflow: hidden;
    position: absolute;
    object-fit: cover;
}
.mypageProduct-brand .brand-text {
    font-size: 2.3rem;
    font-family: Pretendard,sans-serif;
    font-weight: 600;
    line-height: 1.4;
    padding-left: 9px;
}
.mypageProduct-brand .brandLike-button {
    width: 28px;
    height: 28px;
}
.mypageProduct-brand .brandLike-button svg {
    fill: none;
}
.mypageProduct-brand .brandLike-button.like svg {
    fill: #EA333E;
    width: 28px;
    height: 28px;
}
.mypageProduct-brand .brandLike-button.like path {
    stroke: #EA333E;
}
.style-mypageProduct-inner {
    margin-bottom: 16px;
}
.style-mypageProduct swiper-slide {
    width: 156px;
    margin-right: 8px;
}
.style-mypageProduct swiper-slide:first-child {
    margin-left: 16px;
}
.style-mypageProduct swiper-slide:last-child {
    margin-right: 16px;
}
/* 종료: 마이페이지 > 좋아요, 자주구매, 최근본 */

/* 시작: 마이페이지 > 체험단 내역 */
.style-mypageExperience {
    padding: 16px;
}
.style-experienceList {
    display: flex;
    flex: 1 1 0;
    width: 100%;
    flex-direction: column;
    background-color: transparent;
}
.style-experienceList ul {
    margin: -16px 0 0 0;
    padding: 0;
    list-style: none;
}
.style-experienceList li {
    gap: 12px;
    margin: 0;
    display: flex;
    padding: 16px 0;
    align-items: flex-start;
}
.style-experienceList .style-experienceList-thumbnail {
    width: 84px;
    height: 84px;
    overflow: hidden;
    flex-shrink: 0;
    border-radius: 6px;
    background-color: #F6F6F6;
}
.style-experienceList .style-experienceList-info {
    width: calc(100% - 84px);
}

.style-experienceList .thumbnail {
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
    position: relative;
}
.style-experienceList .thumbnail img {
    object-fit: contain;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    bottom: 0;
    height: 100%;
    overflow: hidden;
    position: absolute;
}
.style-experienceList .experienceList-title {
    color: #787878;
    margin: 0;
    padding: 0 0 8px 0;
    font-weight: 400;
}
.style-experienceList .experienceList-text {
    margin-bottom: 8px;
}
/* 종료: 마이페이지 > 체험단 내역 */

/* 시작: 마이페이지 > 안내 */
.style-instruction {
    width: 100%;
    padding: 24px 16px 30px;
    background-color: #FAFAFA;
}
.style-instruction h4 {
    color: #646464;
    margin: 0;
    padding: 0;
    font-size: 1.4rem;
    font-weight: 700;
    line-height: 1.5;
    margin-bottom: 10px;
}
.style-folding-instruction {
    width: 100%;
    background-color: #FAFAFA;
    border-radius: 4px;
    color: var(--color-gray-650);
    font-size: 1.2rem;
    flex-direction: column;
    position: relative;
}
.style-folding-instruction #foldingOpen {
    display: flex;
    min-height: 48px;
    align-items: center;
    padding: 16px;
    cursor: pointer;
    font-size: 1.5rem;
    color: var(--color-gray-900);
}
.style-folding-instruction #foldingOpen div {
    display: flex;
    flex-grow: 1;
}
.style-folding-instruction #foldingOpen svg {
    width: 25px;
    height: 25px;
    transition: all ease 0.3s;
}
.style-folding-instruction #foldingOpen.open svg {
    transform: rotate(180deg);
}
.style-folding-detail {
    height: 0;
    overflow: hidden;
}
.style-folding-detail.open {
    height: auto;
}
.style-folding-detail-inner {
    padding: 0 16px 16px;
}
.style-folding-instruction ul {
    color: var(--color-gray-650);
}
/* 종료: 마이페이지 > 안내 */

/* 시작: 마이페이지 > 고객센터 */
.style-mypageCs {
    flex: 1 1 0;
    width: 100%;
    display: flex;
    padding: 0;
    flex-direction: column;
    background-color: #F6F6F6;
}
.style-mypageCs-article {
    padding: 16px;
    border-top: 1px solid #cfcfd0;
    border-bottom: 1px solid #cfcfd0;
    margin-bottom: 10px;
    background-color: #fff;
}
.style-mypageCs-article.nopd {
    padding: 0;
}
.style-mypageCs-article:first-child {
    border-top: none;
}
.style-mypageCs-guide {
    text-align: center;
    align-items: center;
    align-items: center;
}
.style-mypageCs-guide dl {
    padding: 12px 12px 12px 75px;
    position: relative;
    background-color: #FAFAFA;
    border-radius: 6px;
    display: inline-block;
    margin: 10px 0;
}
.style-mypageCs-guide dt {
    position: absolute;
    top: 12px;
    left: 12px;
}
.style-mypageCs-guide dd {
    text-align: left;
    font-size: 1.3rem;
}
.style-mypageCs-guide .text {
    margin: 0;
    font-size: 1.4rem;
    font-weight: 500;
}
.style-mypageCs-button {
    width: calc(100% + 8px);
    margin: 26px 0 0 -4px;
    display: flex;
    justify-content: space-between;
}
.style-mypageCs-button a {
    width: 100%;
    border: 1px solid #c4c4c6;
    height: 76px;
    margin: 0 4px;
    display: flex;
    border-radius: 4px;
    flex-direction: column;
}
.style-mypageCs-button a svg {
    width: 24px;
    height: 24px;
}
.style-mypageCs-button a .text {
    font-size: 1.2rem;
    font-weight: 700;
    margin-top: 3px;
}
.style-mypageCs-search {

}
.style-mypageCs-search form {
    display: flex;
}
.mypageCs-search-bar {
    color: inherit;
    width: 100%;
    height: 36px;
    padding: 0;
    font-size: 1.6rem;
    cursor: text;
    display: inline-flex;
    position: relative;
    box-sizing: border-box;
    align-items: center;
    font-weight: 400;
}
.mypageCs-search-bar input {
    width: 100%;
    height: 16px;
    padding: 10px;
    font-size: 1.6rem;
    border-radius: 10px 0 0 10px;
    background-color: #f4f4f5;
    -webkit-appearance: none;
    font: inherit;
    color: currentColor;
    border: 0;
    margin: 0;
    display: block;
    min-width: 0;
    box-sizing: content-box;
    letter-spacing: inherit;
    animation-duration: 10ms;
}
.style-mypageCs-search button {
    width: 36px;
    height: 36px;
    padding: 0;
    align-items: center;
    border-left: 1px solid #ebebeb;
    border-radius: 0 10px 10px 0;
    justify-content: center;
    background-color: #f4f4f5;
}
.style-mypageCs-search button span {
    width: 100%;
    display: flex;
    align-items: inherit;
    justify-content: inherit;
}
.style-mypageCs-search button svg {
    width: 20px !important;
    height: 20px !important;
}
.style-mypageCs-contText {
    padding: 0 16px 10px;
    border-bottom: 1px solid #cfcfd0;
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 1.167;
    margin-bottom: -1px;
}
.style-mypageCs-contents {

}
.style-mypageCs-tab {
    padding: 16px;
}
.style-mypageCs-tab button {
    color: rgba(60, 60, 67, 0.6);
    border-color: #c4c4c6;
    background-color: #fff;
    margin: 0 6px 6px 0;
    border: 1px solid rgba(0, 0, 0, 0.23);
    font-size: 1.4rem;
    box-shadow: none !important;
    font-weight: 400;
    text-transform: capitalize;
    padding: 2px 12px;
    box-sizing: border-box;
    line-height: 1.75;
    border-radius: 4px;
    cursor: pointer;
    display: inline-flex;
    vertical-align: middle;
    justify-content: center;
}
.style-mypageCs-tab button.active {
    background-color: #A647E3;
    color: #fff;
    border: 0;
}
.style-mypageCs-inner {

}
.style-mypageCs-inner-title {
    padding: 22px 16px 10px;
    font-size: 1.8rem;
    font-weight: 700;
    border-bottom: 1px solid #cfcfd0;
}
.style-mypageCs-accordion {
    --bs-accordion-bg: none;
    --bs-accordion-border-width: 0;
    --bs-accordion-border-radius: 0;
    --bs-accordion-inner-border-radius: 0;
}
.style-mypageCs-accordion .accordion-button {
    color: #000000;
    font-size: 1.4rem;
    padding: 16px;
    background: #fff;
    border-bottom: 1px solid #cfcfd0;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}
.style-mypageCs-accordion .accordion-button .style-badge {
    display: inline-flex;
    margin: 0 10px;
    min-width: 58px;
    justify-content: center;
}
.style-mypageCs-accordion .accordion-button .date {
    display: inline-flex;
    margin-left: auto;
    margin-right: 15px;
    color: rgba(60, 60, 67, 0.6);
    font-weight: 400;
    margin-left: auto;
}
.style-mypageCs-accordion .accordion-button::after {
    margin-left: inherit;
}
.mypageCsList .style-mypageCs-accordion .accordion-button::after {
    margin-left: auto !important;
}
.style-mypageCs-accordion .accordion-button svg {

}

.style-mypageQna-accordion .accordion-button.collapsed .btn_arti_open{
    display:block;
}

.style-mypageQna-accordion .accordion-button:not(.collapsed) .btn_arti_open{
    display:none;
}

.style-mypageQna-accordion .accordion-button.collapsed .btn_arti_close{
    display:none;
}

.style-mypageQna-accordion .accordion-button:not(.collapsed) .btn_arti_close{
    display:block !important;
}

.style-mypageCs-accordion .accordion-body {
    padding: 16px;
    background-color: #f4f4f5;
    border-bottom: 1px solid #cfcfd0;
}
.style-mypageCs-accordion .accordion-body a {
    color: #A647E3;
}
.accordion-button:focus {
    box-shadow: inherit;
}
.style-mypageCs-accordion .badge {

}
/* 종료: 마이페이지 > 고객센터*/

/* 시작: 마이페이지 > 공지사항 */
.style-notice {
    padding: 0 16px;
    border-top: 1px solid var(--color-gray-100);
}
.style-notice .style-notice-list {
    display: flex;
    flex-direction: column;
}
.style-notice .style-notice-list > li:not(:first-of-type) {
    border-top: 1px solid var(--color-gray-100);
}
.style-notice .style-notice-list a {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 9px;
    padding: 24px 0;
}
.style-notice .style-notice-list-title {
    width: 100%;
    font-size: 16px;
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
    line-clamp: 2;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.style-notice .style-notice-list-date {
    font-size: 12px;
    color: var(--color-gray-600);
}
.style-notice .style-notice-view-top {
    padding: 22px 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
    border-bottom: 1px solid var(--color-gray-200);
}
.style-notice .style-notice-view-title {
    font-size: 18px;
    font-weight: 600;
}
.style-notice .style-notice-view-date {
    font-size: 13px;
    color: var(--color-gray-600);
}
.style-notice .style-notice-view-content {
    padding: 36px 0;
}
/* 종료: 마이페이지 > 공지사항 */

/* 시작: 마이페이지 > 1:1문의 */
.style-mypageCs-inquiry {

}
.style-mypageCs-inquiry .accordion-body {
    background: #fff;
    padding: 0;
}
.mypageCs-question {
    padding: 16px;
}
.mypageCs-question .inner-button {
    display: flex;
    padding-top: 14px;
    justify-content: flex-end;
}
.inner-question-thumbnail {
    margin-top: 16px;
}
.inner-question-thumbnail .thumbnail-item {
    display: flex;
    position: relative;
    flex-wrap: wrap;
    justify-content: space-between;
}
.inner-question-thumbnail .thumbnail-item .thumbnail {
    width: calc(50% - 3px);
    margin: 0 3px 6px;
    overflow: hidden;
    position: relative;
    flex-grow: 0;
    flex-basis: calc(50% - 3px);
    flex-shrink: 0;
}
.inner-question-thumbnail .thumbnail:after {
    padding-top: 76.22%;
    content: "";
    display: block;
}
.inner-question-thumbnail .thumbnail-item .thumbnail:first-child:nth-last-child(1) {
    width: 100%;
    margin: 0 0 6px 0;
    flex-basis: 100%;
}
.inner-question-thumbnail .thumbnail-item .thumbnail:nth-child(odd) {
    margin-left: 0;
}
.inner-question-thumbnail .thumbnail-item .thumbnail:nth-child(2n) {
    width: calc(50% - 3px);
    margin: 0 0 6px 3px;
    flex-basis: calc(50% - 3px);
}
.inner-question-thumbnail .thumbnail-item button {
    top: 0;
    left: 0;
    position: absolute;
    width: 100%;
    height: 100%;
    display: inline-block;
}
.inner-question-thumbnail .thumbnail-item .thumbnail-photo {
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    position: absolute;
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
}
.inner-question-thumbnail .thumbnail-item .thumbnail-photo img {
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    bottom: 0;
    height: 100%;
    overflow: hidden;
    position: absolute;
    object-fit: cover;
    margin: auto;
    display: block;
    max-width: 100%;
}
.inner-question-thumbnail .thumbnail-item .thumbnail-more {
    display: flex;
    color: white;
    right: 0;
    width: 28px;
    bottom: 0;
    height: 28px;
    display: flex;
    position: absolute;
    align-items: center;
    justify-content: center;
    background-color: rgba(0,0,0,0.5);
}
.inner-question-thumbnail .thumbnail-item .thumbnail-more svg {
    width: 11px;
    height: 11px;
}
.mypageCs-answer {
    color: #000000;
    padding: 16px;
    font-size: 1.4rem;
    border-top: 1px solid #cfcfd0;
    line-height: 1.5;
    background-color: #f4f4f5;
}
.mypageCs-answer .inner-text {
    margin-bottom: 16px;
    border-bottom: 1px dotted var(--color-gray-300);
    padding-bottom: 16px;
}
.mypageCs-answer .inner-text:last-child {
    margin-bottom: 0;
    border-bottom: none;
    padding-bottom: 0
}
.answer-top {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}
.answer-top svg.arrow {
    width: 24px;
    height: 24px;
    margin-right: 2px;
}
.answer-top svg.arrow path {
    fill: #bcbcbf;
}
.answer-top .profile-img {
    width: 26px;
    border: 1px solid #bcbcbf;
    height: 26px;
    overflow: hidden;
    margin-right: 6px;
    border-radius: 50%;
}
.answer-top .date {
    color: rgba(60, 60, 67, 0.6);
    margin-left: auto;
}
.answer-cont {
    padding: 16px 0 0;
}
.style-mypageCs-inquiry-write {
    background-color: #F6F6F6;
}
.inquiry-write-text {
    z-index: 10;
    position: relative;
    font-weight: 500;
}
.inquiry-write-text p {
    color: rgba(60, 60, 67, 0.6);
    margin: 0;
    font-weight: 400;
}
.style-mypageCs-inquiry-write .style-fixed-bottom {
    min-height: 0 !important;
}
/* 종료: 마이페이지 > 1:1문의 */

/* 시작: 마이페이지 > 알림 */
.style-mypageNoti {
    border: 0 none;
    padding-bottom: 10px;
    background-color: #f4f4f5;
}
.style-notiList {
    border-bottom: 1px solid #cfcfd0;
}
.style-notiList ul {
    margin: 0;
    padding: 0;
    position: relative;
    list-style: none;
    background-color: #ffffff;
}
.style-notiList li {
    padding: 0;
    position: relative;
    border-top: 1px solid #cfcccc;
    text-align: left;
    justify-content: center;
    display: flex;
    align-items: center;
}
.style-notiList li .noti-inner {
    color: #000000;
    width: 100%;
    display: block;
    padding: 18px 50px 18px;
    font-size: 1.4rem;
    text-decoration: none;
}
.style-notiList li .noti-inner.hover {
    background-color: #f4f4f5;
}
.style-notiList li .icon {
    top: 50%;
    left: 16px;
    width: 24px;
    height: 24px;
    position: absolute;
    transform: translateY(-50%);
}
.style-notiList li svg path {
    fill: #A1A1A1;
}
.style-notiList li .noti-title {
    display: flex;
    align-items: flex-start;
}
.style-notiList li p {
    font-weight: 400;
    width: 100%;
    margin: 0;
    display: -webkit-box;
    overflow: hidden;
    font-size: 1.4rem;
    white-space: pre-wrap;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}
.style-notiList li .noti-date {
    color: rgba(60, 60, 67, 0.6);
    font-size: 1.2rem;
}
.style-notiList li .arrow {
    top: 50%;
    right: 16px;
    width: 24px;
    height: 24px;
    position: absolute;
    transform: translateY(-50%);
}
.style-noti-empty {
    display: flex;
    padding: 40px 16px;
    flex-wrap: wrap;
    box-sizing: border-box;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    background-color: #f4f4f5;
}
.noti-empty-icon {
    margin-bottom: 20px;
}
.noti-empty-icon svg {
    width: 60px;
    height: 60px;
}
.noti-empty-icon path {
    fill: #c4c4c6;
}
.style-noti-empty .style-empty-text {
    padding: 4px 0 0;
}
/* 종료: 마이페이지 > 알림 */

/* 시작: 체험단 */
.style-experience-group {
    padding: 12px 16px;
}
.style-experience-List {
    margin: 0;
    padding: 0;
    list-style: none;
}
.style-experience-List li {
    width: 100%;
    margin: 0;
    padding: 0 0 28px 0;
    position: relative;
}
.style-experience-List li a {

}
.style-experience-List li .experience-thumbnail {
    width: 100%;
    overflow: hidden;
    position: relative;
    border-radius: 12px;
    background-color: #F6F6F6;
}
.style-experience-List li .experience-thumbnail:before {
    content: "";
    display: block;
    padding-top: 69.9708%;
}
.style-experience-List li .thumbnail-img {
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    position: absolute;
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
}
.style-experience-List li .thumbnail-img img {
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    bottom: 0;
    height: 100%;
    overflow: hidden;
    position: absolute;
    object-fit: contain;
    margin: auto;
    display: block;
    max-width: 100%;
}
.style-experience-List li .badge-type {
    left: 0;
    width: 100%;
    bottom: 12px;
    display: flex;
    padding: 0 12px;
    z-index: 10;
    position: absolute;
    flex-wrap: wrap;
    align-items: center;
}
.style-experience-List li .badge-type .badge {
    color: #fff;
    height: 21px;
    display: inline-flex;
    padding: 0 6px;
    font-size: 1rem;
    align-items: center;
    flex-shrink: 0;
    font-weight: 700;
    margin-right: 2px;
    border-radius: 4px;
    background-color: #6B21CE;
}
.style-experience-List li .badge-type .badge.ing {
    background-color: #6B21CE;
}
.style-experience-List li .badge-type .badge.date {
    background-color: #9523DC;
}
.style-experience-List li .badge-type .badge.end {
    background-color: #8D8D8D;
}
.style-experience-List li .title {
    color: #000;
    margin: 0;
    padding: 8px 8px 0 8px;
    font-size: 1.4rem;
    font-weight: 700;
    line-height: 1.5;
    vertical-align: middle;
}
.style-experience-List li .title .count {
    color: #fff;
    height: 20px;
    display: inline-flex;
    padding: 0 6px;
    font-size: 1.2rem;
    background: #B669E8;
    align-items: center;
    line-height: 1;
    margin-left: 4px;
    border-radius: 20px;
}
.style-experience-List .closing .thumbnail-img {
    opacity: 0.3;
}
.style-experience-List .closing .title {
    color: #646464 !important;
}
.style-experience-List .closing .count {
    background-color: #A1A1A1 !important;
}
.style-experience-view {
    width: 100%;
}
.experience-view-thumbnail {
    width: 100%;
    position: relative;
    background-color: #F6F6F6;
}
.experience-view-thumbnail:before {
    content: "";
    display: block;
    padding-top: 100%;
}
.experience-view-thumbnail .thumbnail-img {
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    position: absolute;
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
}
.experience-view-thumbnail img {
    object-fit: contain;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    bottom: 0;
    height: 100%;
    overflow: hidden;
    position: absolute;
}
.experience-view-thumbnail .experience-more {
    color: #fff;
    right: 16px;
    bottom: 16px;
    height: 25px;
    padding: 4px 8px;
    position: absolute;
    font-size: 1.1rem;
    border-radius: 4px;
    background-color: #C0C0C0;
}
.experience-view-thumbnail .experience-more svg {
    width: 12px;
    height: 12px;
    margin-left: 4px;
}
.experience-info-brand {
    padding: 16px 16px 0;
}
.experience-info-brand .info-brand {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.experience-info-brand .info-brand a {
    color: #000;
    display: flex;
    font-size: 2.2rem;
    align-items: center;
    font-weight: 700;
    text-decoration: none;
}
.experience-info-brand .brand-img {
    width: 40px;
    border: 1px solid;
    height: 40px;
    overflow: hidden;
    flex-shrink: 0;
    border-color: #F0F0F0;
    margin-right: 8px;
    border-radius: 50%;
}
.experience-info-brand .brand-img-inner {
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
    position: relative;
}
.experience-info-brand .brand-img-inner img {
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    bottom: 0;
    height: 100%;
    overflow: hidden;
    position: absolute;
    object-fit: contain;
}
.experience-info-brand .brand-button {
    position: relative;
}
.experience-info-brand .brandLike-button {
    color: #8D8D8D;
    width: 92px;
    height: 36px;
    opacity: 1;
    box-shadow: none;
    transition: all 0.3s ease;
    font-weight: 400;
    border-radius: 40px;
    background-color: #F6F6F6;
}
.experience-info-brand .brandLike-button .MuiButton-label span {
    margin-right: 2px;
    display: inherit;
    margin-left: -4px;
}
.experience-info-brand .brandLike-button .MuiButton-label span > *:first-child {
    font-size: 20px;
}
.experience-info-brand .brandLike-button svg {
    fill: currentColor;
    width: 1em;
    height: 1em;
    display: inline-block;
    font-size: 2.4rem;
    transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    flex-shrink: 0;
    user-select: none;
}
.experience-info-brand .brandLike-button path {
    fill: #A1A1A1;
    stroke: #A1A1A1;
}
.experience-info-brand .brandLike-button.active {
    color: #fff;
    background-color: #EA333E;
}
.experience-info-brand .brandLike-button.active path {
    fill: #fff;
    stroke: #fff;
}
.experience-info-title {
    margin: 0;
    padding: 12px 16px 0;
    font-size: 1.6rem;
    font-weight: 800;
}
.experience-info-day {
    margin: 0;
    padding: 4px 16px 0;
    font-size: 1.4rem;
    font-weight: 700;
}
.experience-detailInfo {
    padding: 20px 16px 16px;
}
.experience-detailInfo dl {
    margin: 0;
    display: flex;
    padding: 20px 0 0 0;
    flex-wrap: wrap;
    font-size: 1.4rem;
    border-top: 1px solid;
    line-height: 1.5;
    border-color: #F0F0F0;
}
.experience-detailInfo dt {
    width: 100px;
    flex-shrink: 0;
    padding-bottom: 14px;
}
.experience-detailInfo dd {
    color: #787878;
    width: calc(100% - 100px);
    margin: 0;
    padding: 0;
    padding-bottom: 14px;
}
.experience-detailInfo dd strong {
    color: #000;
    font-weight: 700;
}
.experience-detailInfo dd span {
    position: relative;
    margin-left: 8px;
    padding-left: 9px;
}
.experience-detailInfo dd span:before {
    top: 50%;
    left: 0;
    width: 1px;
    height: 12px;
    content: "";
    display: block;
    position: absolute;
    transform: translateY(-50%);
    background-color: #E3E3E3;
}
.experience-guide {
    width: 100%;
    height: 143px;
    position: relative;
    margin-bottom: 50px;
    background-color: #F6F6F6;
}
.experience-guide-inner {
    top: 50%;
    left: 16px;
    width: calc(100% - 16px - 124px);
    position: absolute;
    transform: translateY(-50%);
}
.experience-guide-inner h4 {
    margin: 0;
    padding: 0 0 8px 0;
    font-size: 2.2rem;
    font-weight: 700;
}
.experience-guide-inner p {
    margin: 0;
    padding: 0;
    font-size: 1.3rem;
    line-height: 1.5;
}
.experience-guide img {
    top: 0;
    right: 0;
    width: auto;
    height: 100%;
    position: absolute;
}
.experience-contents {
    padding: 0 16px;
    text-align: center;
}
.experience-cont-title {
    margin: 0;
    padding: 0 0 12px 0;
    font-size: 2.4rem;
    font-weight: 600;
}
.experience-cont-box {
    padding-bottom: 60px;
}
.experience-cont-txt {

}
.experience-cont-brand {
    border: 1px solid;
    padding: 14px 16px;
    margin-top: 16px;
    border-color: #F0F0F0;
    border-radius: 12px;
}
.experience-cont-brand-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.experience-cont-brand-inner a {
    font-size: 1.4rem;
    color: #000;
    display: flex;
    align-items: center;
    font-weight: 700;
    text-decoration: none;
}
.experience-cont-brand-inner .brand-inner-img {
    width: 40px;
    border: 1px solid;
    height: 40px;
    overflow: hidden;
    flex-shrink: 0;
    border-color: #F0F0F0;
    margin-right: 8px;
    border-radius: 50%;
}
.experience-cont-brand-inner .brand-img {
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
    position: relative;
}
.experience-cont-brand-inner .brand-img img {
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    bottom: 0;
    height: 100%;
    overflow: hidden;
    position: absolute;
    object-fit: contain;
    margin: auto;
    display: block;
    max-width: 100%;
}
.experience-cont-brand-inner .brand-button {
    position: relative;
}
.experience-cont-brand-inner .brandLike-button {
    color: #8D8D8D;
    width: 92px;
    height: 36px;
    opacity: 1;
    box-shadow: none;
    transition: all 0.3s ease;
    font-weight: 400;
    border-radius: 40px;
    background-color: #F6F6F6;
}
.experience-cont-brand-inner .brandLike-button .MuiButton-label span {
    margin-right: 2px;
    display: inherit;
    margin-left: -4px;
}
.experience-cont-brand-inner .brandLike-button .MuiButton-label span > *:first-child {
    font-size: 20px;
}
.experience-cont-brand-inner .brandLike-button svg {
    fill: currentColor;
    width: 1em;
    height: 1em;
    display: inline-block;
    font-size: 2.4rem;
    transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    flex-shrink: 0;
    user-select: none;
}
.experience-cont-brand-inner .brandLike-button path {
    fill: #A1A1A1;
    stroke: #A1A1A1;
}
.experience-cont-brand-inner .brandLike-button.active {
    color: #fff;
    background-color: #EA333E;
}
.experience-cont-brand-inner .brandLike-button.active path {
    fill: #fff;
    stroke: #fff;
}
.experience-step {
    padding: 24px 12px;
    margin-top: 20px;
    border-radius: 12px;
    background-color: #FAFAFA;
}
.experience-step ol {
    margin: 0;
    display: flex;
    padding: 0;
    position: relative;
    list-style: none;
    align-items: flex-start;
    justify-content: space-between;
}
.experience-step li {
    width: 96px;
    margin: 0;
    padding: 16px 0 0 0;
    position: relative;
    flex-grow: 0;
    flex-shrink: 0;
}
.experience-step ol > svg {
    top: 28px;
    width: 16px;
    height: 16px;
    position: relative;
}
.experience-step ol > svg path {
    fill: #A1A1A1;
}
.experience-step li .box {
    width: 40px;
    height: 40px;
    margin: 0 auto;
    position: relative;
}
.experience-step li .box .number {
    top: -16px;
    left: -8px;
    color: #fff;
    width: 26px;
    height: 19px;
    margin: 0;
    display: flex;
    padding: 0;
    position: absolute;
    font-size: 1.1rem;
    align-items: center;
    font-family: HGHaeDotum,sans-serif;
    line-height: 1;
    border-radius: 16px;
    justify-content: center;
    background-color: #000;
}
.experience-step li .box svg {
    width: 40px;
    height: 40px;
}
.experience-step li h5 {
    margin: 0;
    padding: 10px 0 0 0;
    font-size: 1.3rem;
}
.experience-step li p {
    color: #787878;
    margin: 0;
    padding: 0;
    font-size: 1.1rem;
}
.experience-cont-hashTag {
    padding: 20px;
    lineheight: 1.4;
    margin-top: 20px;
    text-align: left;
    border-radius: 12px;
    background-color: #FAFAFA;
}
.experience-cont-hashTag .title {
    margin: 0;
    display: flex;
    padding: 0;
    font-size: 1.4rem;
    align-items: center;
    font-weight: 700;
}
.experience-cont-hashTag .tagGuide-button {
    margin-left: 4px;
}
.experience-cont-hashTag .tagGuide-button svg {
    color: transparent;
    width: auto;
    height: 14px;
}
.experience-cont-hashTag .tagBox {
    margin-top: 8px;
}
.experience-cont-hashTag .tag {
    word-break: keep-all;
}
.experience-cont-hashTag .tag span {
    display: inline-block;
    margin-right: 4px;
}
.experience-cont-hashTag .tagCopy-button {
    color: #3376F6;
    margin: -2px 0 0 2px;
    font-size: 1.3rem;
    flex-shrink: 0;
}
.experience-cont-hashTag .tagCopy-button svg {
    width: 16px;
    height: auto;
    margin-right: 2px;
}
.style-experience-request {
    flex: 1 1 0;
    width: 100%;
    display: flex;
    padding: 0;
    flex-direction: column;
    background-color: #F6F6F6;
}
.style-experience-article {
    background: #fff;
    margin-bottom: 10px;
}
.style-experience-article-header {
    cursor: default;
    width: 100%;
    display: flex;
    padding: 16px 16px 0 16px;
    align-items: center;
    justify-content: space-between;
    position: relative;
}
.style-experience-article-header h3 {
    margin: 0;
    font-size: 1.8rem;
    font-weight: 700;
}
.style-experience-article-inner {
    padding: 16px;
}
.style-experience-article-inner .style-empty {
    height: 80px;
}
.style-experience-article-button {
    right: 16px;
    bottom: -2px;
    display: flex;
    position: absolute;
}
.style-experience-item {
    display: flex;
    overflow: hidden;
    position: relative;
    border-bottom: 1px solid #F0F0F0;
}
.style-experience-item:last-child {
    border: none !important;
}
.style-experience-item-thumbnail {
    height: 84px;
    display: inline-block;
}
.style-experience-item-thumbnail div {
    width: 84px;
    height: 84px;
    overflow: hidden;
    position: relative;
    flex-grow: 0;
    flex-basis: 84px;
    flex-shrink: 0;
    border-radius: 4px;
}
.style-experience-item-thumbnail div img {
    width: 84px;
    height: 84px;
    object-fit: cover;
}
.style-experience-item-detail {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    padding-left: 8px;
    flex-direction: column;
}
.style-experience-item-info {
    padding: 0 0 6px 0;
    min-height: 60px;
}
.style-experience-item-info a {
    color: inherit;
    text-decoration: none;
}
.style-experience-item-info h3 {
    width: 100%;
    margin: 0;
    display: -webkit-box;
    overflow: hidden !important;
    position: relative;
    font-size: 1.4rem;
    max-height: 18px;
    text-align: left;
    font-weight: 400;
    line-height: 1.5;
    white-space: pre-wrap;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
}
.experience-request-button {
    padding: 0 0 16px;
    display: none;
}
.experience-request-button.open {
    display: block;
}
.form-check-txtbox {
    width: 100%;
    margin-left: 0;
    margin-bottom: 8px;
    height: 88px;
    overflow: auto;
    font-size: 1.1rem;
    margin-top: 8px;
    border-radius: 8px;
    background-color: #F6F6F6;
    display: none;
}
.form-check-txtbox.open {
    display: block;
}
.txtbox-inner {
    padding: 8px;
    font-size: 1rem;
}
.txtbox-txt {
    max-width: calc(100vw - 80px);
    padding-bottom: 8px;
}
.txtbox-tablebox table {
    border-right: 1px solid #E3E3E3;
    border-bottom: 1px solid #E3E3E3;
    border-spacing: 0;
}
.txtbox-tablebox th {
    padding: 4px;
    border-top: 1px solid;
    border-left: 1px solid;
    border-color: #E3E3E3;
    border-spacing: 0;
    font-size: 1rem;
}
.txtbox-tablebox td {
    padding: 4px;
    border-top: 1px solid;
    border-left: 1px solid;
    border-color: #E3E3E3;
    border-spacing: 0;
    font-size: 1rem;
}
.sbtn_undr {
    margin: 0 0 0 4px;
    padding: 0;
    font-size: 1.2rem;
    line-height: 1;
    text-decoration: underline;
}
.style-experience-optionArea {
    width: 100%;
    height: 32px;
    display: block;
    background: url("../img/icon/ic_sheetTopButton.png") no-repeat center;
    background-size: 38px 8px;
}
.style-experience-optionArea.close {
    background: url("../img/icon/ic_sheetBottomButton.png") no-repeat center;
    background-size: 38px 8px;
}
.style-alert-experience .style-alert-footer {
    padding-top: 18px;
    display: flex;
    gap: 2px;
    flex-direction: row;
}
#tagGuide-modal .style-alert-dialog {
    max-width: 95% !important;
}
#tagGuide-modal .style-alert-content {
    padding: 0 16px 30px;
}
#tagGuide-modal .style-alert-header {
    margin: 0;
    padding: 16px 0;
    font-size: 1.6rem;
    font-family: Pretendard,sans-serif;
    line-height: 1.4;
    border-bottom: 1px solid #F0F0F0;
    display: flex;
    justify-content: space-between;
}
#tagGuide-modal .style-alert-header svg {
    width: 26px !important;
    height: 26px !important;
}
#tagGuide-modal .style-alert-header path {
    stroke: #787878;
}
#tagGuide-modal .style-alert-title {
    padding-bottom: 0;
}
#tagGuide-modal .tagGuide-text {
    gap: 30px;
    display: flex;
    flex-wrap: wrap;
    font-family: Pretendard,sans-serif;
    line-height: 1.5;
    padding-top: 16px;
}
#tagGuide-modal .tagGuide-text h6 {
    margin: 0;
    padding: 0;
    font-size: 1.4rem;
    font-weight: 700;
}
#tagGuide-modal .tagGuide-text div > div {
    padding-top: 4px;
}
#tagGuide-modal .tagGuide-text .ctext {
    color: #A647E3;
}

#tagGuide-modal .tagGuide-text .sgray {
    color: #A1A1A1;
    font-size: 1.2rem;
    padding-top: 4px;
}

/* 종료: 체험단 */

/* 시작: 브랜드 */
.style-brands {
    flex: 1 1 0;
    width: 100%;
    display: flex;
    padding: 0;
    flex-direction: column;
    background-color: #F6F6F6;
}
.style-brands-article {
    background: #fff;
    margin-bottom: 10px;
}
.style-brands-article:last-child {
    margin-bottom: 0;
}
.style-brands-article-header {
    cursor: default;
    width: 100%;
    display: flex;
    padding: 16px 16px 0 16px;
    align-items: center;
    justify-content: space-between;
    position: relative;
}
.style-brands-article-header h3 {
    margin: 0;
    font-size: 1.8rem;
    font-weight: 700;
}
.style-brands-article-inner {
    padding: 16px 0;
}
.style-brands swiper-slide {
    width: 156px;
    margin-right: 8px;
}
.style-brands swiper-slide:first-child {
    margin-left: 16px;
}
.style-brands swiper-slide:last-child {
    margin-right: 16px;
}
.style-brands-info {
    width: 100%;
    display: flex;
    padding: 18px 16px 18px;
    align-items: center;
    justify-content: space-between;
}
.style-brands-info .brands-info {
    color: #000;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    text-decoration: none;
}
.brands-logoImg {
    width: 56px;
    height: 56px;
    flex-shrink: 0;
}
.brands-logoImg .brands-logo {
    border: 1px solid #F0F0F0;
    border-radius: 50%;
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
    position: relative;
}
.brands-logoImg .brands-logo img {
    right: 0;
    bottom: 0;
    overflow: hidden;
    position: absolute;
    object-fit: cover;
    top: -1px;
    left: -1px;
    width: calc(100% + 2px);
    height: calc(100% + 2px);
    max-width: calc(100% + 2px);
}
.style-brands-info .brands-name {
    font-size: 2.3rem;
    font-family: Pretendard,sans-serif;
    font-weight: 600;
    line-height: 1.4;
    padding-left: 9px;
}
.style-brands-info .brandLike-button {
    width: 28px;
    height: 28px;
}
.style-brands-info .brandLike-button svg {
    fill: none;
    width: 28px;
    height: 28px;
}
.style-brands-info .brandLike-button svg path {
    stroke: #787878;
}
.style-brands-info .brandLike-button.active svg {
    fill: #EA333E;
}
.style-brands-info .brandLike-button.active svg path {
    stroke: #EA333E;
}
.style-brands-img {
    width: 100%;
    aspect-ratio: 1;
}
.style-brands-img .brands-img {
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
    position: relative;
}
.style-brands-img .brands-img img {
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    bottom: 0;
    height: 100%;
    overflow: hidden;
    position: absolute;
    object-fit: cover;
    margin: auto;
    display: block;
    max-width: 100%;
}
.style-brands-contents {
    width: 100%;
    padding: 20px 16px;
    font-family: Pretendard,sans-serif;
    line-height: 1.5;
}
.style-brands-contents .style-brands-name {
    margin: 0;
    padding: 0;
    font-size: 2.4rem;
    font-weight: 600;
    letter-spacing: -0.48px;
}
.style-brands-contents .style-brands-name .stxt {
    font-size: 1.3rem;
    font-weight: 600;
    padding-left: 4px;
}
.style-brands-contents .style-brands-cont {
    color: #646464;
    margin: 0;
    padding: 0;
    font-size: 1.5rem;
    font-weight: 400;
    padding-top: 4px;
}
/* 종료: 브랜드 */

/* 시작: 이벤트 */
.style-planned {

}
.style-plannedList {

}
.style-plannedList li {
    width: 100%;
    margin: 0  0 30px 0;
}
.style-plannedList a {
    width: 100%;
    display: block;
    text-align: inherit;
}
.style-plannedList .planned-img {
    width: 100%;
    overflow: hidden;
    position: relative;
    display: block;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}
.style-plannedList .planned-img:before {
    height: 0;
    content: "";
    display: block;
    padding-top: 55.56%;
}
.style-plannedList .planned-img img {
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    bottom: 0;
    height: 100%;
    position: absolute;
    object-fit: cover;
}
.style-plannedList .planned-title {
    padding: 10px 16px;
}
.style-plannedList .planned-title h3 {
    width: 100%;
    font-size: 1.6rem;
    font-weight: 500;
}
.style-planned-article .style-tabs {
    margin-bottom: 10px;
}
.style-planned-article-header {
    padding: 16px 16px 0;
}
.style-planned-article-header h3 {
    margin: 0;
    font-size: 1.6rem;
    font-weight: 700;
}
.style-planned-article .style-itemList {
    padding-top: 16px;
}

.style-eventList {
    padding: 16px 16px 0;

}
.style-eventList li {
    width: 100%;
    margin: 0  0 15px 0;
}
.style-eventList a {
    width: 100%;
    display: block;
    text-align: inherit;
}
.style-eventList .event-img {
    width: 100%;
    overflow: hidden;
    position: relative;
    display: block;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    border-radius: 4px;
}
.style-eventList .event-img:before {
    height: 0;
    content: "";
    display: block;
    padding-top: 55.56%;
}
.style-eventList .event-img img {
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    bottom: 0;
    height: 100%;
    position: absolute;
    object-fit: cover;
}
/* 종료: 이벤트 */


/* 시작: 오늘특가 */
.style-todaydeals-article {
    padding: 30px 0 0;
}
.style-todaydeals-article-header {
    margin-bottom: 15px;
    text-align: center;
}
.style-todaydeals-article-header h3 {
    font-size: 28px;
    color: #232323;
    font-weight: 700;
}
.style-todaydeals-article-header div {
    font-size: 15px;
    color: #232323;
    font-weight: 400;
}
/* 종료: 오늘특가 */

/* 시작: 전체리뷰 */
.style-allreviews {
    flex: 1 1 0;
    width: 100%;
    display: flex;
    padding: 0;
    flex-direction: column;
    /*background-color: #F6F6F6;*/
}
.style-allreviews-article {
    background: #fff;
    margin-bottom: 10px;
}
.style-allreviews-article:last-child {
    margin-bottom: 0;
}
.style-allreviews-article .reviewList-item-buttonBox div {
    margin-left: auto;
}
/* 종료: 전체리뷰 */

/* 시작: 입점문의 */
.style-partnership {
    padding: 16px;
}
.style-partnership-title {
    margin: 0 0 30px 0;
    font-size: 1.6rem;
    font-weight: 400;
    border-bottom: 2px solid rgba(60, 60, 67, 0.6);
    padding-bottom: 10px;
}
.style-partnershipForm {
    padding-bottom: 16px;
}
.style-partnership .style-form-check a {
    color: #0073e9;
    border: 0 none;
    display: inline;
    padding: 0;
    font-weight: 400;
    vertical-align: inherit;
}
/* 종료: 입점문의 */

/* 시작: 팝업 */
.popApp-modal {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
.popApp-modal .popApp-img {
    width: 100%;
    text-align: center;
    padding-bottom: 20px;
}
.popApp-modal .popApp-img img {
    width: 100%;
    max-width: 327px;
    margin: auto;
    display: block;
}
.popApp-modal-button {
    min-height: 60px;
    border-radius: 20px;
    padding: 13px 16px;
    font-size: 1.6rem;
    box-shadow: none !important;
    font-weight: 500;
    text-transform: capitalize;
    width: 100%;
    color: #fff;
    background-color: #A647E3;
}
.popApp-modal-button .label {
    font-size: 16px;
    font-weight: 700;
    width: 100%;
    display: inherit;
    align-items: inherit;
    justify-content: inherit;
}
.popApp-modal-button .label svg {
    width: 16px !important;
    height: 16px !important;
    margin-left: 12px;
}
.popApp-modal-button .label svg path {

}
.popApp-modal-button-text {
    color: #fff;
    font-size: 1.3rem;
    margin-top: 32px;
    text-decoration: underline;
}
.popAppCheck-top {
    text-align: center;
}
.popAppCheck-top .popAppCheck-title {
    font-size: 25px;
    color: var(--color-gray-900);
    font-weight: 600;
    line-height: 1.5;
    margin-bottom: 8px;
    display: block;
}
.popAppCheck-top .popAppCheck-stit {
    display: block;
    color: var(--color-gray-650);
}
.popAppCheck-cont {
    margin: 30px 0;
    text-align: left;
}
.popAppCheck-cont ul {
    margin-bottom: 30px;
}
.popAppCheck-cont li {
    margin-bottom: 10px;
}
.popAppCheck-cont li h3 {
    display: block;
    font-weight: 600;
}
.popAppCheck-cont li h3 span {
    color: var(--color-mainColor);
}
.popAppCheck-cont li span {
    color: var(--color-gray-650);
}
.popAppCheck-cont-text {
    display: block;
    color: var(--color-gray-650);
    text-align: center;
}
.popNoti-cont img {
    width: auto;
    height: auto;
    margin: auto;
    display: block;
    max-width: 100%;
}
.style-alert-pop .style-alert-dialog {
    max-width: 90% !important;
}
@media (min-width: 600px) {
    .style-alert-pop .style-alert-dialog {
        max-width: 70% !important;
    }
}
.style-alert-pop .style-alert-content-wrap {
    position: relative;
}
.style-alert-pop .style-alert-content {
    padding: 0 !important;
    border-radius:10px !important;
}
.style-alert-pop .style-alert-footer {
    padding-top: 0 !important;
    flex-direction: row !important;
}
.style-alert-pop .style-alert-footer button {
    font-weight: normal;
}
.style-main-pop .style-offcanvas-body {
    overflow: hidden;
    text-align: left;
    border-radius: 40px 40px 0 0;
}
.style-main-pop .style-offcanvas-body img {
    width: auto;
    height: auto;
    margin: auto;
    display: block;
    max-width: 100%;
}
.style-main-pop .style-offcanvas-bottom {
    color: #646464;
    height: 50px;
    display: flex;
    padding: 0 16px;
    font-size: 1.6rem;
    align-items: center;
    justify-content: space-between;
}
.style-offcanvas-bottom.bg-none-bottom {
    position: absolute;
    bottom: -30px;
    display: flex;
    justify-content: space-between;
    width: 100%;
    color: #fff;
}
.style-offcanvas-bottom.bg-none-bottom .style-form-check-label {
    color: #fff;
}
.style-offcanvas-bottom.bg-none-bottom svg {
    margin-right: 3px;
}
.main-pop-radius {
    overflow: inherit !important;
}
.main-pop-radius img {
    border-radius: 20px !important;
    overflow: hidden;
}
.main-pop-overflow {
    overflow: inherit !important;
}
.main-pop-overflow img {
    max-width: 100%;
}
.main-pop-overflow .style-offcanvas-bottom {
    justify-content: right;
}
.main-pop-button {
    position: absolute;
    bottom: 8%;
    left: 50%;
    transform: translateX(-50%);
    width: 90%;

}
/* 종료: 팝업 */


/* 시작: 약속 */
.style-value7-button {
    top: 16px;
    right: 16px;
    width: 36px;
    height: 36px;
    display: flex;
    z-index: 1800;
    position: fixed;
    box-shadow: 0 6px 8px rgba(0, 0, 0, 0.08);
    background-color: #fff;
    flex: 0 0 auto;
    color: inherit;
    padding: 12px;
    overflow: visible;
    font-size: 2.4rem;
    text-align: center;
    transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    border-radius: 50%;
}
.style-value7-button svg {
    width: 16px;
    height: 16px;
    vertical-align: inherit;
}
.style-value7-button svg path {
    stroke: #646464;
}
@media (min-width: 600px) {
    .style-value7-button {
        right: 50%;
        margin-right: -286px;
    }
}
.style-value7-top {
    display: flex;
    position: relative;
    text-align: center;
    flex-direction: column;
    height: 100vh;
}
.style-value7-top-title {
    top: 45.33%;
    color: #fff;
    width: 100%;
    margin: 0 auto;
    z-index: 10;
    position: absolute;
    font-weight: 600;
    font-size: 2.5rem;
}
.style-value7-top-title span {
    color: #E0BFF4;
}
.style-value7-top-empty {
    height: 80%;
    border-radius: 0 0 50px 0;
    width: 100%;
    opacity: 0.2;
    position: absolute;
    background-color: #000000;
}
.style-value7-top-video {
    height: 80%;
}
.style-value7-top-video video {
    width: 100%;
    object-fit: cover;
    height: 100%;
    border-radius: 0 0 50px 0;
    margin-bottom: 4.0rem;
}
.style-value7-top-text {
    font-size: 1.4rem;
    margin-top: 7.38%;
    color: #646464;
    font-weight: 300;

}
.section#section1.active .style-value7-top-text {

}
.style-value7-promise {
    display: flex;
    overflow: hidden;
    align-items: center;
    flex-direction: column;
}
.style-value7-promise-title {
    font-size: 2.4rem;
    color: #000;
    display: block;
    font-weight: 600;
}
.style-value7-promise-title span {
    color: #A647E3;
}
.style-value7-promise-list {
    width: 280px;
    margin: 18px 48px 10px;
    display: flex;
    padding: 0;
    flex-wrap: wrap;
    justify-content: space-between;
}
.style-value7-promise-list li {
    width: calc(50% - 20px);
    margin-bottom: 30px;
    position: relative;
    list-style: none;
    text-align: center;
}
.style-value7-promise-list li .value7-icon {
    max-width: 120px;
    max-height: 120px;
    border-radius: 80px;
    margin: 0 auto;
    margin-bottom: 10px;
    background-color: #F6F6F6;
}
.style-value7-promise-list li .value7-icon svg {
    width: 52px !important;
    height: 52px !important;
    margin: 34px;
}
.style-value7-promise-list li .value7-txt {
    font-size: 1.4rem;
    margin: 4px 0;
    font-weight: 600;
}
.value7-swiper-slide {
}
.value7-swiper-slide img {
    margin: auto;
    display: block;
    max-width: 100%;
}
.value7-swiper-slide swiper-container::part(pagination) {
    width: 100%;
    height: 16px;
    display: flex;
    position: relative;
    box-sizing: border-box;
    justify-content: center;
    align-items: center;
    left: auto;
    bottom: auto;
    transform: translate3d(0,0,0);
    margin-top: 8px;
}
.value7-swiper-slide swiper-container::part(bullet-active) {
    background-color: #A647E3;
    width: 6px;
    height: 6px;
}
.value7-swiper-slide swiper-container::part(bullet) {
    width: 4px;
    height: 4px;
    margin: 0 3px;
    display: inline-block;
    overflow: hidden;
    transition: all 0.3s ease;
    border-radius: 50%;
    background-color: #E3E3E3;
    opacity: 1;
}
.style-value7-step {
    display: flex;
    overflow: hidden;
    text-align: center;
    align-items: center;
    flex-direction: column;
    padding-top: 60px;
}
.style-value7-step-title {
    color: #000;
    display: block;
    font-weight: 600;
    font-size: 2.4rem;
}
.style-value7-step-title span {
    color: #A647E3;
}
.style-value7-step-text {
    color: #646464;
    font-weight: 300;
    font-size: 1.4rem;
    padding-top: 20px;
}
.style-value7-step-list {
    padding: 25px 0 35px;
    max-width: 375px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
.style-value7-step-list li {
    width: 296px;
    padding-bottom: 30px;
    display: flex;
    position: relative;
    flex-wrap: wrap;
    list-style: none;
}
.style-value7-step-list li .value7-num {
    width: 60px;
    height: 40px;
    padding: 5px 14px 4px 17px;
    font-size: 2.2rem;
    border-radius: 0 50px 50px 60px;
    color: #A647E3;
    font-weight: 600;
    margin-right: 20px;
    background-color: #F6F6F6;
}
.style-value7-step-list li .value7-txt {
    font-size: 1.6rem;
    text-align: left;
    font-weight: 300;
}
.style-value7-step-list li .value7-txt span {
    font-weight: 600;
}
.last-cont {
    padding-bottom: 50px;
}
/*나타나기*/
.hideme, .hideme2 {
    opacity: 0;
    transform: translateY(40px); /* 좀 더 아래에서 올라오도록 조정 */
    transition: opacity 1.5s ease-in-out, transform 1.5s ease-in-out;
    will-change: opacity, transform;
}

.hideme.show, .hideme2.show {
    opacity: 1;
    transform: translateY(0); /* 원래 위치로 */
}

/* 종료: 약속 */

/* 시작: Q&A */
.style-mypage-qna {}
.style-mypage-qna-top {
    display: flex;
    padding: 16px 19px;
    border-bottom: 1px solid #F0F0F0;
    align-items: center;
    justify-content: space-between;
}
.qna-top-left {
    display: flex;
    gap: 15px;
}
.qna-filter {
    color: #C1C1C1;
    font-size: 14px;
    font-weight: 400;
    position: relative;
}
.qna-filter.active {
    background: url("../img/icon/checkbox_bk.svg") no-repeat left center;
    padding-left: 18px;
    color: #2A2A2A;
}
.qna-filter:before {
    position: absolute;
    top: 3px;
    right: -7px;
    width: 1px;
    height: 12px;
    background: #E8E8E8;
    content: "";
}
.qna-filter:last-child:before {
    display: none;
}
.qna-top-right {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 14px;
    color: #000;
}
.qna-top-right .style-form-switch {
    height: 22px;
    width: 38px;
}
.qna-top-right .style-form-switch .form-check-input:checked {
    border-color: #4377FD;
    background-color: #4377FD;
}
.style-mypage-qna-chekBox {
    display: flex;
    padding: 16px;
    border-bottom: 1px solid #F0F0F0;
}
.style-mypage-qna-chekBox .style-chekBox {
    padding: 0;
    height: auto;
}
.style-mypage-qna-chekBox .style-form-check {
    padding-left: 18px;
    align-items: center;
}
.style-mypage-qna-chekBox .style-form-check .style-form-check-input {
    width: 18px;
    height: 18px;
    margin: 0 4px 0 -18px;
    box-shadow: none;
    border: 0;
    border-radius: 0;
    background: url(../img/icon/icon_checkbox_off.svg) no-repeat 100% 100%;
    background-size: cover;
    cursor: pointer;
}
.style-mypage-qna-chekBox .style-form-check .style-form-check-label {
    font-size: 14px;
    line-height: 18px;
}
.style-mypageQna-accordion {
    --bs-accordion-bg: none;
    --bs-accordion-border-width: 0;
    --bs-accordion-border-radius: 0;
    --bs-accordion-inner-border-radius: 0;
}
.style-mypageQna-accordion .accordion-button {
    color: #393A40;
    font-size: 15px;
    padding: 20px 16px;
    background: #fff;
    border-bottom: 1px solid #F0F0F0;
    display: block;
}
/*
.style-mypageQna-accordion .accordion-button.in_reply::after {
    width: 23px;
    height: 23px;
    display: flex;
    position: absolute;
    bottom: 18px;
    right: 16px;
    background-size: 23px;
    background-image: url("https://dogpre.com/static/img/icon/mypageQna-arrow.svg");
}
 */
.style-mypageQna-accordion .accordion-button .secret {
    color: #999;
    display: flex;
    align-items: center;
}
.style-mypageQna-accordion .accordion-button .secret svg {
    margin-left: 2px;
}
.style-mypageQna-accordion .accordion-button .inner-li {
    margin-top: 15px;
}
.style-mypageQna-accordion .accordion-button .inner-li ul {
    display: flex;
    gap: 18px;
}
.style-mypageQna-accordion .accordion-button .inner-li li {
    color: #999;
    font-size: 13px;
    position: relative;
}
.style-mypageQna-accordion .accordion-button .inner-li li strong {
    color: #000;
}
.style-mypageQna-accordion .accordion-button .inner-li li:before {
    position: absolute;
    top: 3px;
    right: -10px;
    width: 1px;
    height: 9px;
    background: #E8E8E8;
    content: "";
}
.style-mypageQna-accordion .accordion-button .inner-li li:last-child:before {
    display: none;
}
.style-mypageQna-accordion .accordion-button .inner-li li a {
    color: #999;
    font-size: 13px;
}
.style-mypageQna-accordion .accordion-body {
    padding: 20px 16px;
    background: #F7F8FA;
}
.style-mypageQna-accordion .mypageQna-answer {

}
.style-mypageQna-accordion  .answer-icon {
    display: inline-flex;
    width: 30px;
    height: 17px;
    line-height: 17px;
    border-radius: 30px;
    background: #000;
    font-size: 10px;
    color: #fff;
    justify-content: center;
}
.style-mypageQna-accordion .mypageQna-answer .inner-text {
    margin-top: 5px;
    font-size: 15px;
    color: #393A40;
}
.mypage-qna-write {
    padding: 20px 16px;
}
.mypage-qna-write-chekBox {
    margin-top: 12px;
    padding: 0;
}
/* 종료: Q&A */


/* 시작: 장바구니 담기 모션 */
@keyframes cartIconFade {
    0%, 20% { opacity: 0; }
    60%, 90% { opacity: 1; }
    100% { opacity: 0; }
}

.cart-animation::after {
    content: "";
    position: fixed;
    left: 50%;
    top: 50%;
    width: 100px;
    height: 100px;
    opacity: 0;
    background-color: #a647e3;
    background-image: url('../img/cart_white.svg');
    background-size: 60px 60px;
    background-position: center;
    background-repeat: no-repeat;
    transform: translate(-50%, -50%) scale(1);
    border-radius: 50%;
    pointer-events: none;
    overflow: hidden;
    z-index: 2000;
    transition:
            width 0.4s ease 0.2s,
            height 0.4s ease 0.2s,
            background-size 0.4s ease 0.2s,
            left 0.4s ease 0.6s,
            top 0.4s ease 0.6s,
            transform 0.4s ease 0.6s;
}

.active-cart::after {
    width: 120px;
    height: 120px;
    background-size: 72px 72px;
    left: var(--cart-x, 24px);
    top: var(--cart-y, 24px);
    transform: translate(-50%, -50%) scale(0.1667);
    opacity: 1;
    animation: cartIconFade 1s ease 0s both;
}

/* 종료: 장바구니 담기 모션 */

/*
.style-home-mainChipCont {
    position: relative;
    margin-bottom: 70px;
}
.style-home-mainChipCont .HomeChips_chips {
    margin-bottom: 20px;
}
.style-home-mainChipCont .HomeChips_chips div {
    text-align: center;
}
.style-home-mainChipCont swiper-container {

}
.style-home-mainChipCont swiper-slide {
    width: 80px;
    margin-right: 5px;
    margin-bottom: 10px;
}
 */

#choiceItem {
    padding: 0 16px;
    box-sizing: border-box; /* 내부 padding 계산 정확하게 */
}



.style-community {

}
.style-community-top {
    padding: 12px 0;
    border-bottom: 1px solid #F0F0F0;
}
.style-community-top #chipButton swiper-slide {
    width: auto;
}
.style-community-top #chipButton .style-chip-button {
    font-size: 14px;
    color: #212124;
    font-weight: 500;
}
.style-community-top #chipButton .style-chip-button-active {
    background: #000;
    border: 1px solid #000;
    color: #fff;
}
.style-community-listWrap {

}
.style-community-list-top {
    padding: 0 16px;
}
.style-community-list-top ul {

}
.style-community-list-top li {
    border-bottom: 1px solid #F2F3F6;
    display: flex;
    gap: 6px;
}
.style-community-list-top a {
    position: relative;
    padding: 16px 0;
    display: flex;
    align-items: center;
    gap: 6px;
    width: 100%;
}
.style-community-new:before {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #FA2314;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: -7px;
    content: "";
}
.style-community-list-top .list-chek {
    background: #454545;
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    height: 23px;
    border-radius: 23px;
    line-height: 23px;
    width: 42px;
    text-align: center;
    flex-shrink: 0;
}
.style-community-list-top .list-chek-notice {
    background: #FFF2F2;
    color: #F53535;
    font-size: 13px;
    font-weight: 600;
    height: 23px;
    border-radius: 23px;
    line-height: 23px;
    width: 42px;
    text-align: center;
    flex-shrink: 0;
}
.style-community-list-top .list-txt {
    display: block;
    color: #2A2A2A;
    font-weight: 600;
    font-size: 16px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 23px;
}
.style-community-list {
    padding: 0 16px;
}
.style-community-list li {
    border-bottom: 1px solid #F2F3F6;
    display: flex;
    padding: 12px 51px 12px 0;
    gap: 6px;
    align-items: center;
    position: relative;
}
.style-community-list .community-list-cont {
    display: flex;
    gap: 12px;
    min-height: 62px;
    width: 100%;
}
.style-community-list .list-cont-inner {
    display: flex;
    flex-direction: column;
}
.style-community-list .list-cont-inner .list-tit {
    font-size: 16px;
    font-weight: 400;
    color: #111112;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    margin-bottom:2px;
}
.style-community-list .list-cont-inner .list-info {
    display: flex;
    font-size: 14px;
    color: #949699;
    gap: 6px;
}
.style-community-list .list-cont-thumbnail {
    width: 62px;
    height: 62px;
    border-radius: 12px;
    overflow: hidden;
    position: relative;
    flex-shrink: 0;
    margin-left: auto;
}
.style-community-list .list-cont-thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: hidden;
    position: absolute;
}
.style-community-list .list-cont-thumbnail .thumbnail-count {
    border-radius: 10px;
    background: rgba(0, 0, 0, 0.50);
    position: absolute;
    top: 4px;
    right: 4px;
    color: #fff;
    font-size: 10px;
    padding: 0 4px;
    z-index: 5;
}
.style-community-list .community-list-comment {
    padding: 12px 8px;
    border-radius: 12px;
    background: #F6F6F6;
    text-align: center;
    width: 45px;
    height: 62px;
    position: absolute;
    /*top: 20px;*/
    right: 0;

}
.style-community-list .community-list-comment strong {
    display: block;
    color: #111112;
    font-size: 16px;
    font-weight: 500;
}
.style-community-list .community-list-comment span {
    display: block;
    color: #949699;
    font-size: 12px;
    font-weight: 200;
    margin-top:-1px;
}
.page-top-button {
    position: fixed;
    bottom: 80px;
    right: 16px;
    z-index: 1500;

    height: 47px;
    padding: 0 16px;
    gap: 4px;

    display: flex;
    align-items: center;
    border-radius: 47px;
    overflow: hidden;

    background: #67696B;
    color: #fff;

    transition:
            width 0.35s cubic-bezier(.4,0,.2,1),
            padding 0.35s cubic-bezier(.4,0,.2,1);
    will-change: width;
    transform: translateZ(0);     /* GPU 강제 */
}

/* 글자 */
.page-top-button span {
    white-space: nowrap;
    transition:
            opacity 0.2s ease,
            transform 0.35s cubic-bezier(.4,0,.2,1);
}

/* 아이콘용 레이어 */
.page-top-button::after {
    content: "";
    position: absolute;
    inset: 0;

    background-color: #67696B;
    background-image: url("../img/icon/ic_plus.svg");
    background-repeat: no-repeat;
    background-position: center;

    transform: translateX(-100%);
    transition: transform 0.35s cubic-bezier(.4,0,.2,1);

    will-change: transform;       /* ← 중요 */
}

/* 스크롤 후 */
.page-top-button.scroll {
    width: 47px;
    padding: 0;
}

/* 글자는 오른쪽으로 밀리며 사라짐 */
.page-top-button.scroll span {
    opacity: 0;
    transform: translateX(20px);
}

/* 아이콘이 왼쪽 → 오른쪽으로 슬라이드 인 */
.page-top-button.scroll::after {
    transform: translateX(0);
}

.style-community-inner-top {
    font-size: 14px;
    text-align: left;
    width: 100%;
    align-items: center;
    display: flex;
    line-height: 20px;
    padding: 0 16px;
    margin-top:-1px;
    margin-bottom:6px;
    color: #777777;
}

.style-community-inner-top svg {
    margin-left:-1px;
}

.style-community-inner {
    padding: 0 16px;
}
.style-community-view-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.community-view-top-title {
    font-size: 23px;
    font-weight: 500;
}
.community-view-top-actionButton {
    margin-left: auto;
}
.style-community-user {
    width: 100%;
    display: flex;
    font-size: 1.4rem;
    flex-basis: 100%;
    align-items: center;
    flex-shrink: 0;
    padding: 18px 0 16px 0;
    border-bottom: 1px solid #F2F3F6;
}
.style-community-profile {
    width: 39px;
    border: 1px solid #F0F0F0;
    height: 39px;
    max-height: 39px;

    display: block;
    overflow: hidden;
    position: relative;
    margin-right: 7px;
    border-radius: 50%;

}
.style-community-profile img {
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    bottom: 0;
    height: 100%;
    position: absolute;
    object-fit: cover;
    background-color: #F6EEFA;
}
.style-community-user-info {
}
.style-community-user-info-name {
    width: 100%;
    display: flex;
    flex-direction: column;
}
.style-community-user-name .name {
    font-weight: 500;
    font-size: 14px;
    color: #000;
}
.style-community-user-name .info {
    font-weight: 400;
    font-size: 13px;
    color: #949699;
    display: flex;
    gap: 6px;
}
.style-community-view-cont {
    padding: 20px 0 20px 0;
    font-size: 16px;
    line-height: 140%;
}
.style-community-view-photo {
    width: 100%;
    padding: 20px 0;
}
.style-community-view-photo img {
    width: 100%;
}
.style-community-view-like {
    border-radius: 50px;
    border: 1px solid #EAEBEE;
    text-align: center;
    width: 100%;
    height: 52px;
    line-height: 52px;
    box-sizing: border-box;
    font-size: 15px;
    font-weight: 600;
    display: flex;
    gap: 5px;
}
.style-community-view-like span{
    min-width: 8px;
}
.style-community-view-like.active svg path {
    fill: #F03F45;
    stroke: #F03F45;
}
.style-community-view-comment {
    border-top: 1px solid #F2F3F6;
    padding: 20px 16px;
}
.style-community-view-comment.comment-more {
    border-top: none;
    padding: 0;
}
.style-community-view-comment.comment-more.flex_body {
    display: flex;
    flex-direction: column;
    height: calc(100dvh - 50px - 58px - env(safe-area-inset-bottom));

}
.view-comment-top {
    display: flex;
    gap: 3px;
    font-size: 17px;
    font-weight: 600;
    align-items: center;
    padding: 0 0 7px;
}
.view-comment-top a {
    display: flex;
    gap: 3px;
    font-size: 18px;
    font-weight: 600;
    align-items: center;
}

/* iphone 디버깅 */
.html-comment-mode html,
.html-comment-mode body {
    height: 100%;
    overflow: hidden;
    background: yellowgreen;
}

.view-comment-list {

}

.view-comment-list.scroll {
    flex: 1;
    overflow-y: auto;
    min-height:0;
    -webkit-overflow-scrolling: touch;

    overscroll-behavior: contain;
    scrollbar-gutter: stable both-edges;
    min-width: 0;

    margin-left:-16px;
    margin-right:-16px;
    padding-left:16px;
    padding-right:16px;
}

.view-comment-list.scroll::-webkit-scrollbar {
    width: 3px;
}

.view-comment-list.scroll::-webkit-scrollbar-thumb {
    background: rgba(0,0,0,0.15);
    border-radius: 2px;
}

.view-comment-list > ul > li {
    border-bottom: 1px solid #F2F3F6;
}
.view-comment-list li .item {
    padding: 12px 16px;
    display: flex;
    gap: 8px;
}
.view-comment-list li ul {
}
.view-comment-list li ul li .item {
    padding-left: 53px;
}
.view-comment-list .my-comment {
    background: #F6F6F6;
}
.view-comment-list-photo {
    width: 36px;
    border: 1px solid #F0F0F0;
    height: 36px;
    min-height: 36px;
    display: block;
    overflow: hidden;
    position: relative;
    border-radius: 50%;
    flex-shrink: 0;
}
.view-comment-list li

/*.comment_sub_list*/

.sub_list .view-comment-list-photo {
    width: 30px;
    border: 1px solid #F0F0F0;
    height: 30px;
    min-height: 30px;
    display: block;
    overflow: hidden;
    position: relative;
    margin-right: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

.comment_sub_list .view-comment-list-photo {
    width: 30px;
    border: 1px solid #F0F0F0;
    height: 30px;
    min-height: 30px;
    display: block;
    overflow: hidden;
    position: relative;
    margin-right: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

.view-comment-list-photo img {
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    bottom: 0;
    height: 100%;
    position: absolute;
    object-fit: cover;
    background-color: #F6EEFA;
}
.view-comment-list-info {
    width:100%;
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.view-comment-list-info .info-tit {
    font-size: 14px;
    font-weight: 600;
    margin-bottom:1px;
}
.view-comment-list-info .info-txt {
    font-size: 16px;
}
.view-comment-list-info .info-data {
    display: flex;
    gap: 6px;
    color: #949699;

    margin-top:2px;
}
.view-comment-list-info .info-data a {
    color: #7A7E85;
    font-weight: 200;
    margin-left:3px;

}
.view-comment-list-btn {
    display: flex;
    flex-direction: column;
}
.view-comment-list-btn .comment-actionButton {
    margin-bottom:5px;
}

.view-comment-list-btn .comment-like {
    display: flex;
    flex-direction: column;
    color: #ADB1BA;
    font-size: 14px;
    justify-content: center;
}
.view-comment-list-btn .comment-like.active  svg path {
    fill: #F03F45;
    stroke: #F03F45;
}
.view-comment-list-bottom {
    display: flex;
    justify-content: space-between;
    padding: 16px 0;
}
.view-comment-list-bottom button {
    font-size: 15px;
}
.view-comment-inputBox {
    padding: 12px 0;
}
.view-comment-input {
    position: relative;
    height: 46px;
    background: #fff;
    border-radius: 50px;
    border: 1px solid #D6D6D6;
    padding: 0 20px;
    gap: 10px;
    align-items: center;
    display: flex;
}
.view-comment-input .comment-input-img {
    width: 28px;
}
.view-comment-input .comment-input-img img {
    width: 100%;
}
.view-comment-input input {
    border: none;
    background: none;
    padding: 0;
    height: 46px;
}

.view-comment-input input:focus{
    background: none;
}
.view-comment-bottom {
    padding: 12px 0;

    /*padding-bottom: var(--safe-area-inset-bottom, env(safe-area-inset-bottom, 0px));*/
}
.view-comment-bottom-fix {
    position: fixed;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    max-width: 600px; /* PC 기준 최대폭 */
    padding-left: 16px;
    padding-right: 16px;
    padding-top:12px;
    padding-bottom: calc(12px + var(--safe-area-inset-bottom, env(safe-area-inset-bottom, 0px)));
    border-top: 1px solid #F2F3F6;
    border-bottom: 1px solid #F2F3F6;
    /*z-index: 1000;*/
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #fff;



    /*padding-bottom: calc(16px + env(safe-area-inset-bottom, 0.5vh));*/
}

.view-comment-bottom-sticky {
    position: sticky;
    bottom: 0;

    width: 100%;
    max-width: 600px; /* PC 기준 최대폭 */
    padding: 16px;
    border-top: 1px solid #F2F3F6;

    /*z-index: 1000;*/
    /*display: flex;*/
    justify-content: space-between;
    align-items: center;
    background: #fff;

    /*padding-bottom: calc(16px + env(safe-area-inset-bottom, 0.5vh));*/
}

.view-comment-bottom-fix.comment-more {
    display: block;
}

.view-comment-bottom-fix.comment-more.flex_bottom {
    margin-left:-16px;
    margin-right:-16px;
}
.view-comment-bottom-fix button {
    font-size: 15px;
    font-weight: 500;
    display: flex;
    gap: 4px;
    align-items: center;
}
.view-comment-bottom-fix div {
    display: flex;
    gap: 15px;
}

.view-comment-bottom-fix button.comment-button-like.active svg path {
    fill: #F03F45;
    stroke: #F03F45;
}

/*
.view-comment-bottom-fix button.comment-button-like span{
    min-width:10px;
}

.view-comment-bottom-fix button.comment-button-reply span{
    min-width:10px;
}

.view-comment-bottom-fix button.comment-button-share span{
    min-width:10px;
}
*/


.style-community-top-button {
    padding: 12px 16px;
    display: flex;
    gap: 6px;
}
.view-comment-input-write {
    display: flex;
    flex-direction: column;
    border-radius: 50px;
    border: 1px solid #D6D6D6;
}
.view-comment-input-write.is-active {
    padding: 16px;
    border-radius: 20px;
    background: #FFF;
}
.view-comment-input-write .write-user {
    display: flex;
    margin-bottom: 4px;
}
.view-comment-input-write .write-user a {
    display: flex;
    font-size: 14px;
    font-weight: 600;
    color: #000;
    gap: 4px;
    align-items: center;
}
.view-comment-input-write .write-user .user-img {
    width: 26px;
    border: 1px solid #F0F0F0;
    height: 26px;
    min-height: 26px;
    display: block;
    overflow: hidden;
    position: relative;
    border-radius: 50%;
    flex-shrink: 0;
}
.view-comment-input-write .write-user .user-img img {
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    bottom: 0;
    height: 100%;
    position: absolute;
    object-fit: cover;
    background-color: #F6EEFA;
}

.view-comment-input-write .write-user .close-button {
    display: flex;
    font-size: 14px;
    font-weight: 600;
    color: #000;
    margin-left: auto;
    padding:6px;
}

.view-comment-input-write .style-form-input {
    height: 47px;
    background: #F6F6F6;
    border-radius: 50px;
    padding: 16px 20px;
    width: 100%;
    border: none;
}
.view-comment-input-write .style-form-textarea-comment {
    height: 50px; /* line-height */
    resize: none;
    overflow: hidden;
    width: 100%;
    border: none;
    font-size: 15px;
    line-height: 24px;
    color: #212124;
    padding: 13px 20px;
    transition: height 0.2s ease;
    background: none;
}
.view-comment-input-write.is-active .style-form-textarea-comment {
    padding: 0;
}
.view-comment-input-write .style-form-textarea-comment::placeholder {
    color: #868B94;
}
.view-comment-input-write .style-form-textarea-comment:focus {
    border: 0;
    outline: none;
    box-shadow: none !important;
    /*font-size: 16px;*/
}

.view-comment-input-write .write-button {
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    flex-shrink: 0;
    margin-left: auto;
}
.view-comment-input-write .write-user,
.view-comment-input-write .write-button {
    display: none;
}
.view-comment-input-write.is-active .write-user,
.view-comment-input-write.is-active .write-button {
    display: flex;
}
.view-comment-input-write.is-active .style-form-textarea-comment {
    min-height: 96px; /* 24px * 4줄 */
    overflow-y: auto;
}
.style-schedule-input {
    position: relative;
}
.style-schedule-input .style-form-input {
    padding-right: 50px;
}
.style-schedule-input svg {
    position: absolute;
    top: 0;
    right: 12px;
    text-align: right;
    align-items: center;
    height: 52px;
    display: flex;
}
.style-calendar {

}
.style-calendarTop {
    display: flex;
    justify-content: center;
    gap: 11px;
    align-items: center;
}
.style-calendarTop .date-title {
    font-size: 19px;
    color: #2A2A2A;
    font-weight: 600;
}
.style-calendarBox {
    margin: 20px 0 20px;
}

.style-calendarBox-button{
    padding:10px;
}

.style-calendarBox table {
    width: 100%;
}
.style-calendarBox table th,
.style-calendarBox table td {
    text-align: center;
    vertical-align: top;
    text-align: center;
}
.style-calendarBox thead th {
    color: #ADB1BA;
    font-size: 13px;
    font-weight: 700;
    height: 44px;
    line-height: 44px;
}
.style-calendarBox tbody td {
    color: #2A2A2A;
    font-size: 19px;
    height: 44px;
    line-height: 44px;
    position: relative;
    z-index: 1;
}
.style-calendarBox tbody td.past-date {
    color: #D1D3D8;
}
.style-calendarBox tbody td.selected {
    color: #fff;
}
.style-calendarBox tbody td.selected:before  {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 40px;
    height: 40px;
    background: #2A2A2A;
    border-radius: 50%;
    z-index: -1;
}

.style-offcanvas-top {
    display: flex;
    padding: 16px 20px 10px;
}
.style-offcanvas-top .style-offcanvas-top-close {
    margin-left: auto;
}



.bottom-button-coin {
    position: fixed;
    bottom: calc(60px + var(--safe-area-inset-bottom, env(safe-area-inset-bottom, 0px)));
    left: 50%;
    margin-left: -300px;
    z-index: 100;
}

.bottom-button-coin_left {
    position: fixed;
    bottom: calc(78px + var(--safe-area-inset-bottom, env(safe-area-inset-bottom, 0px)));
    left: 50%;
    margin-left: -284px;
    z-index: 100;
    background: #FFF;
    padding:3px 9px;
    border:1px solid #E3E3E3;
    border-radius: 16px;
    box-shadow: 1px 1px 5px 0px #00000026;
}

.bottom-button-coin_left span {
    font-weight: 600;
    font-size: 13px;
    leading-trim: NONE;
    line-height: 140%;
    text-align: right;
    margin-left:5px;
}

.bottom-button-write {
    position: fixed;
    bottom: calc(78px + var(--safe-area-inset-bottom, env(safe-area-inset-bottom, 0px)));
    right: 50%;
    margin-right: -284px;
    z-index: 100;
}
@media (max-width: 600px) {
    .bottom-button-coin_left {
        left: 16px;
        margin-left:0;
    }
    .bottom-button-coin {
        left: 0;
        margin-left:0;
    }
    .bottom-button-write {
        right: 16px;
        margin-right:0;
    }
}


.style-setting .style-setting-list02 {
    display: flex;
    flex-direction: column;
}
.style-setting .style-setting-list02 > li {
    display: flex;
    align-items: center;
    font-size: 16px;
}
.style-setting .style-setting-list02 > li > a {
    display: flex;
    align-items: center;
}
.style-setting .style-setting-list02 .style-setting-withsubTitle {
    gap: 0 !important;
    padding: 10px 0 !important;

}
.style-setting .style-setting-list02 > li strong {
    font-size: 16px;
    font-weight: 600;
}
.style-setting .style-setting-list02 > li .stxt {
    color: #868B94;
    font-size: 14px;
}
.style-setting .style-setting-list02 > li:first-child .style-setting-withsubTitle {
    padding-top: 0 !important;
}
.style-setting .style-setting-list02 .style-setting-withAddOn {
    min-height: 0;
}
.style-setting-big li {
    border-bottom: 1px solid #F0F0F0;
}
.style-setting-big li .style-setting-withsubTitle {
    padding: 20px 0;
}
.style-setting-big li:last-child {
    border-bottom: none;
}
.style-setting-big .style-form-switch .form-check-input:checked {
    border-color: #4377FD;
    background-color: #4377FD;
}


.layout-header-title.leftFull {
    width: calc(100% - 180px);
    left: 16px;
    transform: translate(0, -50%);
    text-align: left;
    font-size: 21px;
    font-weight: 600;
}


.style-setting-list02 .style-form-switch .form-check-input {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e");
    border-color: #E4E4E4;
    background-color: #E4E4E4;
}
.style-setting-list02 .style-form-switch .form-check-input:checked {
    border-color: #4377FD;
    background-color: #4377FD;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3.8' fill='%23fff'/%3e%3c/svg%3e");
}



.style-alert-dialog-280 {
    max-width: 280px !important;
    padding: 0 !important;
}
.style-alert-dialog-noti01 {
    max-width: 353px !important;
    padding: 0 !important;
}
.style-alert-dialog-noti02 {
    max-width: 313px !important;
    padding: 0 !important;
}
.style-alert-dialog-280 .style-alert-content {
    padding: 20px !important;
    font-size: 16px;
}
.style-alert-dialog-280 .style-alert-title {
    font-size: 20px;
}
.style-alert-dialog-noti01 .style-alert-content {
    padding: 25px !important;
    text-align: center;
    font-size: 16px;
}
.style-alert-dialog-noti01 .style-alert-content img{
    width:313px;
    margin-left:-5px;
}
.style-alert-dialog-noti01 .style-alert-title {
    font-size: 19px !important;
    color: #212124;
    font-weight: 700;
    line-height: 150%;
    margin-top: 20px;
    margin-bottom: 9px
}
.style-alert-dialog-noti02 .style-alert-content {
    padding: 20px !important;
    text-align: center;
    font-size: 15px;
}
.style-alert-dialog-noti02 .style-alert-title {
    font-size: 25px !important;
    color: #212124;
}
.style-alert-dialog-noti02 .style-alert-body {
    margin-bottom: 20px;
}
.style-alert-footer-horizontal {
    flex-direction: initial !important;
    gap: 7px !important;
}
.style-alert-dialog-noti01 .style-alert-close, .style-alert-dialog-noti02 .style-alert-close {
    position: absolute;
    top: 13px;
    right: 14px;
    z-index: 4;
}
.style-button-gr {
    background: #F3F4F6;
    color: #212124;
    font-size: 14px;
    font-weight: 500;
    border: 1px solid #F3F4F6;
}
.style-button-grline {
    background: #fff;
    color: #212124;
    font-size: 15px;
    font-weight: 500;
    border: 1px solid #212124;
    height:47px;
}
.style-button-bk {
    background: #212124;
    color: #fff;
    font-size: 15px;
    font-weight: 500;
    border: 1px solid #212124;
    height:47px;
}

.layout-header-title.leftFull {
    width: calc(100% - 180px);
    left: 16px;
    transform: translate(0, -50%);
    text-align: left;
    font-size: 21px;
}

.style-alert-dialog-noti01 .style-alert-body{
    font-weight: 400;
    font-size:16px;
    line-height: 140%;
    margin-bottom:10px;
}


.style-cart-freeGgift-box {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 20px 0 10px;
}
.fullsize-freeGgift {
    padding: 16px;
    border-top: 1px solid #F0F0F0;
}
.style-cart-freeGgift-tit {
    font-size: 14px;
    font-weight: 500;
    color: #000;
    margin-bottom:10px;
    margin-top:5px;
    /*padding-left:4px;*/
}
.style-cart-freeGgift {
    border-radius: 8px;
    background: #F6F6F6;
    display: flex;
    gap: 12px;
    align-items: center;
    overflow: hidden;
    position: relative;
    padding: 0 38px 0 0;
}
.style-cart-freeGgift-thumbnail {
    height: 75px;
    display: inline-block;
}
.style-cart-freeGgift-thumbnail div {
    width: 75px;
    height: 75px;
    overflow: hidden;
    position: relative;
    flex-grow: 0;
    flex-basis: 75px;
    flex-shrink: 0;
    background: #fafafa;
}
.style-cart-freeGgift-thumbnail .style-itemList-thumbnail {
    background: #fafafa;
}
.style-cart-freeGgift-thumbnail div img {
    width: 75px;
    height: 75px;
    object-fit: cover;
}
.style-cart-freeGgift-info {
    display: flex;
    flex-direction: column;
    padding: 9px 0;
}
.style-cart-freeGgift-info h3 {
    width: 100%;
    margin: 0;
    display: -webkit-box;
    overflow: hidden !important;
    position: relative;
    font-size: 13px;
    max-height: 20px;
    text-align: left;
    font-weight: 400;
    line-height: 1.5;
    white-space: pre-wrap;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    color: #000;
}
.style-cart-freeGgift-data {
    color: #646464;
    font-size: 12px;
    font-weight: 400;
}
.style-cart-freeGgift-text {
    color: #646464;
    font-size: 12px;
    font-weight: 400;
}
.style-cart-freeGgift .style-cart-del {
    top: 9px;
    right: 8px;

}



.header-right-textBtn {
    color: #8D8D8D;
    font-size: 15px;
    font-weight: 500;
}
.style-signUp-form.pt20 {
    padding-top: 20px;
}
.style-grayBox-search {
    display: flex;
    border-radius: 8px;
    background: #F6F6F6;
    padding: 8px 14px;
    gap: 4px;
    align-items: center;
}
.style-grayBox-search input {
    height: 32px;
    font-size: 15px;
    font-weight: 400;
    background: none;
    border: none;
    width: 100%;
}
.style-grayBox-search input:placeholder {
    color: #8D8D8D;
}
.style-grayBox-search input:focus {
    outline: none;
}
.style-Pet-food {
    margin-top: 26px;
    display: flex;
    flex-wrap: wrap;
    column-gap: 17px;
    row-gap: 26px;
}
.style-Pet-food .item {
    width: calc((100% - (17px * 2)) / 3);
    box-sizing: border-box;
}
.style-Pet-food .item a {
    display: flex;
    gap: 8px;
    flex-direction: column;
    align-items: center;
}
.style-Pet-food .item .brand-logo {
    border: 1px solid #F0F0F0;
    border-radius: 50%;
    width: 100%;
    /*max-width: 109px;*/
    aspect-ratio: 1 / 1;
    box-sizing: border-box;
    display: block;
    overflow: hidden;
    position: relative;
}
.style-Pet-food .item .brand-logo img {
    right: 0;
    bottom: 0;
    overflow: hidden;
    position: absolute;
    object-fit: cover;
    top: -1px;
    left: -1px;
    width: calc(100% + 2px);
    height: calc(100% + 2px);
    max-width: calc(100% + 2px);
}
.style-Pet-food .item .brand-name {
    font-size: 14px;
    color: #212124;
    font-weight: 500;
}
.style-Pet-food .item.active .brand-logo {
    border: 2px solid #9523DC;
}
.style-Pet-food .item.active .brand-name {
    color: #9523DC ;
}
.style-signUp-successBox {
    position: fixed;
    width: 100%;
    max-width: 600px;
    top: calc(50% - 72px);
    left: 50%;
    transform: translate(-50%,-50%);
}
.style-signUp-successBox .style-signUp-success-image {
    padding: 0;
    text-align: center;
}
.style-signUp-successBox .style-signUp-success-image img {
    max-width: 393px;
}
.style-signUp-success-text {
    text-align: center;
    padding: 0 16px;
}
.style-signUp-success-text .tit {
    font-size: 20px;
    color: #393A40;
    font-weight: 700;
    padding-bottom: 16px;
}
.style-signUp-success-text .txt {
    font-size: 15px;
    color: #7A7E85;
    font-weight: 500;
}




/*브랜드 팝업, 상세 */
.style-dialog-radius16 {
    width: 341px !important;
    padding: 0 !important;
    box-sizing: border-box;
    overflow: hidden;
}
.style-dialog-radius16 .modal-content {
    padding: 0;
    border-radius: 16px !important;
}
.style-dialog-radius16 .modal-dialog-img {
    background: #F6F6F6;
    display: flex;
    align-items: center;
    justify-content: center;
}
.style-dialog-radius16 .modal-dialog-tag {
    position: absolute;
    top: 13px;
    left: 13px;
    padding: 4px 8px;
    background: #FFE12D;
    border-radius: 5px;
    color: #000;
    font-size: 14px;
    font-weight: 700;
    line-height: normal;
    letter-spacing: -0.32px;
}
.style-dialog-radius16 .modal-dialog-img img {
    width: 224px;
    height: 224px;
}
.modal-dialog-textBox {
    display: flex;
    padding: 20px 18px;
    flex-direction: column;
}
.modal-dialog-textBox .textBox-title {
    font-size: 17px;
    font-weight: 600;
    color: #000;
}
.modal-dialog-textBox .textBox-text {
    font-size: 14px;
    font-weight: 400;
    color: #000000;
    margin: 7px 0 29px;
}
.modal-dialog-foot {
    display: flex;
    gap: 4px;
}
.modal-dialog-foot button {
    font-size: 15px;
    font-weight: 500;
    height: 47px;
    box-sizing: border-box;
}
.modal-dialog .style-button-gr {
    border: 1px solid #E3E3E3;
    background: #fff;
    color: #000;
}
.modal-dialog .style-button-bk {
    background: #2A3038;
    border: 1px solid #2A3038;
}
.style-detail-food-title {
    padding: 18px 16px;
    font-weight: 500;
    color: #000;
    font-size: 18px;
}
.style-detail-food-cont {
    padding: 0 16px;
    display: flex;
    flex-direction: column;
    gap: 36px;
}
.style-detail-food-info {
    display: flex;
    flex-direction: column;
}
.style-detail-food-info .info-title {
    font-size: 14px;
    color: #000;
    font-weight: 500;
    margin-bottom: 10px;
}
.style-detail-food-info .info-li {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 16px;
}
.style-detail-food-info .info-li li {
    display: flex;
    font-size: 14px;
    font-weight: 400;
    color: #000;
}
.style-detail-food-info .info-li li span {
    display: flex;
    width: 80px;
}
.style-detail-food-info .info-text {
    font-size: 14px;
    color: #787878;
    font-weight: 400;
}
.summary-li-bk {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.summary-li-bk li {
    font-size: 14px;
    color: #787878;
    font-weight: 400;
    margin-top: 0;
}
.summary-li-bk li:before {
    top: 8px;
    width: 3px;
    height: 3px;
    background-color: #787878;
}
.food-fixed-bottom-double {
    display: flex;
    gap: 6px;
}
.food-fixed-bottom-double .style-button {
    height: 50px;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 500;
}
.food-fixed-bottom-double .style-button-etc2 {
    background: #F3F4F6;
    color: #000;
}
.style-alert-dialog-280 {
    max-width: 280px !important;
    padding: 0 !important;
}
.style-alert-dialog-280 .style-alert-content {
    padding: 20px !important;
    font-size: 16px;
    font-weight: 400;
    color: #000;
    border-radius: 20px;
}
.style-alert-body {
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.style-alert-body .title {
    font-size: 20px;
    font-weight: 700;
    color: #000;
}
.style-alert-dialog-280 .style-button {
    font-size: 14px;
    font-weight: 600;
    height: 39px;
    box-sizing: border-box;
    border-radius: 8px;
}
.style-alert-dialog-280 .style-alert-footer-horizontal {
    gap: 7px !important;
}
.style-alert-dialog-280 .style-button-gr {
    border: 1px solid #F3F4F6;
    background: #F3F4F6;
    color: #000;
}
.style-alert-dialog-280 .style-button-bk {
    background: #000;
    border: 1px solid #000;
}



/*-----------------*/
.style-coupon-page {

}
.coupon-page-top {
    padding: 40px 35px;
    display: flex;
    flex-direction: column;
    gap: 30px;
}

/* 아이폰 SE 이하 */
@media (max-width: 390px) {
    .coupon-page-top {
        padding: 0;
    }
}

.coupon-page-btitle {
    color: #373634;
    font-size: 24px;
    font-weight: 700;
    letter-spacing: -0.96px;
    display: flex;
    text-align: center;
    justify-content: center;
}
.coupon-page-btitle_sub {
    color: #373634;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: -0.96px;
    display: flex;
    text-align: center;
    justify-content: center;
    margin-top:-25px;
}
.coupon-page-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr); /* 2열 */
    gap: 16px;
    max-width: 600px;
    margin: 0 auto;
}
.coupon-page-list .item {
    background: url("https://dogpre.com/static/img/coupon-page-bg.svg") no-repeat center 100%;
    width: 167px;
    height: 95px;
}
.coupon-page-list .item a {
    display: flex;
    padding: 16px 10px 15px 10px;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    flex-direction: column;
    gap: 5px;
    position: relative;
}
/*
.coupon-page-list .item a:before {
    position: absolute;
    top: 50%;
    right: 5px;
    width: 20px;
    height: 20px;
    transform: translateY(-50%);
    content: "";
    background: url("https://dogpre.com/static/img/coupon-page-down.svg") no-repeat center;
}*/

.coupon-page-list .item .title {
    font-weight: 600;
    font-size: 12px;
    color: #fff;

    line-height: 130%;
}
.coupon-page-list .item .price {
    font-weight: 700;
    font-size: 25px;
    color: #fff;
    line-height: 110%;
}
.coupon-page-list .item .price span {
    font-size: 21px;
    font-weight: 500;
}
.coupon-page-list .item .text {
    font-weight: 500;
    font-size: 12px;
    color: #fff;
    opacity: 0.6;
    line-height: 130%;
}
.coupon-page-list .item.disabled {
    background: url("https://dogpre.com/static/img/coupon-page-none-bg.svg") no-repeat center 100%;
}
.coupon-page-list .item.disabled a:before {
    background: url("https://dogpre.com/static/img/coupon-page-none.svg") no-repeat center;
}
.coupon-page-list .item.disabled .price {
    color: #646464;
}
.coupon-page-list .item.disabled .text {
    color: #646464;
}
.coupon-page-product-list {
    display: flex;
    flex-direction: column;
}
.coupon-page-product-list .producBox {
    display: flex;
    flex-direction: column;
    padding: 40px 0 20px;
    gap: 30px;
}
.coupon-page-product-list .producBox-title {
    font-weight: 700;
    font-size: 24px;
    color: #373634;
    letter-spacing: -0.96px;
    display: flex;
    text-align: center;
    justify-content: center;
}
.coupon-page-guide {
    padding: 50px 20px;
    background: #F9F9F9;
}
.coupon-page-guide .title {
    color: #000;
    font-weight: 700;
    font-size: 15px;
    margin-bottom: -4px;
}
.coupon-page-guide .style-textList {
    gap: 8px;
}
.coupon-page-guide .style-textList li {
    font-size: 14px;
    color: #787878;
    line-height: 20px;
    padding-left: 11px;
}
.coupon-page-guide .style-textList li:before {
    top: 9px;
    left: 0;
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background-color: #787878;
}


.style-personal-header {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 120px;
    padding: 24px 20px;
    background: linear-gradient(135deg, #d1c5ff 0%, #8470be 100%);
    border-radius: 16px;
    text-align: center;
    overflow: hidden;
    margin:0 10px 5px 10px;
}

.style-personal-title {
    margin: 0;
    display: flex;
    flex-direction: column;   /* 2줄 세로 정렬 */
    gap: 6px;
    color: #fff;
    line-height: 1.4;
}

/* 1줄: 견종+연령 (큰 글자) */
.style-personal-title .pet_title {
    font-size: 19px;
    font-weight: 800;
}

/* 2줄: 설명 (작은 글자, 살짝 투명) */
.style-personal-title .sub_title {
    font-size: 15px;
    font-weight: 600;
    opacity: 0.95;
}

.order_count {
    display:inline-block;
    background:#F0F1F4;
    padding:3px 5px;
    color:#232323;
    font-weight: 600;
    font-size:12px;
    margin-top:8px;

}