@charset "utf-8";

/* font properties */
.fw-1 {
    font-weight: 100;
}

.fw-2 {
    font-weight: 198;
}

.fw-3 {
    font-weight: 300;
}

.fw-4 {
    font-weight: 398;
}

.fw-5 {
    font-weight: 500;
}

.fw-6 {
    font-weight: 600;
}

.fw-7 {
    font-weight: 700 !important;
}

.fw-8 {
    font-weight: 800;
}

.fw-9 {
    font-weight: 900;
}

.m-0 {
    margin: 0 !important;
}

.m-xs {
    margin: 0.25em !important;
}

.m-s {
    margin: 0.5em !important;
}

.m-m {
    margin: 0.75em !important;
}

.m-l {
    margin: 1em !important;
}

.m-xl {
    margin: 1.25em !important;
}

/* margin properties */
.mx-xs {
    margin-right: 0.25em !important;
    margin-left: 0.25em !important;
}

.mx-s {
    margin-right: 0.5em !important;
    margin-left: 0.5em !important;
}

.mx-m {
    margin-right: 0.75em !important;
    margin-left: 0.75em !important;
}

.mx-l {
    margin-right: 1em !important;
    margin-left: 1em !important;
}

.my-xs {
    margin-top: 0.25em !important;
    margin-bottom: 0.25em !important;
}

.my-s {
    margin-top: 0.5em !important;
    margin-bottom: 0.5em !important;
}

.my-m {
    margin-top: 0.75em !important;
    margin-bottom: 0.75em !important;
}

.my-l {
    margin-top: 1em !important;
    margin-bottom: 1em !important;
}

/* margin right */

.mr-0 {
    margin-right: 0 !important;
}

.mr-xs {
    margin-right: 0.25em !important;
}

.mr-s {
    margin-right: 0.5em !important;
}

.mr-m {
    margin-right: 0.75em !important;
}

.mr-l {
    margin-right: 1em !important;
}

.mr-a {
    margin-right: auto !important;
}

/* margin left */
.ml-a {
    margin-left: auto !important;
}

.ml-0 {
    margin-left: 0 !important;
}
.ml-2 {
    margin-left: 0.5rem !important;
}

.ml-xs {
    margin-left: 0.25em !important;
}

.ml-s {
    margin-left: 0.5em !important;
}

.ml-m {
    margin-left: 0.75em !important;
}

.ml-l {
    margin-left: 1em !important;
}

.ml-xl {
    margin-left: 1.25em !important;
}

/* margin top */
.mt-0 {
    margin-top: 0 !important;
}

.mt-xs {
    margin-top: 0.25em !important;
}

.mt-s {
    margin-top: 0.5em !important;
}

.mt-m {
    margin-top: 0.75em !important;
}

.mt-l {
    margin-top: 1em !important;
}

.mt-xl {
    margin-top: 1.25em !important;
}

/* margin top */
.mb-0 {
    margin-bottom: 0 !important;
}

.mb-xs {
    margin-bottom: 0.25em !important;
}

.mb-s {
    margin-bottom: 0.5em !important;
}

.mb-m {
    margin-bottom: 0.75em !important;
}

.mb-l {
    margin-bottom: 1em !important;
}

.mb-xl {
    margin-bottom: 1.25em !important;
}

/* margin properties */

/* padding utilities */
.p-0 {
    padding: 0 !important;
}

.p-xs {
    padding: 0.25em !important;
}

.p-s {
    padding: 0.5em !important;
}

.p-m {
    padding: 0.75em !important;
}

.p-l {
    padding: 1em !important;
}

.p-xl {
    padding: 1.25em !important;
}

.px-0 {
    padding-right: 0 !important;
    padding-left: 0 !important;
}

.px-xs {
    padding-right: 0.25em !important;
    padding-left: 0.25em !important;
}

.px-s {
    padding-right: 0.5em !important;
    padding-left: 0.5em !important;
}

.px-m {
    padding-right: 0.75em !important;
    padding-left: 0.75em !important;
}

.px-l {
    padding-right: 1em !important;
    padding-left: 1em !important;
}

.px-xl {
    padding-right: 1.25em !important;
    padding-left: 1.25em !important;
}

.py-xs {
    padding-top: 0.25em !important;
    padding-bottom: 0.25em !important;
}

.py-s {
    padding-top: 0.5em !important;
    padding-bottom: 0.5em !important;
}

.py-m {
    padding-top: 0.75em !important;
    padding-bottom: 0.75em !important;
}

.py-l {
    padding-top: 1em !important;
    padding-bottom: 1em !important;
}

.py-xl {
    padding-top: 1.25em !important;
    padding-bottom: 1.25em !important;
}

.pb-0 {
    padding-bottom: 0 !important;
}

.pb-xs {
    padding-bottom: 0.25em !important;
}

.pb-s {
    padding-bottom: 0.5em !important;
}

.pb-m {
    padding-bottom: 0.75em !important;
}

.pb-l {
    padding-bottom: 1em !important;
}
.pb-20 {
    padding-bottom: 5rem !important;
}

.pt-0 {
    padding-top: 0 !important;
}

.pt-xs {
    padding-top: 0.25em !important;
}

.pt-s {
    padding-top: 0.5em !important;
}

.pt-m {
    padding-top: 0.75em !important;
}

.pt-l {
    padding-top: 1em !important;
}

.pl-0 {
    padding-left: 0 !important;
}

.pl-xs {
    padding-left: 0.25em !important;
}

.pl-s {
    padding-left: 0.5em !important;
}

.pl-m {
    padding-left: 0.75em !important;
}

.pl-l {
    padding-left: 1em !important;
}

.pl-xl {
    padding-left: 1.25em !important;
}

.pr-0 {
    padding-right: 0 !important;
}

.pr-xs {
    padding-right: 0.25em !important;
}

.pr-s {
    padding-right: 0.5em !important;
}

.pr-m {
    padding-right: 0.75em !important;
}

.pr-l {
    padding-right: 1em !important;
}

.pr-xl {
    padding-right: 1.25em !important;
}

/* padding utilities */
.empty-xs {
    min-width: 0.25em !important;
    min-height: 0.25em !important;
    max-width: 0.25em !important;
    max-height: 0.25em !important;
}

.empty-s {
    min-width: 0.5em !important;
    min-height: 0.5em !important;
    max-width: 0.5em !important;
    max-height: 0.5em !important;
}

.empty-m {
    min-width: 0.75em !important;
    min-height: 0.75em !important;
    max-width: 0.75em !important;
    max-height: 0.75em !important;
}

.empty-l {
    min-width: 1em !important;
    min-height: 1em !important;
    max-width: 1em !important;
    max-height: 1em !important;
}

.empty-xl {
    min-width: 1.25em !important;
    min-height: 1.25em !important;
    max-width: 1.25em !important;
    max-height: 1.25em !important;
}

.width-inherit {
    width: inherit;
}

.container {
    width: 100%;
    height: 100%;
}

.d-block {
    display: block !important;
}
.d-inline-block {
    display: inline-block !important;
}

.flex {
    display: flex;
}

.flex-inline {
    display: inline-flex;
}

.flex.will-animate {
    transition: all 0.3s ease;
}

.col {
    flex-direction: column !important;
}

.row {
    flex-direction: row !important;
}

.spacebtw {
    justify-content: space-between !important;
}

.ai-flex-end {
    align-items: flex-end !important;
}

.ai-flex-start {
    align-items: flex-start !important;
}

.v-center {
    align-items: center !important;
}

.h-center {
    justify-content: center !important;
}

.vh-center {
    justify-content: center;
    align-items: center;
}

.jc-flexend {
    justify-content: flex-end !important;
}

.flex-wrap {
    flex-wrap: wrap;
}

.flex-no-wrap {
    flex-wrap: nowrap !important;
}

.flex-0-0-a {
    flex: 0 0 auto !important;
}

.flex-1 {
    flex-grow: 1;
    flex-shrink: 1;
    flex-basis: 0;
}

.flex-2 {
    flex-grow: 2;
    flex-shrink: 2;
    flex-basis: 0;
}

.flex-3 {
    flex-grow: 3;
    flex-shrink: 3;
    flex-basis: 0;
}

.flex-4 {
    flex-grow: 4;
    flex-shrink: 4;
    flex-basis: 0;
}

.width-fit {
    width: fit-content;
}

.width-full {
    width: 100%;
}

.height-full {
    height: 100% !important;
    max-height: 100% !important;
}

.no-overflow {
    overflow: hidden !important;
}

.overflow-hidden {
    overflow: hidden;
}

.center-text {
    text-align: center;
}
.end-text {
    text-align: end;
}

.svg-white {
    filter: brightness(100) invert(1) invert(1);
}

.svg-black {
    filter: brightness(100) invert(1);
}

.f-grow {
    flex-grow: 1;
}

.f-grow-2 {
    flex-grow: 2;
}

.f-shrink {
    flex-shrink: 1;
}

.grid {
    display: grid;
}

.grid-col-span-1 {
    grid-column: span 1;
}

.grid-col-span-2 {
    -ms-grid-column-span: 2;
    grid-column: span 2;
}

.grid-col-span-3 {
    grid-column: span 3;
}

.grid-col-span-full {
    grid-column: 1/-1;
}

.grid-row-span-2 {
    grid-row: span 2;
}

.grid-row-span-4 {
    grid-row: span 4;
}

.grid.two-col {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-gap: 0.5rem;
}

.grid.grid-col-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    grid-gap: 1rem;
}

.grid.grid-col-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    grid-gap: 1rem;
}

.grid.grid-col-5 {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    grid-gap: 1rem;
}

.grid.grid-gap-xxl {
    grid-gap: 2rem;
}

.grid.col-fluid {
    grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
    grid-gap: 1rem;
}

/* @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  .grid {
    display: flex;
  }

  .grid-col-span-full {
    flex-basis: 100%;
  }

  .grid.two-col {
    flex-wrap: wrap;

  }

  .grid.two-col > section {
    flex: 1;
    flex-basis: 49%;
  }

  .grid.two-col > section + section:nth-child(even){
    margin-left: 1rem;
  }
} */

.bg-white {
    background-color: white !important;
}

.w-ch-2 {
    width: 2ch;
}

.w-ch-4 {
    width: 4ch;
}

.w-ch-6 {
    width: 6ch;
}

.w-ch-8 {
    width: 8ch;
}

.w-ch-10 {
    width: 10ch;
}

.w-ch-12 {
    width: 12ch;
}

.w-ch-14 {
    width: 14ch;
}

.w-ch-16 {
    width: 16ch;
}

.w-ch-18 {
    width: 18ch;
}

.w-ch-20 {
    width: 20ch;
}

.w-ch-22 {
    width: 22ch;
}

.w-ch-24 {
    width: 24ch;
}

.w-ch-26 {
    width: 26ch;
}

.w-ch-28 {
    width: 28ch;
}

.w-ch-30 {
    width: 30ch;
}

.w-ch-32 {
    width: 32ch;
}

.w-ch-34 {
    width: 34ch;
}

.w-ch-36 {
    width: 36ch;
}

.w-ch-38 {
    width: 38ch;
}

.w-ch-40 {
    width: 40ch;
}

.w-ch-60 {
    width: 60ch;
}

.flex-container {
    display: flex;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.scroll-y {
    overflow-y: auto !important;
}

.scroll-x {
    overflow-y: auto !important;
}

.no-border {
    border: 0 !important;
}

.width-half {
    width: 50% !important;
}

.bt-0 {
    border-top: 0 !important;
}

.br-0 {
    border-right: 0 !important;
}

.bb-0 {
    border-bottom: 0 !important;
}

.bl-0 {
    border-left: 0 !important;
}

.silent {
    border: 0 !important;
}

/*=============== reset ===============*/
* {
    color: #000;
    font: inherit;
    font-family: "Pretendard Variable", sans-serif;
    font-weight: 500;
    letter-spacing: -0.45px;
    word-break: keep-all;
    word-wrap: break-word;
    overflow-wrap: break-word;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    vertical-align: baseline;
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
    margin: 0;
    padding: 0;
}
::-webkit-scrollbar {
    display: none; /* Chrome, Safari, Opera*/
    -webkit-appearance: none;
}
::-webkit-scrollbar-thumb {
    background-color: #e3e3e3;
}
::-webkit-scrollbar-track {
    width: 5px;
    height: 5px;
    background-color: #aaa;
    /*-webkit-box-shadow: 1 1 5px rgba(255, 255, 255, 1);*/
    -webkit-box-shadow: inset 0 0 9px rgba(0, 0, 0, 0.4);
}

::-webkit-scrollbar:vertical {
    width: 5px;
}

::-webkit-scrollbar:horizontal {
    height: 5px !important;
}
/*마감세일 스크롤*/
.modalArea.time .popWrap {
    scrollbar-width: 10px; /* Firefox */
    margin: 0;
    padding: 0;
}

.modalArea.time .listArea::-webkit-scrollbar,
.modalArea.time .goodslist::-webkit-scrollbar {
    width: 1rem;
    display: block;
    height: 5px;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block;
}
body {
    line-height: 1;
    overflow: hidden;
}
ol,
ul {
    list-style: none;
}
a {
    display: block;
    text-decoration: none;
}
input:focus,
textarea:focus,
a:focus,
button:focus,
select:focus {
    outline: none;
}
input,
textarea,
button,
select,
a {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
input:-webkit-autofill{
    box-shadow: 0 0 0 1000px #fff inset !important;
}
img {
    outline: none;
    border: none;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}
strong {
    font-weight: 500;
}
button {
    border: none;
    background: none;
}

/*=============== common ===============*/
.flex {
    display: flex;
    flex-direction: row;
    -webkit-box-orient: horizontal;
    flex-wrap: wrap;
    justify-content: space-between;
    -webkit-box-pack: justify;
    align-items: stretch;
    -webkit-box-align: stretch;
}
.numStyle {
    font-family: "GmarketSans", sans-serif;
    font-weight: 500;
}
.txt_title {
    display: block;
}

/*=============== layout ===============*/
/*header*/
#wrap {
    width: 100%;
    height: 100vh;
    overflow-y: hidden;
}
header {
    width: 100%;
    height: 60px;
    border-bottom: 1px solid #e7ebef;
    background: #fff;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 10;
}
header h2 {
    color: #1c1c1c;
    font-size: 1.063rem;
    text-align: center;
    line-height: 60px;
}
header .btn_prev {
    width: 37px;
    height: 37px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 50%;
    left: 4px;
    transform: translateY(-50%);
}
header .btn_category_search {
    width: 37px;
    height: 37px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 50%;
    right: 4px;
    transform: translateY(-50%);
}
header .btn_category_search .icon-search::before {
    width: 20px;
    height: 20px;
}
header .btn_barcode-black {
    width: 37px;
    height: 37px;
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
}
header .btn_barcode-black .icon-barcode::before{
    width: 32px;
    height: 32px;
}
/* 개발 클래스 겹침: 뒤로가기 STYLE 추가 */
header .btn_backwards {
    width: 37px;
    height: 37px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 50%;
    left: 4px;
    transform: translateY(-50%);
}
header .btn_close {
    width: 40px;
    height: 40px;
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
}

/*container*/
#container {
    height: 100%;
    overflow: hidden;
    position: relative;
    padding-top: 60px;
}
/*버튼 배경처리하고 싶을때*/
#container.gnb {
    /*padding-bottom:120px;*/
}
#container.gnb .content {
    padding-bottom: 120px;
}
.content,
.contents {
    width: 100%;
    height: 100%;
    overflow-y: auto;
}
.contents.border {
    border-top: 8px solid #f5f6f8;
}
.topArea {
    z-index: 10;
}

/*button area*/
.buttonArea {
    width: 100%;
    position: relative;
    top: 0;
    left: 0;
    padding: 0 16px 16px;
}
.buttonArea.bottom {
    padding-bottom: 0;
    position: fixed;
    top: auto;
    bottom: 30px;
    left: 0;
    z-index: 10;
}
.buttonArea.float {
    border-top: 1px solid #e7ebef;
    padding: 5px 16px 32px;
    background: #fff;
    bottom: 0;
}

/*scroll*/
#container.scroll {
    padding-bottom: 90px;
}
/*.scroll .buttonArea.bottom {*/
/*width: 100%;*/
/*border-top:1px solid #E0E0E0;*/
/*background: #fff;*/
/*padding: 16px;*/
/*margin-bottom: 0;*/
/*left:0;*/
/*bottom:0;*/
/*}*/
.scroll_cont .content {
    overflow: hidden;
}
#container.scroll_cont .contArea {
    overflow-y: auto;
    padding-bottom: 80px;
}

/*=============== modal area ===============*/
.modalArea {
    display: none;
}
.modalArea.active {
    display: block;
    z-index: 50;
}
.modalArea.z-10 {
    z-index: 30 !important;
}
.modalArea .bg_shadow {
    display: block;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.6);
    position: fixed;
    top: 0;
    left: 0;
    z-index: 12;
}

.modalArea .bg_shadow2 {
    display: block;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.3);
    position: fixed;
    top: 0;
    left: 0;
    z-index: 12;
}

.modalArea .popWrap {
    width: 85.33%;
    border-radius: 8px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    z-index: 12;
}
.modalArea .popWrap:has(.imgArea) {
    background: transparent;
}

.modalArea .popWrap .contArea {
    padding: 42px 0;
    background: #fff;
}

.modalArea .popWrap .txt_title {
    padding: 23px 0;
}

/*alert*/
.modalArea.alert .popWrap {
    /*min-height:219px;*/
    overflow: hidden;
}
.modalArea.alert .popWrap .fullimg img {
    width: 100%;
}
.modalArea.alert .popWrap .imgArea {
    display: flex;
    align-items: center;
    justify-content: space-around;
    padding: 14px 45px;
}
/* .modalArea.alert .popWrap .imgArea.redArea{
    padding: 0;
    background: #D72718;
} */
.modalArea.alert .popWrap.redArea {
    background: none;
}
.modalArea.alert .popWrap.redArea .imgArea {
    padding: 0;
    background: #d72718;
}
.modalArea.alert .popWrap img {
    display: block;
    max-width: 100%;
}

.modalArea.alert .popWrap .btn_close {
    position: absolute;
    top: 22px;
    right: 20px;
}

.modalArea.alert header {
    border-bottom: none;
    background: none;
}
.modalArea.alert .popWrap .txt_title {
    font-size: 1.125rem;
    text-align: center;
    line-height: 1.688rem;
    padding: 50px 16px;
}
.modalArea.alert .popWrap .txt_desc {
    color: #a2a3a4;
    font-size: 0.875rem;
    text-align: center;
    line-height: 1.25rem;
}
.modalArea.alert .buttonArea {
    padding: 0 16px 16px;
    position: relative;
    bottom: auto;
}
.modalArea.alert .buttonArea a {
    width: 100%;
    height: 44px;
    font-size: 0.938rem;
    border-radius: 5px;
}
.modalArea .buttonArea {
    padding: 3px 16px 16px;
}
.modalArea .buttonArea.col_2 a {
    width: calc(50% - 3px);
}
.modalArea .buttonArea.col_2 button {
    width: calc(50% - 3px);
}
.modalArea .buttonArea.row_2 a:last-child {
    margin-top: 10px;
}

.modalArea.fullmodal .popWrap {
    padding: 0;
}
.modalArea.fullmodal .imgArea img {
    width: 100% !important;
    border-radius: 12px;
}
/* 긴급재난지원금관련 팝업 */
.modalArea.pay * {
    letter-spacing: -0.05rem;
}
.modalArea.pay .popWrap .alert_title {
    position: relative;
    font-size: 2.125rem;
    font-weight: 900;
    text-align: center;
    padding: 30px 0 15px;
}
.modalArea.pay .alert_title:after {
    content: "";
    display: block;
    width: 49.89px;
    height: 75.89px;
    position: absolute;
    left: 0;
    top: 0;
    background: url(../images/img/img_popup_pay.png);
}
.modalArea.pay .popWrap .alert_title span {
    display: block;
    font-size: 1.125rem;
    line-height: 1.462rem;
    font-weight: 700;
    padding-bottom: 8px;
}
.modalArea.pay .popWrap .alert_title strong {
    display: block;
    padding-bottom: 10px;
    color: #fe4a4a;
    line-height: 2.25rem;
    font-weight: 900;
}
.modalArea.pay .popWrap .alert_txt {
    font-size: 1.0625rem;
    line-height: 1.687rem;
    font-weight: 500;
    padding-bottom: 15px;
    text-align: center;
}
.modalArea.pay .popWrap .alert_txt strong {
    font-size: 1.25rem;
    display: inline-block;
    font-weight: 700;
}
.modalArea.pay .popWrap .logo {
    text-align: right;
    padding: 0 17px 10px;
}
.modalArea.pay .popWrap .logo img {
    width: 3.75rem;
}
.modalArea.pay .buttonwrap {
    display: flex;
}
.modalArea.pay .buttonwrap a {
    width: 50%;
    border-radius: 0;
    font-size: 0.75rem;
}
.modalArea.pay .buttonwrap a:nth-child(1) {
    background: #404040;
    border-radius: 0 0 0 10px;
}
.modalArea.pay .buttonwrap a:nth-child(2) {
    background: #000;
    border-radius: 0 0 10px 0;
}

/*bottom*/
.modalArea.bottom .popWrap {
    width: 100%;
    border-radius: 0;
    top: auto;
    bottom: -60%;
    left: 0;
    transform: none;
}
.modalArea.bottom .popWrap.bottom0 {
    /*top: 60px !important;*/
    bottom: 0 !important;
}
.modalArea.half .popWrap {
    height: auto;
}

.modalArea.large .popWrap {
    /*height:760px;*/
    height: 93.59%;
    overflow-y: auto;
    border-radius: 20px 20px 0 0;
}
.modalArea.large .contArea {
    border-radius: 20px 20px 0 0;
}

/*full*/
.modalArea.full {
    width: 100%;
    height: 100vh;
    overflow-y: auto;
    position: absolute;
    bottom: 0;
    left: 0;
}
.modalArea.full header {
    z-index: 13;
}
.modalArea.full .popWrap {
    width: 100%;
    height: calc(100% - 60px);
    border-radius: 0;
    position: absolute;
    top: 60px;
    left: 0;
    transform: none;
}
.modalArea.full .popWrap .contArea {
    padding: 0;
}
.sm_popWrap {
    width: 85.33% !important;
    height: auto !important;
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    transform: translate(-50%, -50%) !important;
    border-radius: 12px !important;
}

/*=============== float area ===============*/
.floatArea {
    display: none;
    width: 100%;
    position: fixed;
    top: 163px;
}
.floatArea.active {
    display: block;
}
.floatArea .bg_shadow {
    display: block;
    width: 100vw;
    height: calc(100vh - 163px);
    background: rgba(0, 0, 0, 0.6);
    position: absolute;
    top: 0;
    left: 0;
}
.floatArea .contArea {
    width: 100%;
    background: #f4f4f4;
    position: relative;
    top: -100%;
}
.floatArea .martWrap {
    /* padding:0 0 0 4.66%; */
}
.floatArea .martWrap .list_menu {
}
.floatArea .list_menu li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 48px;
    text-indent: 16px;
    border-bottom: 1px solid #e0e0e0;
}
.win_mart,
.win_mart span {
    font-size: 1rem;
    font-weight: bold;
    color: #000;
    margin-top: 10px;
}
.floatArea .list_menu li:first-child {
    border-top: 1px solid #e0e0e0;
}
.floatArea .list_menu li:last-child {
    border-bottom: none;
}
.floatArea .list_menu li.select::after {
    content: url("../images/icon/icon_sel_menu.svg");
    padding: 0 6.99%;
}
.floatArea .martWrap .closeArea {
    height: 24px;
    text-align: center;
    border-top: 1px solid #e0e0e0;
    background: #fff;
}
.floatArea .martWrap .closeArea .btn_close {
    width: 100%;
    height: 100%;
}
.floatArea .martWrap .closeArea .btn_close .icon {
    vertical-align: super;
}

/*=============== policy ===============*/
.box_check_policy {
    margin-top: 20px;
    margin-left: 0;
}
.box_check_policy li {
    margin-bottom: 18px;
    line-height: 1.5rem;
}
.box_check_policy span {
    color: #1c1c1c;
    font-size: 0.875rem;
    font-weight: 400;
}
.box_check_policy a {
    float: right;
    color: #9b9b9b;
    font-size: 0.688rem;
}

/*=============== input ===============*/
/*text*/
input[type="text"],
input[type="password"],
input[type="email"],
input[type="number"] {
    width: 100%;
    height: 42px;
    line-height: 42px;
    color: #020202;
    font-size: 0.875rem;
    font-weight: 400;
    border: 1px solid #b7b7b7;
    border-radius: 4px;
    padding: 0 16px;
    background: transparent;
    outline: none;
    -webkit-appearance: none;
    -moz-appearance: none;
}
input[type="text"].gray,
input[type="number"].gray,
input[type="password"].gray {
    background: #f4f4f4;
}

/*placeholder*/
input[type="password"]::-webkit-input-placeholder,
input[type="number"]::-webkit-input-placeholder,
input[type="text"]::-webkit-input-placeholder {
    /* Edge */
    color: #888;
    font-family: "Pretendard Variable", sans-serif;
    font-size: 0.875rem;
    font-weight: 400;
}
input[type="password"]:-ms-input-placeholder,
input[type="number"]:-ms-input-placeholder,
input[type="text"]:-ms-input-placeholder {
    /* Internet Explorer 10-11 */
    color: #888;
    font-family: "Pretendard Variable", sans-serif;
    font-size: 0.875rem;
    font-weight: 400;
}
input[type="password"]::placeholder,
input[type="number"]::placeholder,
input[type="text"]::placeholder {
    color: #888;
    font-family: "Pretendard Variable", sans-serif;
    font-size: 0.875rem;
    font-weight: 400;
}

/*checkbox basic*/
.box_checkbox {
    display: flex;
    align-items: center;
    position: relative;
}
.box_checkbox input[type="checkbox"] {
    opacity: 0;
    width: 26px;
    height: 26px;
    vertical-align: middle;
    margin-right: 9px;
}
.box_checkbox .icon_check {
    display: block;
    width: 26px;
    height: 26px;
    background: #fff url("../images/icon/icon_checkbox_basic.png") no-repeat;
    background-size: contain;
    position: absolute;
    top: 0;
    left: 0;
}
.box_checkbox input[type="checkbox"]:checked ~ .icon_check {
    background: #fff url("../images/icon/icon_checkbox_basic_on.png") no-repeat;
}

/*checkbox check*/
.box_checkbox.check input[type="checkbox"] {
    width: 22px;
    height: 22px;
}
.box_checkbox.check .icon_check {
    width: 22px;
    height: 22px;
    background: #fff url("../images/icon/icon_checkbox_red.png") no-repeat;
    background-size: contain;
}
.box_checkbox.check input[type="checkbox"]:checked ~ .icon_check {
    background: #fff url("../images/icon/icon_checkbox_red_on.png") no-repeat;
    background-size: contain;
}

/*checkbox red*/
.box_checkbox.red input[type="checkbox"] {
    width: 22px;
    height: 22px;
}
.box_checkbox.red .icon_check {
    width: 22px;
    height: 22px;
    background: #fff url("../images/icon/icon_checkbox_red.png") no-repeat;
    background-size: contain;
}
.box_checkbox.red input[type="checkbox"]:checked ~ .icon_check {
    background: #fff url("../images/icon/icon_checkbox_red_on.png") no-repeat;
    background-size: contain;
}

/*sm*/
.box_checkbox.sm {
    vertical-align: text-top;
}
.box_checkbox.sm input[type="checkbox"] {
    width: 22px;
    height: 22px;
}
.box_checkbox.sm .icon_check {
    width: 22px;
    height: 22px;
    background-size: contain;
}
.box_checkbox.sm input[type="checkbox"]:checked ~ .icon_check {
    background-size: contain;
}

/*like*/
.box_checkbox.like input[type="checkbox"] {
    width: 16px;
    height: 16px;
}
.box_checkbox.like .icon_check {
    width: 18px;
    height: 18px;
    background: #fff url("../images/icon/icon_like_2.png") no-repeat;
    background-size: contain;
}
.box_checkbox.like.gray2 .icon_check {
    width: 18px;
    height: 18px;
    background: #fff url("../images/icon/icon_home_like.png") no-repeat;
    background-size: contain;
    z-index: -1;
}
.box_checkbox.like.gray2 ~ .icon_motion {
    width: 62px;
    height: 65px;
    background: url("../images/icon/icon_home_like_click.png") no-repeat;
    background-size: contain;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: -1;
}
/***
.box_checkbox.like.gray2 ~ .icon_motion::before {
    content:'';
    width:98px;
    height:26px;
    background:url('../images/icon/icon_home_like_txt.png') no-repeat;
    background-size:contain;
    position:absolute;
    top:-7px;
    left:50%;
    margin-left:-49px;
    animation:likeTxt .1s 3s ease forwards;
}
***/
@keyframes likeTxt {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}
.box_checkbox.like input[type="checkbox"]:checked ~ .icon_check {
    background: #fff url("../images/icon/icon_like_on.png") no-repeat;
    background-size: contain;
}

/*like red*/
input[type="checkbox"].like.red {
    width: 18px;
    height: 18px;
}
input[type="checkbox"].like.red::before {
    width: 18px;
    height: 18px;
    background: #fff url("../images/icon/icon_like.svg") no-repeat;
    background-size: contain;
}
input[type="checkbox"].like:checked::before {
    background: #fff url("../images/icon/icon_like_on.svg") no-repeat;
    background-size: contain;
}

/*pick*/
.box_checkbox.pick {
    background: #fff;
}
.box_checkbox.pick input[type="checkbox"] {
    width: 50px;
    height: 50px;
}
.box_checkbox.pick .icon_check {
    width: 50px;
    height: 50px;
    border-radius: 6px;
    background: #fff url("../images/icon/icon_prod_pick.png") no-repeat;
    background-size: contain;
}
.box_checkbox.pick input[type="checkbox"]:checked ~ .icon_check {
    background: #fff url("../images/icon/icon_prod_pick_on.png") no-repeat;
    background-size: contain;
}

/*radio type*/

.box_checkbox.circle input[type="checkbox"] {
    width: 23px;
    height: 23px;
}
.box_checkbox.circle .icon_check {
    width: 24px;
    height: 24px;
    border-radius: 50%;

    background: #fff url("../images/icon/icon_radio_red.png") no-repeat;
    background-size: contain;
}
.box_checkbox.circle input[type="checkbox"]:checked ~ .icon_check {
    border-radius: 50%;
    background: #fff url("../images/icon/icon_radio_red_on.png") no-repeat;
    background-size: contain;
}

/*check box all*/
.box_check_all {
    padding: 15px 0 20px;
    border-bottom: 1px solid #d9d9d9;
}
.box_check_all span {
    font-size: 0.938rem;
}

/*radio basic*/
.box_radioBtn {
    display: flex;
    align-items: center;
    position: relative;
}
.box_radioBtn input[type="radio"] {
    opacity: 0;
    width: 24px;
    height: 24px;
    margin-right: 8px;
}
.box_radioBtn .icon_check {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: #fff url("../images/icon/icon_radio_basic.svg") no-repeat;
    background-size: contain;
    position: absolute;
    top: 1px;
    left: 0;
}
.box_radioBtn input[type="radio"]:checked ~ .icon_check {
    border-radius: 50%;
    background: #fff url("../images/icon/icon_radio_basic_on.svg") no-repeat;
}

/*radio red*/
.box_radioBtn.red input[type="radio"] {
    width: 24px;
    height: 24px;
}
.box_radioBtn.red .icon_check {
    width: 24px;
    height: 24px;
    background: #fff url("../images/icon/icon_radio_red.png") no-repeat;
    background-size: contain;
}
.box_radioBtn.red input[type="radio"]:checked ~ .icon_check {
    background: #fff url("../images/icon/icon_radio_red_on.png") no-repeat;
    background-size: contain;
}

/*toggle*/
.toggle {
    width: 48px;
    height: 24px;
    position: relative;
}
.toggle input[type="radio"] {
    opacity: 0;
    width: 24px;
    height: 24px;
    margin-right: 0;
    position: absolute;
    top: 0;
    z-index: 10;
}
.toggle input[type="radio"].on {
    left: 0;
}
.toggle input[type="radio"].off {
    right: 0;
}
.bg_toggle {
    width: 39px;
    height: 22px;
    background: #fff url("../images/icon/icon_radio_toggle.png") no-repeat;
    background-size: contain;
    position: absolute;
    top: 0;
    left: 0;
}
.toggle.on .bg_toggle {
    background: #fff url("../images/icon/icon_radio_toggle_on.png") no-repeat;
    background-size: contain;
}

/*textarea*/
.box_txt textarea {
    width: 100%;
    min-height: 210px;
    border-color: #b7b7b7;
    border-radius: 10px;
    background: #f7f7f7;
    padding: 10px 14px;
}
.box_txt textarea::-webkit-input-placeholder {
    /* Edge */
    color: #b4b4b4;
    font-size: 0.938rem;
    font-weight: 400;
}
.box_txt textarea:-ms-input-placeholder {
    /* Internet Explorer 10-11 */
    color: #b4b4b4;
    font-size: 0.938rem;
    font-weight: 400;
}
.box_txt textarea::placeholder {
    color: #b4b4b4;
    font-size: 0.938rem;
    font-weight: 400;
}

/*select*/
.box_select {
    position: relative;
}
.box_select select {
    width: 100%;
    height: 5.91vh;
    color: #888;
    font-size: 0.813rem;
    border: 1px solid #d9d9d9;
    border-radius: 6px;
    margin-bottom: 10px;
    padding: 0 16px;
    appearance: none;
    -webkit-appearance: none;
    outline: none;
}
.box_select select::-ms-expand {
    display: none;
}
.box_select .icon_arrow {
    border-top: 6px solid #2f2f2f;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    position: absolute;
    top: 2.7vh;
    right: 15px;
}

/*custom select*/
/*select*/
.selectWrap {
    position: relative;
}
.selectWrap select {
    display: none;
}
.box_select {
    background: #fff;
}
select.disabled ~ .box_select {
    background: #f7f7f7;
}
.box_select::after {
    content: "";
    width: 0;
    height: 0;
    border-top: 5px solid #8b8b8b;
    border-right: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-left: 5px solid transparent;
    margin-left: 5px;
    position: absolute;
    top: 50%;
    right: 16px;
    transform: translateY(-50%);
}
.box_select.btn_active:after {
    border-bottom: 5px solid #8b8b8b;
    border-right: 5px solid transparent;
    border-top: 5px solid transparent;
    border-left: 5px solid transparent;
    top: 15px;
}
.box_select {
    height: 44px;
    color: #8b8b8b;
    font-size: 0.875rem;
    font-weight: 400;
    padding: 12px 3.2%;
    border: 1px solid #b7b7b7;
    border-radius: 4px;
}
.box_select.btn_active {
    border-radius: 4px 4px 0 0;
}
.list_select {
    width: 100%;
    border-left: 1px solid #b7b7b7;
    border-right: 1px solid #b7b7b7;
    border-bottom: 1px solid #b7b7b7;
    border-radius: 0 0 4px 4px;
    background: #f4f4f4;
    position: relative;
    top: 100%;
    left: 0;
    z-index: 99;
}
.list_select div {
    height: 44px;
    color: #1c1c1c;
    font-size: 0.875rem;
    padding: 12px 3.2%;
    border-bottom: 1px solid #b7b7b7;
    cursor: pointer;
}
.list_select div:last-child {
    border-bottom: none;
}
.hide_select {
    display: none;
}

/*sort wrap*/
.sortWrap {
    width: 100%;
    overflow-x: auto;
    background: #fff;
}
.sortWrap .box_sort {
    width: 100%;
    padding: 11px 20px;
    border-bottom: 1px solid #ebebeb;
}
.sortWrap .box_sort > ul {
    display: flex;
}
.sortWrap .box_sort li {
    display: block;
    color: #bfc4c9;
    height: 26px;
    font-size: 0.938rem;
    line-height: 25px;
    white-space: nowrap;
    border: 1px solid #bfc4c9;
    border-radius: 8px;
    box-sizing: content-box;
    padding: 0 16px;
    margin-right: 10px;
    background: #fff;
}
.sortWrap .box_sort li.select {
    color: #fff;
    font-size: 0.938rem;
    font-weight: bold;
    border: 1px solid #2e2e2e;
    background: #2e2e2e;
}

/*filter select*/
.box_subFilter .selectWrap.sub_filter {
    min-width: 115px;
    position: relative;
    left: -4.26%;
}
.box_subFilter .selectWrap.sub_filter.left {
    left: 0;
}
.selectWrap.sub_filter .box_select {
    height: auto;
    font-weight: 500;
    text-align: right;
    padding: 0;
    border: none;
    background: none;
}
.selectWrap.sub_filter .list_select {
    min-width: 100px;
    border: 1px solid #d8d8d8;
    border-radius: 8px;
    box-shadow: 0 3px 6px #00000029;
    background: #ffffff;
    position: absolute;
    top: 25px;
    left: auto;
    right: -16px;
}
.selectWrap.sub_filter.left .list_select {
    left: 0;
}
.selectWrap.sub_filter .list_select div {
    height: 38px;
    color: #767676;
    font-size: 0.875rem;
    text-align: right;
    line-height: 38px;
    padding: 0 17px;
}
.selectWrap.sub_filter .list_select div:last-child {
    border-bottom: none;
}
.selectWrap.sub_filter .box_select::after {
    top: 12px;
    right: -16px;
}
.selectWrap.sub_filter .box_select.btn_active:after {
    top: 7px;
}
.selectWrap.sub_filter.top .box_select::after {
    top: 50%;
    transform: translateY(calc(-50% + 2px));
}
.selectWrap.sub_filter.middle .box_select::after {
    top: 9px;
}
.selectWrap.sub_filter.top .box_select.btn_active:after {
    transform: translateY(calc(-50% - 3px));
}

/*button*/
.btn {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 52px;
    color: #fff;
    border: none;
    border-radius: 5px;
}
.btn.disabled {
    background: #d9d9d9 !important;
}
.btn_border-bottom {
    border-bottom: 1px solid #000;
}
.btn_basic {
    width: 100%;
    font-weight: bold;
    background: #fd5050;
}
.btn_half {
    width: calc(50% - 3px) !important;
}
.btn_basic:disabled {
    color: #fff !important;
    border: 1px solid #d9d9d9 !important;
    background: #d9d9d9 !important;
}
.btn-order {
    height: 27px;
    line-height: 25px;
    color: #fd5050;
    font-weight: bold;
    background: #ffeded;
    border: 1px solid #fd5050;
    padding: 0 0.5rem;
    border-radius: 6px;
    text-align: center;
}
.btn_basicline {
    width: 100%;
    font-weight: bold;
    color: #fd5050;
    border: 1px solid #fd5050;
    background: #fff;
}
.btn_basic.dark {
    background: #333;
}

.btn_basic.secondary {
    background: #d3d3d3;
    font-weight: 500;
}
.btn_check {
    float: right;
    min-width: 22.26%;
    height: 35px;
    color: #fff;
    font-size: 0.875rem;
    background: #48ca45;
    padding: 0 9px;
}
.btn_line {
    width: 33%;
    height: 52px;
    color: #fd5050;
    font-weight: bold;
    border: 1px solid #fd5050;
    background: none;
}
.btn_line_2 {
    color: #333333;
    font-weight: bold;
    border: 1px solid #b7b7b7;
    margin-top: 10px;
}
.btn_line_3 {
    color: #a5a5a5;
    font-weight: bold;
    border: 1px solid #b7b7b7;
}
.message_txt {
    margin-bottom: 35px;
    line-height: 20px;
    font-weight: 400;
    font-size: 15px;
    text-align: center;
}
.buttonOut {
    width: 100%;
    position: absolute;
    bottom: 0px;
}
.closebtn-Out {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    position: absolute;
    top: -50px;
    right: 0;
}
.btn_out {
    color: #fff;
    font-size: 0.875rem;
    position: absolute;
    right: 0;
    padding: 0 20px;
    height: 40px;
}
.btn_out.left {
    left: 0;
    right: auto;
}
.btn_out.underline {
    border-bottom: 1px solid #fff;
    padding-bottom: 3px;
}
.btn.arrow {
    display: flex;
    justify-content: space-between;
    width: 59.73%;
    padding: 0 30px;
    margin: auto;
}

/*tab*/
.box_tab {
    width: 100%;
    border-bottom: 1px solid #e7ebef;
    padding: 20px 4.26%;
}
.box_tab li span,
.box_tab li {
    width: 33.33%;
    color: #b7b7b7;
    font-size: 0.938rem;
    text-align: center;
}
.box_tab li a {
    display: inline-block;
    color: #b7b7b7;
    font-size: 0.938rem;
}
.box_tab li.active {
    position: relative;
}
.box_tab li.active,
.box_tab li.active a,
.box_tab li.active span {
    color: #fd5050;
    font-weight: bold;
}
.box_tab li.active::after {
    content: "";
    width: 100%;
    height: 2px;
    background: #fd5050;
    position: absolute;
    bottom: -16px;
    left: 0;
}

/*black*/
.box_tab.black {
    height: 50px;
    align-items: center;
    padding: 0 4.26%;
}
.box_tab.black li.active {
    color: #1c1c1c;
}
.box_tab.black li.active a {
    display: inline-block;
    color: #1c1c1c;
    margin-bottom: 0;
}
.box_tab.black li.active span {
    color: #1c1c1c;
}
.box_tab.black li.active::after {
    display: none;
}
.box_tab.black li.active a::after {
    content: "";
    display: block;
    width: 100%;
    height: 2px;
    background: #222222;
    position: relative;
    top: 16px;
}

/*sub tab*/
.box_tab_sub {
    display: flex;
    align-items: center;
    width: 100%;
    height: 50px;
    border-top: 1px solid #e7ebef;
    border-bottom: 1px solid #e7ebef;
    padding: 0 4.26%;
}
.box_tab_sub li {
    display: inline-block;
    color: #b7b7b7;
    font-size: 0.875rem;
    text-align: center;
    padding: 0 14px;
}
.box_tab_sub li:first-child {
    padding-left: 4px;
}
.box_tab_sub li:nth-child(2) {
    border-left: 1px solid #e7ebef;
    border-right: 1px solid #e7ebef;
}
.box_tab_sub li a {
    display: inline-block;
    color: #b7b7b7;
    font-size: 0.938rem;
}
.box_tab_sub li.active {
    color: #222222;
    font-weight: bold;
    position: relative;
}
.box_tab_sub li.active,
.box_tab_sub li.active a {
    display: inline-block;
    color: #1c1c1c;
    margin-bottom: 0;
    font-weight: bold;
}

/*slide*/
.box_slide {
    outline: none;
}
.slick-dots {
    text-align: center;
    padding: 20px 0 0;
}
.slick-dots li {
    display: inline-block;
    width: 6px;
    height: 6px;
    text-indent: -9999px;
    overflow: hidden;
    border-radius: 6px;
    vertical-align: middle;
    background: #d9d9d9;
    margin: 0 5px;
}
.slick-dots li.slick-active {
    border-radius: 10px;
}

/*badge*/
.box_badge {
    font-size: 0.625rem;
}
.box_badge li {
    display: inline-block;
    padding-right: 5px;
}
.box_badge span {
    color: #fff;
    font-size: 0.688rem;
}
.box_badge .badge {
    height: 18px;
    font-weight: bold;
    line-height: 18px;
    border-radius: 6px;
    padding: 0 7px;
}

.box_badge .badge {
    display: inline-block;
}
.box_badge .badge.disc {
    background: #48ca45;
}

.box_badge .badge.limit {
    background: #fd5050;
}
.box_badge .badge.point {
    color: #429f3f;
    font-weight: bold;
    background: #c8f0c7;
}
.box_badge .badge.point span {
    color: #429f3f;
    font-weight: bold;
}
.cart-box_badge {
    display: flex;
    align-items: center;
}
.cart-box_badge > span {
    font-size: 12px;
    padding: 0 8px;
}
.cart .cart-box_badge > span {
    font-size: 11px;
}
.cart-box_badge > span:first-child {
    padding-left: 3px;
}
.badge_strong {
    color: #fd5050 !important;
}
.badge_strong .numStyle {
    font-weight: bold;
    color: #fd5050 !important;
}
.badge_basic {
    color: #909090 !important;
}
.badge_basic .numStyle {
    color: #909090 !important;
}
span.badge_separator {
    display: inline-block;
    width: 1px;
    height: 10px;
    background-color: #e0e0e0;
    padding: 0;
}

/*=============== product list ===============*/
.list_prod {
    width: 100%;
    overflow-x: auto;
}
.list_prod > ul {
    overflow: hidden;
    padding: 0 12px 0;
}
.list_prod > ul > li {
    display: inline-block;
    width: calc(50% - 6px);
    border: 1px solid #e7ebef;
    border-radius: 12px;
    vertical-align: top;
    background: #fff;
    margin-right: 6px;
    margin-bottom: 10px;
    position: relative;
    min-height: 292px;
}
.list_prod.list_h > ul > li {
    min-height: 255px;
}
.list_prod > ul > li a {
    /*width:166px;*/
    /*min-height:309px;*/
    padding: 13px 10px;
    height: 100%;
    /*margin-right:7px;*/
}
.list_prod > ul > li:last-child a::after {
    content: "";
    width: 16px;
    height: 100%;
    display: inline-block;
    position: absolute;
    right: -16px;
    top: 0;
}
.list_prod .img_prod {
    width: 100%;
    height: auto;
    text-align: center;
    padding: 0 10px;
    margin: auto;
    position: relative;
}
.list_prod .img_prod img {
    width: 147.5px;
    height: 147.5px;
}
@media (min-width: 414px) {
    .list_prod .img_prod img {
        width: 152px;
        height: 152px;
    }
    div.list_prod > ul > li.soldOut::after,
    .prod_list .list_prod > ul > li.soldOut::after {
        height: 166px;
    }
}

@media screen and (max-width: 375px) {
    .list_prod .img_prod {
        height: 0;
        padding: 50%;
    }
    .list_prod .img_prod img {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: calc(100% - 10px);
        height: calc(100% - 10px);
        max-width: 147.5px;
        max-height: 147.5px;
    }
    div.list_prod > ul > li.soldOut::before,
    .prod_list .list_prod > ul > li.soldOut::before {
        top: 40%;
    }
    div.list_prod:not(.txt) > ul > li.soldOut::after,
    .prod_list .list_prod:not(.txt) > ul > li.soldOut::after {
        height: 0;
        padding: calc(50% + 15px) 50%;
        box-sizing: border-box;
    }
    .index div.list_prod:not(.txt) > ul > li.soldOut::after,
    .index .prod_list .list_prod:not(.txt) > ul > li.soldOut::after{
        padding: calc(50% + 7.5px) 50%;
    }
    .list_prod.list_h > ul > li {
        min-height: 0;
        padding-bottom: 10px;
    }
}

.list_prod .btn_cart {
    width: 40px;
    height: 40px;
    color: #fd5050;
    border: 1px solid #ffacac;
    border-radius: 10px;
    background: #fff;
    position: absolute;
    bottom: 8px;
    right: 0;
    z-index: 3;
}
.list_prod .btn_cart.active {
    border: 1px solid #fd5050;
    background: #fd5050;
}
.list_prod .offline {
    color: #333333;
    font-size: 0.5rem;
    border-color: #909090;
}
.list_prod .soldOut {
    color: #fff;
    font-size: 1rem;
}
.list_prod .txt_name {
    display: block;
    min-height: 49px;
    font-size: 0.938rem;
    border-top: 1px solid #eee;
    /* padding-top:5px; */
    /*padding:11px 13px 0;*/
    padding: 5px 10px 0;
    width: 100%;
    overflow: hidden;
    display: -webkit-box;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    line-height: 1.25rem;
}
.list_prod .list_price {
    min-height: 47px; /*20221223 상품 UI 변경 시 가격 영역 요소 크기 확대로, 최소 높이 증가 처리(기존: 42px)_이승미*/
    padding: 0 10px;
    padding-top: 5px;
}
.list_prod .list_price .num_dc {
    font-size: 0.875rem;
    font-family: "GmarketSans", sans-serif;
    font-weight: 400;
    padding-right: 0px;
}
.list_prod .list_price .num_dc strong {
    font-size: 1rem;
    font-weight: 600;
    color: #fd5050;
}
.list_prod .list_price .num_price {
    font-size: 0.875rem;
    font-weight: 400;
    padding-right: 5px;
}
.list_prod .list_price .num_price strong {
    font-size: 1rem;
    font-weight: 500;
}
.list_prod .list_price .num_disc {
    display: block;
    color: #8b8b8b;
    font-size: 0.75rem;
    font-weight: 400;
    /*text-decoration: line-through; 20230131 취소선 영역 변경으로 인해 주석처리(숫자에만 취소선 표시)*/
    padding-top: 3px;
}

.list_prod .list_price .num_disc strong {
    color: #8b8b8b;
    font-size: 0.625rem;
    vertical-align: middle;
    text-decoration: line-through; /*20230131 취소선 영역 변경으로 인해 추가(숫자에만 취소선 표시)*/
}
.list_prod .box_badge {
    position: absolute;
    left: 13px;
    top: 138px;
}
.list_prod .box_badge .badge {
    font-size: 0.5rem;
    border-radius: 6px 6px 0 6px;
    margin-right: 2px;
}

.list_prod .box_order {
    display: flex;
    justify-content: flex-end;
    text-align: right;
    padding: 0 10px;
}
.list_prod:not(.txt) .box_order{
    position: absolute;
    bottom: 7px;
    left: 0;
    right: 0;
    padding: 0 7px;
    justify-content: space-between;
    align-items: center;
    z-index: 9;
}
.list_prod:not(.txt) .box_order:has(li:only-child){
    justify-content: flex-end;
}
.list_prod .box_order li {
    display: flex;
    align-items: center;
    justify-items: center;
    width: 37px;
    height: 37px;
    position: relative;
}
.list_prod .box_order li .icon-list-offline {
    margin-left: 10px;
}
.list_prod .box_order li > button {
    margin: auto;
}
.list_prod .btn_wish {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 37px;
    height: 37px;
    position: absolute;
    bottom: 13px;
    left: 5px;
    padding-top: 4px;
}
.list_prod .btn_wish span {
    display: block;
    width: 20px;
    height: 17px;
    background: url("../images/icon/icon_wish.png") no-repeat;
    background-size: contain;
}
.list_prod .btn_wish.on span {
    background: url("../images/icon/icon_wish_on.png") no-repeat;
    background-size: contain;
}

.list_prod:not(.txt) .box_order > li > button{
    display: flex;
    width: 37px;
    height: 37px;
    margin: 0;
    justify-content: center;
    align-items: center;
    background: #fff;
    border-radius: 50%;
    box-shadow: 1.66px 3.32px 3.32px 0px #9A939378;
}
.list_prod:not(.txt) .box_order .btn_wish{
    position: relative;
    bottom: auto !important;
    left: auto;
    padding-top: 0;
}

/* 20240729 이미지 없는 상품 텍스트형 노출 추가 - home.css에서 이관 */
.list_prod.txt {
}
.list_prod + .list_prod.txt {
    padding-top: 0;
    overflow-x: hidden;
}
.list_prod.txt > ul {
    display: block !important;
    overflow: visible;
}
.list_prod.txt > ul > li {
    display: block;
    min-width: 0 !important;
    width: 100% !important;
    min-height: 0;
    margin: 0;
    border-radius: 0;
    border: none;
    border-bottom: 1px solid #e7ebef;
}
.list_prod.txt > ul > li > a {
    min-height: 0 !important;
    padding: 15px 50px 15px 15px !important;
    margin-right: 0 !important;
    position: relative;
}
.list_prod.txt > ul > li > a > .img_prod {
    display: none;
}
.list_prod.txt > ul > li > a > .img_prod > img {
}
.list_prod.txt > ul > li > a > .txt_name {
    /* display: inline; */
    min-height: 0;
    height: auto;
    padding: 0;
    margin: 0;
    font-size: 16px;
    vertical-align: middle;
    border: none;
}
.list_prod.txt > ul > li > a .box_badge {
    display: inline;
    left: auto;
    right: auto;
    top: auto;
    vertical-align: bottom;
    position: relative !important;
    margin: 0 !important;
}
.list_prod.txt > ul > li > a .box_badge .badge {
    padding: 0 7px;
    margin: 0 4px 0 0;
    font-size: 0.5rem;
    background: #fd5050;
    border-radius: 6px 6px 0 6px;
}
.list_prod.txt > ul > li > a .badge_design {
    top: -4px;
    right: 2px;
    z-index: 0;
}
.list_prod.txt > ul > li > a .badge_design > span {
    width: 45px;
    height: 45px;
    padding-top: 9px;
}
.list_prod.txt > ul > li > a > .list_price {
    min-height: 0;
    margin-top: 0;
    padding: 7px 0 0 30px;
}
.list_prod.txt > ul > li > a > .list_price .num_disc {
    padding: 0 4px 0 0;
}
.list_prod.txt > ul > li > a > .list_price .num_price {
}
.list_prod.txt > ul > li > a > .list_price .num_price .numStyle {
}
.list_prod.txt > ul > li > a > .box_order {
    position: absolute;
    bottom: 5px;
    right: 6px;
    padding: 0;
    z-index: 2;
}
.list_prod.txt > ul > li > a > .box_order > li {
}
.list_prod.txt > ul > li > a > .box_order > li .btn_buy {
}
.list_prod.txt > ul > li > a > .btn_wish {
    bottom: 5px;
    left: 6px;
    padding: 0;
    z-index: 2;
}

.list_prod.txt > ul > li.soldOut::before {
    top: 15px !important;
    right: 12px;
}
.list_prod.txt > ul > li.soldOut::after {
    height: auto !important;
    bottom: 0;
    border-radius: 0 !important;
    z-index: 0;
}

.snb .list_prod.txt > ul > li:last-of-type {
    margin-bottom: 10px;
}
.snb .list_prod.txt > ul > li .txt_name {
    line-height: 1.25rem;
}
.snb .list_prod.txt > ul > li > a > .box_order {
    bottom: 7px;
}

/* ===============팝업 안에 리스트 ===============*/
.modalArea.time .popWrap {
    width: 93%;
}
.modal-list_prod {
    width: 100%;
    overflow: visible;
    padding-bottom: 20px;
}
.modal-list_prod > ul > li {
    width: 200px !important;
    position: relative;
}
.modal-list_prod .img_prod {
    width: 200px;
    height: 200px;
    text-align: center;
    padding: 10px;
    border: 1px solid #e7ebef;
    border-radius: 10px;
    margin: auto;
    position: relative;
    overflow: hidden;
}
.modal-list_prod .img_prod img {
    max-width: 100%;
    max-height: 100%;
}
@media (min-width: 414px) {
    /* .modal-list_prod .img_prod img { width:152px; height:152px; } */
    div.modal-list_prod > ul > li.soldOut::after,
    .prod_list .modal-list_prod > ul > li.soldOut::after {
        height: 166px;
    }
}
.modal-list_prod .btn_cart {
    width: 40px;
    height: 40px;
    color: #fd5050;
    border: 1px solid #ffacac;
    border-radius: 10px;
    background: #fff;
    position: absolute;
    bottom: 8px;
    right: 0;
    z-index: 3;
}
.modal-list_prod .btn_cart.active {
    border: 1px solid #fd5050;
    background: #fd5050;
}
.modal-list_prod .offline {
    color: #333333;
    font-size: 0.5rem;
    border-color: #909090;
}
.clsSale_badge {
    clear: both;
    width: 100%;
    height: 26px;
    position: absolute;
    right: 0px;
    bottom: 0px;
    background: #fd5050;
    padding: 0 10px;
}
.clsSale_badge:after {
    content: "";
    display: block;
    clear: both;
}
.clsSale_badge > li {
    height: 100%;
    line-height: 26px;
    font-size: 0.6875rem;
    color: #fff;
    font-weight: 500;
}
.clsSale_badge > li.left {
    float: left;
}
.clsSale_badge > li.right {
    float: right;
}
.clsSale_badge > li .count {
    font-size: 0.6875rem;
    color: #fff;
    font-weight: 500;
}
.clsSale_badge > li .count.strong {
    font-size: 0.75rem;
    font-weight: 700;
    color: #fff;
}
/*snb overwrite*/
.snb .list_prod .clsSale_badge {
    bottom: -16px;
}
/* 마감세일 품절일 때 */
.modal-list_prod .soldOut .img_prod:after {
    content: "";
    width: 100%;
    height: 100%;
    border-radius: 10px;
    background: rgba(0, 0, 0, 0.4);
    position: absolute;
    top: 0;
    left: 0;
}
.modal-list_prod .soldOut .img_prod:before {
    content: "품절";
    color: #fff;
    position: absolute;
    right: 12px;
    bottom: 12px;
    z-index: 5;
}
/* 마감세일 상품 준비 중 일 때 */
.modal-list_prod .preparing .img_prod:after,
.list_prod .preparing .img_prod:after {
    content: "";
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.4);
    position: absolute;
    top: 0;
    left: 0;
}
.modal-list_prod .preparing .img_prod:before,
.list_prod .preparing .img_prod:before {
    content: "상품준비중";
    width: 100%;
    height: 32px;
    line-height: 32px;
    color: #fff;
    font-size: 0.875rem;
    position: absolute;
    right: 0px;
    bottom: 0px;
    background: #666;
    z-index: 5;
}
.modal-list_prod .txt_name {
    display: block;
    min-height: 19px;
    font-size: 0.938rem;
    padding: 10px 10px 0;
    width: 100%;
    overflow: hidden;
    display: -webkit-box;
    text-overflow: ellipsis;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    line-height: 19.5px;
    word-break: break-all;
}
.modal-list_prod .list_price {
    min-height: 42px;
    padding: 5px 10px 0;
}
.modal-list_prod .list_price .num_dc {
    font-size: 0.875rem;
    font-family: "GmarketSans", sans-serif;
    font-weight: 400;
    padding-right: 0px;
}
.modal-list_prod .list_price .num_dc strong {
    font-size: 1rem;
    font-weight: 600;
    color: #fd5050;
}
.modal-list_prod .list_price .num_price {
    font-size: 0.875rem;
    font-weight: 400;
    padding-right: 5px;
}
.modal-list_prod .list_price .num_price strong {
    font-size: 1rem;
    font-weight: 500;
}
.modal-list_prod .list_price .num_disc {
    display: block;
    color: #8b8b8b;
    font-size: 0.75rem;
    font-weight: 400;
    /*text-decoration: line-through; 20230222 취소선 영역 변경으로 인해 주석처리(숫자에만 취소선 표시)*/
    padding-top: 3px;
}
.modal-list_prod .list_price .num_disc strong {
    color: #8b8b8b;
    font-size: 0.625rem;
    vertical-align: middle;
    text-decoration: line-through; /*20230222 취소선 영역 변경으로 인해 추가(숫자에만 취소선 표시)*/
}
.modal-list_prod .box_order {
    display: flex;
    justify-content: flex-end;
    text-align: right;
    padding: 0 10px;
}
.modal-list_prod .box_order li {
    display: flex;
    align-items: center;
    justify-items: center;
    width: 37px;
    height: 37px;
    position: relative;
}
.modal-list_prod .box_order li .icon-list-offline {
    margin-left: 10px;
}
.modal-list_prod .box_order li > button {
    margin: auto;
}
.modal-list_prod .btn_wish {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 37px;
    height: 37px;
    position: absolute;
    bottom: 0px;
    left: 5px;
    padding-top: 4px;
}
.modal-list_prod .btn_wish span {
    display: block;
    width: 20px;
    height: 17px;
    background: url("../images/icon/icon_wish.png") no-repeat;
    background-size: contain;
}
.modal-list_prod .btn_wish.on span {
    background: url("../images/icon/icon_wish_on.png") no-repeat;
    background-size: contain;
}
/* 마감세일 */
.icon_viewmore {
    width: 5px;
    height: 10px;
    background: url(../images/icon/icon_arrow-right-gray.svg);
}
.modalArea.time .topArea {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    padding: 24px 24px 15px;
}
.modalArea.time .topArea .title {
    font-size: 13px;
    line-height: 16.9px;
    font-weight: 400;
    color: #fd5050;
    font-family: "GmarketSans", sans-serif;
}
.modalArea.time .topArea .title_strong {
    display: block;
    color: #fd5050;
    font-size: 1.25rem;
    font-weight: bold;
    font-family: "GmarketSans", sans-serif;
    margin-top: 4px;
}
.modalArea.time .topArea .btn_more {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #a0a0a0;
    font-size: 14px;
}
.modalArea.time .listArea {
    padding: 0 24px 30px;
    overflow: hidden;
}
.modalArea.time .swiper-pagination-progressbar {
    height: 5px;
    top: 100%;
    width: calc(100% - 24px);
    background: #e3e3e3;
}
.modalArea.time
    .swiper-pagination-progressbar
    .swiper-pagination-progressbar-fill {
    background: #aaa;
}

.modalArea.time .goodslist {
    display: flex;
    overflow: hidden;
    overflow-x: scroll;
    column-gap: 30px;
    padding-right: 24px;
    padding-bottom: 20px;
}

/*=============== motion ===============*/
/*coupon motion*/
.icon-list-coupon::before,
.icon-list-cart::before {
    position: relative;
    z-index: 2;
}
.btn_buy.active::before {
    content: "";
    width: 37px;
    height: 37px;
    border-radius: 50%;
    background: #fd5050;
    position: absolute;
    top: 0;
    left: 0;
    transform: scale(0);
    animation: fadeIn2 2s ease-in-out;
}
.btn_buy .icon-list-cart::after {
    content: "";
    display: none;
    width: 14px;
    height: 6px;
    background: url("../images/icon/icon_list_cart_m2.svg") no-repeat;
    position: absolute;
    top: 11px;
    left: 15px;
    animation: shows 0.2s ease-in-out;
    z-index: 10;
}
.btn_buy.active .icon-list-cart::after {
    display: block;
}
.btn_coupon.active::before {
    content: "";
    width: 35px;
    height: 35px;
    border-radius: 10px;
    background: #48ca45;
    position: absolute;
    top: 1px;
    left: 0;
    animation: fadeIn 0.25s cubic-bezier(0.17, 0.67, 0.58, 1.3);
}
.btn_coupon.active .icon-list-coupon::after {
    content: "";
    width: 10px;
    height: 10px;
    background: url("../images/icon/icon_list_coupon_m2.svg") no-repeat;
    position: absolute;
    top: 11px;
    left: 12px;
    animation: shows 0.2s ease-in-out;
}
@keyframes shows {
    0% {
        opacity: 0;
        top: 5px;
    }
    100% {
        top: 11px;
        opacity: 1;
    }
}
@keyframes shows2 {
    0% {
        opacity: 0;
        top: -5px;
    }
    100% {
        top: 1px;
        opacity: 1;
    }
}

@keyframes fadeIn {
    0% {
        transform: scale(0);
    }
    100% {
        transform: scale(1);
    }
}
@keyframes fadeIn2 {
    0% {
        transform: scale(0);
    }
    10% {
        transform: scale(1);
    }
    100% {
        transform: scale(1);
    }
}
@keyframes fadeIn3 {
    0% {
        transform: scale(0);
        opacity: 0;
    }
    10% {
        transform: scale(1);
        opacity: 1;
    }
    100% {
        transform: scale(1);
        opacity: 1;
    }
}

/*cart motion*/

#bottomGnb .icon_cart_m,
#modalBtGnb .icon_cart_m {
    display: none;
    width: 25px;
    padding: 0;
    position: absolute;
    top: -12px;
    left: 3px;
    background: linear-gradient(to top, #fff 80%, transparent 20%);
}
#bottomGnb .icon_cart_m img,
#modalBtGnb .icon_cart_m img {
    width: 25px;
}
#bottomGnb .icon_cart_num,
#modalBtGnb .icon_cart_num {
    opacity: 0;
    width: 14px;
    height: 14px;
    color: #fff;
    font-size: 0.5rem;
    text-align: center;
    line-height: 16px;
    border-radius: 50%;
    background: #f42d1f;
    position: absolute;
    top: -4px;
    right: -2px;
}
#bottomGnb .icon_cart_num.active,
#modalBtGnb .icon_cart_num.active {
    animation: fadeIn3 1s 0.5s cubic-bezier(0.17, 0.67, 0.58, 1.3) forwards;
}

/*.icon-gnb-cart.pick {*/
/*position:relative;*/
/*}*/
/*.icon-gnb-cart.pick::after {*/
/*content:'';*/
/*width:8px;*/
/*height:8px;*/
/*border-radius:50%;*/
/*background:#F42D1F;*/
/*position:absolute;*/
/*top:10px;*/
/*left:50%;*/
/*margin-left:-2px;*/
/*animation:drop .2s ease;*/
/*}*/
@keyframes drop {
    0% {
        top: -12px;
    }
    100% {
        top: 10px;
    }
}

/*=============== move to top button ===============*/
.btn_moveTop {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border: 1px solid #c4c4c4;
    border-radius: 10px;
    box-shadow: 0 3px 6px #00000029;
    position: fixed;
    right: 22px;
    bottom: 94px;
    background: #fff;
    z-index: 11;
}
.index .btn_timeSale ~ .btn_moveTop {
    bottom: 154px;
}

/*=============== sub filter ===============*/
.box_subFilter {
    padding: 18px 4.26%;
    background: #f4f4f4;
}
.box_subFilter .num_goods,
.box_subFilter .num_goods strong {
    color: #767676;
    font-size: 0.875rem;
}
.box_subFilter .sub_filter {
    color: #767676;
    font-size: 0.875rem;
    border: none;
    background: none;
}

/*=============== tooltip ===============*/
.tooltipArea.sm {
    height: 53px;
    bottom: 100px;
}
.tooltipArea,
.tooltipArea_2 {
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
    height: 82px;
    width: 94.14%;
    text-align: center;
    border-radius: 11px;
    background: rgba(0, 0, 0, 0.7);
    padding: 0 45px;
    position: fixed;
    bottom: 95px;
    left: 2.93%;
}
.tooltipArea p,
.tooltipArea_2 p {
    color: #fff;
    font-size: 0.938rem;
    line-height: 1.375rem;
}
.tooltipArea.active,
.tooltipArea_2.active {
    animation: fadeOut 2s ease forwards;
    z-index: 1;
}
@keyframes fadeOut {
    0% {
        opacity: 1;
        z-index: 10;
    }
    80% {
        opacity: 1;
        z-index: 10;
    }
    100% {
        opacity: 0;
        z-index: 1;
    }
}

@keyframes fadeIn5 {
    0% {
        opacity: 0;
        transform: scale(0.5);
    }
    10% {
        opacity: 1;
    }
    80% {
        opacity: 1;
        transform: scale(1);
    }
    100% {
        opacity: 0;
    }
}

/*=============== bottomGnb ===============*/
#bottomGnb,
#modalBtGnb {
    width: 100%;
    height: 79px;
    border-top: 0.5px solid #e7ebef;
    background: #fdfdfd;
    padding: 0 5px 10px;
    position: fixed;
    bottom: -3px;
    left: 0;
    z-index: 10;
}
#bottomGnb:has(+ #printBarcodeModal.active) {
    z-index: 59;
}
#modalBtGnb {
    z-index: 13;
}
#bottomGnb li,
#modalBtGnb li {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20%;
    height: 69px;
    position: relative;
}
#bottomGnb li a,
#modalBtGnb li a {
    text-align: center;
    position: relative;
}
#bottomGnb li span,
#modalBtGnb li span {
    display: block;
    color: #767676;
    text-align: center;
    font-size: 0.625rem;
    padding: 5px 0 15px;
}
#bottomGnb li .icon.on ~ span,
#modalBtGnb li .icon.on ~ span {
    color: #fd5050;
}

#bottomGnb li .icon.icon-btn-snb::before {
    width: 22px;
    height: 22px;
}

/*=============== TO button animation ===============*/
.btn_to {
    margin-top: -26px;
    position: relative;
}
.btn_to.btn_to_new {
    width: 54px;
    height: 54px;
    margin-top: -35px;
    border-radius: 50%;
    background: #fd5050;
}

/*gradient*/
.btn_to .icon-gnb-pop::after {
    content: "";
    width: 52px;
    height: 52px;
    border-radius: 12px;
    /*background: linear-gradient(-45deg, #ffb7b7, #fc5d51, #fd342e, #fe1111);*/
    background: linear-gradient(45deg, #fc5036, #fd342e, #df0003);
    background-size: 400% 400%;
    animation: gradient 5s ease infinite alternate;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 20;
}
.btn_to .icon-gnb-pop::before {
    width: 52px;
    height: 52px;
    background-image: url("../images/icon/menu/icon_gnb_pop_trans.png");
    background-size: contain;
    background-position: center center;
    z-index: 21;
}

@keyframes gradient {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 50% 50%;
    }
    100% {
        background-position: 100% 50%;
    }
}

/*once*/
.btn_to.once .icon-gnb-pop::before {
    width: 52px;
    height: 52px;
    background-image: url("../images/icon/menu/icon_gnb_pop_line.png");
    background-size: contain;
    background-position: top left;
    transform: scale(1.14);
    animation: bigger 1s ease infinite alternate;
}
.btn_to.once::before {
    content: "";
    width: 74px;
    height: 74px;
    border-radius: 24px;
    background: rgba(249, 65, 59, 0.1);
    position: absolute;
    top: -11px;
    left: -11px;
    transform: scale(0);
    animation: wave 1s 1s ease infinite alternate;
}
.btn_to.once::after {
    content: "";
    width: 62px;
    height: 62px;
    border-radius: 16px;
    background: rgba(249, 65, 59, 0.15);
    position: absolute;
    top: -5px;
    left: -5px;
    transform: scale(0);
    animation: wave 1s 1s ease infinite alternate;
}

@keyframes bigger {
    0% {
        transform: scale(1);
    }
    100% {
        transform: scale(1.14);
    }
}
@keyframes wave {
    0% {
        transform: scale(0);
    }
    100% {
        transform: scale(1);
    }
}

/*=============== footer ===============*/
footer {
    padding: 20px 6.4%;
    position: relative;
}
footer .policyArea {
    display: flex;
    justify-content: space-between;
}
footer .policyArea a {
    color: #bfc4c9;
    font-size: 0.688rem;
}
footer h3 > span {
    display: block;
    color: #bfc4c9;
    font-size: 0.875rem;
    padding-top: 14px;
}
footer .companyArea {
    font-size: 0.688rem;
    line-height: 1.125rem;
    padding-bottom: 40px;
    margin-top: 18px;
}
footer .companyArea li {
    display: inline-block;
    color: #bfc4c9;
}
footer .companyArea li.long {
    display: block;
}
footer .companyArea li.border::after {
    content: "";
    display: inline-block;
    width: 1px;
    height: 10px;
    margin-left: 10px;
    background: #bfc4c9;
}
footer .companyArea li.border {
    padding-right: 10px;
}
footer .noticeArea {
    font-size: 0.688rem;
    border-top: 1px solid #bfc4c9;
    margin-top: 15px;
    padding-top: 10px;
}
footer .noticeArea li {
    color: #bfc4c9;
    padding: 3px 0;
}

#container.join.new {
    padding-top: 0;
}

/*JOIN */
.join .joinForm input[type="text"],
.join .joinForm input[type="number"],
.join .joinForm input[type="password"] {
    height: 20px;
    line-height: 20px;
    padding: 0;
    color: #555;
    font-weight: 500;
    border-radius: 0;
}
.join .joinForm input[type="text"]::placeholder,
.join .joinForm input[type="number"]::placeholder,
.join .joinForm input[type="password"]::placeholder {
    color: #b9b9b9;
}
.join .topArea {
    position: relative;
    padding: 50px 120px 20px 4.26% !important;
}
.join.new .topArea:after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 120px;
    height: 100%;
    background: url("../images/img/img_tomato.svg") no-repeat center left/auto
        100%;
}
.join .topArea .tit {
    color: #1c1c1c;
    font-size: 26px;
    line-height: 34px;
    font-weight: 700;
}
.join .topArea .txt {
    margin-top: 20px;
    color: #6f6f6f;
    font-size: 16px;
    line-height: 24px;
    font-weight: 400;
}
.join .joinForm .box_step {
    padding-bottom: 10px;
    border-bottom: 1px solid #bcbcbc;
}
.join .joinForm .box_step .tit {
    color: #1c1c1c;
    font-size: 16px;
    line-height: 22px;
    font-weight: 700;
}
.join .joinForm .box_step .cont {
    position: relative;
    display: flex;
    align-items: flex-end;
    height: 35px;
}
.join .joinForm .box_step .btn_check {
    bottom: 0;
}
.join .joinForm .box_step.confirm .time {
    bottom: 3px;
}
.join .joinForm .box_step.active {
    border-bottom: 2px solid #48ca45;
}
/*JOIN END*/

/*SEARCH MART*/
.myWrap .titArea {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 16px;
    border-bottom: 1px solid #e5e5e5;
    background: #fff;
}
.myWrap .titArea .tit {
    height: 64px;
    font-size: 1.063rem;
    font-weight: bold;
    line-height: 64px;
}
.myWrap .titArea .btn_more {
    color: #fd5050;
    font-size: 14px;
    line-height: 16px;
    font-weight: 500;
}
.myWrap .listMart {
    padding: 12px;
}
.myWrap .listMart li {
    position: relative;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 3px 6px #0000001a;
    overflow: hidden;
}
.myWrap .listMart li .listMart-head {
    font-size: 0.8125rem;
    font-weight: 400;
    line-height: 18.82px;
    padding: 4px 16px;
    text-align: left;
    color: #fff;
}
.myWrap .listMart li .listMart-head.--on {
    background: #48ca45;
}
.myWrap .listMart li .listMart-head.--off {
    background: #b4b4b4;
}
.myWrap .listMart li .listMart-head.--pickup {
    background: #ffbc10;
}
.myWrap .listMart li .listMart-container {
    padding: 16px;
}
.myWrap .listMart li + li {
    margin-top: 8px;
}
.myWrap .listMart li .tags {
    display: flex;
    align-items: center;
    margin: -2px 0 8px -2px;
}
.myWrap .listMart li .tags .tag {
    display: inline-flex;
    align-items: center;
    height: 18px;
    margin: 2px 0 0 2px;
    padding: 0 8px;
    border-radius: 8px;
    font-size: 10px;
    line-height: 12px;
}
.myWrap .listMart li .tags .tag.green {
    border: 1px solid #48ca45;
    color: #48ca45;
}
.myWrap .listMart li .tags .tag.red {
    border: 1px solid #e56228;
    color: #e56228;
}
.myWrap .listMart li .tags .tag.blue {
    border: 1px solid #69baff;
    color: #69baff;
}
.myWrap .listMart li .tags .tag.darkblue {
    border: 1px solid #3a5488;
    color: #3a5488;
}
.myWrap .listMart li .tags .tag.gray {
    border: 1px solid #b9b9b9;
    color: #b9b9b9;
}
.myWrap .listMart li .tit {
    display: block;
    color: #000;
    font-size: 18px;
    line-height: 23px;
    font-weight: 500;
    text-align: left;
}
.myWrap .listMart li .txt {
    display: block;
    margin-top: 4px;
    color: #767676;
    font-size: 14px;
    line-height: 23px;
    font-weight: 400;
    text-align: left;
}
.myWrap .listMart li .txt em {
    color: #fd5050;
    font-size: 13px;
    line-height: 21px;
    font-weight: 700;
}
.myWrap .listMart li .btn_fav {
    position: absolute;
    right: 20px;
    bottom: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 90px;
    height: 32px;
    border-radius: 6px;
    border: 1px solid #b9b9b9;
}
.myWrap .listMart li .btn_fav .btn_txt {
    color: #b9b9b9;
    font-size: 13px;
    line-height: 15px;
    font-weight: 500;
}
.myWrap .listMart li .btn_fav .btn_icon {
    display: block;
    width: 15px;
    height: 15px;
    margin-left: 4px;
    background: url("../images/icon/icon_like_2.svg") no-repeat center
        center/contain;
}
.myWrap .listMart li .btn_fav.on {
    border-color: #fd5050;
}
.myWrap .listMart li .btn_fav.on .btn_txt {
    color: #fd5050;
}
.myWrap .listMart li .btn_fav.on .btn_icon {
    background-image: url("../images/icon/icon_like_on.svg");
}
.myWrap .martEmpty {
    padding: 60px 0;
    text-align: center;
}
.myWrap .martEmpty .txt {
    color: #757575;
    font-size: 16px;
    line-height: 20px;
    font-weight: 500;
}
.myWrap .martEmpty .txt .br {
    display: block;
}
/*SEARCH MART END */

/*TUTORIAL*/
.tutorialWrap {
    margin-bottom: 40px;
    padding: 0 40px;
    text-align: center;
}
.tutorialWrap .br {
    display: block;
}
.tutorialWrap .imgTop {
    position: relative;
    display: block;
    height: 0;
    padding-bottom: 80%;
}
.tutorialWrap .txtBot {
    margin-top: 30px;
    color: #000;
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
}
.tutorialWrap .buttonArea {
    margin-top: 60px;
}
.tutorialWrap .slider-tutorial {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    padding: 15px 20px 0;
    background: url("../images/img/img_tutorial_topOut.svg") no-repeat center
        center/contain;
}
.tutorialWrap .slider-tutorial .img {
    padding: 0 20px;
}
.tutorialWrap .slider-tutorial .img .inner {
    display: block;
    height: 0;
    padding-bottom: 70%;
    background-repeat: no-repeat;
    background-position: center center;
}
.tutorialWrap .slider-tutorial .txt {
    margin-top: 5px;
    color: #555;
    font-size: 14px;
    line-height: 16px;
    font-weight: 500;
}
.tutorialWrap .imgBot {
    display: block;
    height: 0;
    margin-top: -10px;
    padding-bottom: 100%;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
}
@media screen and (max-width: 320px) {
    .tutorialWrap .slider-tutorial .img .inner {
        background-size: contain;
    }
}
/*TUTORIAL END*/

/*POP */
.popWrap .buttonArea {
    padding: 16px;
}
.popWrap .buttonArea .btn_all {
    display: flex;
    height: 42px;
    border-radius: 10px;
    border: 1px solid #b9b9b9;
}
.popWrap .buttonArea .btn_all .btn_txt {
    color: #919191;
    font-size: 15px;
    line-height: 20px;
    font-weight: 500;
}
.popWrap .buttonArea .btn_search {
    height: 52px;
    border-radius: 10px;
    background: #fd5050;
}
.popWrap .buttonArea .btn_search .btn_txt {
    color: #fff;
    font-size: 16px;
    line-height: 20px;
    font-weight: 700;
}
.popWrap .buttonArea .btn_search .btn_icon {
    display: block;
    width: 16px;
    height: 16px;
    margin-right: 8px;
    background: url("../images/icon/icon_search_white.svg") no-repeat center
        center/contain;
}
.popWrap .buttonArea .btn {
    display: flex;
    justify-content: center;
    align-items: center;
}
.modalArea .popWrap .buttonArea .btn_all {
    margin-bottom: 10px;
}
.topArea .infiniteslide .txt {
    max-height: 16px;
    color: #fd5050;
    font-size: 12px;
    line-height: 16px;
    font-weight: 700;
    overflow: hidden;
}
.topArea .slideArea {
    position: absolute;
    top: -15px;
    right: 0;
    width: 120px;
    padding: 0 16px;
    z-index: 0;
}

header h2.tit_left {
    padding: 0 20px;
    text-align: left;
}

.modalArea.alert .popWrap .txt_alert {
    display: block;
    font-size: 16px;
    text-align: left;
    line-height: 24px;
    font-weight: 400;
    padding: 64px 16px 24px;
}
/*POP END */

/*PRODUCT*/
.snb .navSearchArea {
    position: absolute;
    top: 50%;
    right: 12px;
    transform: translateY(-50%);
    border: 1px solid #bdbdbd;
    border-radius: 6px;
    cursor: pointer;
}
.snb .navSearchArea input[type="text"] {
    border: none;
    padding-right: 40px;
}
.snb .navSearchArea .btn_navSearch {
    position: absolute;
    top: 50%;
    right: 0;
    width: 40px;
    height: 40px;
    transform: translateY(-50%);
}
.snb .navSearchArea .nsa_txt {
    width: 100%;
    min-width: 204px;
    height: 42px;
    padding: 0 40px 0 16px;
    color: #999;
    line-height: 42px;
    font-size: 0.875rem;
    font-weight: 400;
}
.tagProdBox {
    white-space: nowrap;
    padding: 17px 12px;
    overflow-x: auto;
    background: #f4f4f4;
}
.tagProdBox .tag {
    display: inline-flex;
    height: 30px;
    padding: 0 12px;
    border: 1px solid #c6c6c6;
    border-radius: 20px;
    background: #fff;
    color: #555;
    font-size: 14px;
    line-height: 28px;
    font-weight: 500;
    white-space: nowrap;
}
.tagProdBox .tag + .tag {
    margin-left: 4px;
}
.tagProdBox .tag.on {
    background: #555;
    color: #fff;
    border-color: #555;
}
.tagProdBox-red {
    white-space: nowrap;
    padding: 12px;
    overflow-x: auto;
    background: #fff;
}
.tagProdBox-red .tag {
    display: inline-flex;
    height: 32px;
    padding: 6px 12px;
    border: 1px solid #e7ebef;
    border-radius: 20px;
    background: #fff;
    color: #8b8b8b;
    font-size: 14px;
    line-height: 17px;
    font-weight: 500;
    white-space: nowrap;
}
.tagProdBox-red .tag + .tag {
    margin-left: 4px;
}
.tagProdBox-red .tag.on {
    background: #fd5050;
    color: #fff;
    border-color: #fd5050;
}

.descWrap .box_price .list_price {
    display: flex;
    height: 30px;
    align-items: center;
}
.descWrap .box_price .list_price .num_pre {
    margin-right: 12px;
    color: #fd5050;
    font-size: 20px;
    line-height: 22px;
    font-weight: 700;
}
.descWrap .box_price .list_price .btn_notice {
    display: inline-block;
    width: 20px;
    height: 20px;
    margin-left: 5px;
    border-radius: 20px;
    background: url("../images/icon/icon_notice_gray.svg") no-repeat center
        center/contain;
}
.descWrap .box_price .list_price .btn_question {
    display: inline-block;
    width: 20px;
    height: 20px;
    margin-top: -3px;
    margin-left: 5px;
    border-radius: 20px;
    background: url("../images/icon/icon_question_gray.png") no-repeat center
        center/contain;
}
.descWrap .box_price .list_price .num_disc {
    font-size: 14px;
    line-height: 16px;
}

.num_pre {
    font-family: "GmarketSans", sans-serif;
    color: #fd5050;
    font-weight: 700;
}
.listWrap .list_prod .list_price .num_pre {
    font-size: 1rem;
    margin-right: 4px;
}
.prodWrap .list_prod .list_price .num_pre {
    font-size: 0.813rem;
}

/*OVERWRITE*/
.snb .list_prod .btn_wish {
    bottom: 13px;
}
.snb .list_prod .list_price {
    margin-top: 7px;
    min-width: 36px;
}
.snb .list_prod .list_price .num_price {
    font-size: 13px;
    line-height: 19px;
}
.snb .list_prod .list_price .num_pre {
    margin-right: 4px;
    color: #fd5050;
    font-size: 13px;
    line-height: 15px;
}
.snb .list_prod .list_price .num_disc {
    font-size: 9px;
    line-height: 11px;
}
/*OVERWRITE END*/
/*PRODUCT END*/

/*My*/
.my .topArea .box_search {
    display: flex;
    align-items: center;
    height: 72px;
    border-bottom: 1px solid #e7ebef;
    background: #fff;
    position: relative;
}
.my .topArea .box_search input {
    height: 48px;
    line-height: 48px;
    margin-bottom: 0;
}
.my .topArea .box_search button {
    display: flex;
    align-items: center;
    height: auto;
}
.my .topArea .box_search .btn_search {
    position: absolute;
    right: 28px;
    top: 50%;
    transform: translateY(-50%);
}
.my header .btn_search .icon::before,
.my .topArea .box_search .btn_search .icon::before {
    width: 20px;
    height: 20px;
    margin-left: 10px;
}
.my .topArea .box_search .btn_delete {
    position: absolute;
    top: 50%;
    right: 57px;
    transform: translateY(-50%);
}
.my.list_mart .topArea {
    height: auto;
}

.list_mart .martArea .box_push {
    border-bottom: none;
}
.martTopArea {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #e5e5e5;
}

.my .btn_fav {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 90px;
    height: 32px;
    border-radius: 6px;
    border: 1px solid #b9b9b9;
}
.my .btn_fav .btn_txt {
    color: #b9b9b9;
    font-size: 13px;
    line-height: 15px;
    font-weight: 500;
}
.my .btn_fav .btn_icon {
    display: block;
    width: 15px;
    height: 15px;
    margin-left: 4px;
    background: url("../images/icon/icon_like_2.svg") no-repeat center
        center/contain;
}
.my .btn_fav.on {
    border-color: #fd5050;
}
.my .btn_fav.on .btn_txt {
    color: #fd5050;
}
.my .btn_fav.on .btn_icon {
    background-image: url("../images/icon/icon_like_on.svg");
}
/*OVERWRITE*/
.bg_toggle {
    background-image: url("../images/icon/icon_toggle.svg");
}
/*OVERWRITE END*/

.box_notice li.new.on a:after {
    content: "";
    position: absolute;
    top: -2px;
    right: -5px;
    width: 5px;
    height: 5px;
    border-radius: 5px;
    background: #48ca45;
}
.bg_gray {
    background-color: #f5f6f8;
}
/*My End*/

/* btn_view_tip */
.btn_view_tip {
    width: 22px;
    height: 22px;
    margin: 6px 0;
    background-size: 24px 24px;
    background: url("../images/icon/i_btn_24.png") no-repeat;
    text-indent: -999px;
    overflow: hidden;
}

/***
yoo daesung
modify 2021.02.07
***/

/** 1:1문의 수정, 매장선택팝업 수정 **/
.mdf-cont .box_sort .box_select {
    padding-top: 14px;
    font-size: 0.875em;
    font-weight: bold;
    color: #1c1c1c;
    vertical-align: middle;
}
.mdf-cont .button-wrap button {
    height: 44px;
    line-height: 42px;
    padding: 0 3.2%;
    border-radius: 8px;
    border: 1px solid #b7b7b7;
    font-size: 14px;
    cursor: pointer;
}
.mdf-cont .button-wrap .desc {
    margin-left: 10px;
    color: #b4b4b4;
}
.mdl-wrap {
    position: relative;
}
.mdl-wrap .list_mart {
    height: 300px !important;
}
.mdl-wrap .list_mart ul {
    position: absolute;
    top: 63px;
    overflow-y: scroll;
    width: 300px;
    height: 281px;
    margin: 17px 0;
    padding: 0 20px;
}
.mdl-wrap .list_mart ul::-webkit-scrollbar {
    width: 4px;
    height: 8px;
    background-color: #fff;
}
.mdl-wrap .list_mart ul::-webkit-scrollbar-thumb {
    background: #c6c6c6;
}
.mdl-wrap .list_mart ul::-webkit-scrollbar {
    display: unset;
}
.mdl-wrap .buttonArea {
    display: flex;
    flex-flow: row;
    justify-content: center;
}
.mdl-wrap .buttonArea a {
    width: 48% !important;
    border-radius: 10px;
    height: 44px;
    line-height: 44px;
    margin-top: 0;
}
.mdl-wrap .buttonArea a:first-child {
    margin-right: 5px;
}
.mdl-wrap .buttonArea a:last-child {
    margin-left: 5px;
    margin-top: 0 !important;
}

/** 할인율, 금액간격 수정 **/
.num_pre {
    margin-right: 4px;
}

/** 할인율 가격 사이 간격, 장바구니 라인 정렬 수정 **/
.mdf-snb .btn_wish {
    bottom: 6px !important;
}

/** 내주변 마트보기 버튼 사이 간격 수정 **/
.mdf-btb {
    margin-top: 30px;
    margin-bottom: 170px;
}

/*** tutorial-bot animation ***/
.tut-bg {
    position: relative;
}
.tut-wrap {
    position: absolute;
    left: 50%;
    z-index: 100;
    width: 72px;
    height: auto !important;
    margin-left: -36px;
    animation: bounce2 0.9s 1 forwards;
    animation-timing-function: cubic-bezier(0.7, 0.33, 0.66, 0.95);
}
.tut-bot {
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: 0;
    animation: bounce 0.5s infinite alternate;
}
.tut-bot img {
    position: absolute;
    left: 50%;
    z-index: 100;
    width: 72px;
    height: auto !important;
    margin-left: -36px;
    padding-bottom: 0 !important;
}
.tut-bot:before {
    content: "";
    position: absolute;
    left: 50%;
    top: 13px;
    z-index: 90;
    border-radius: 50%;
    animation-duration: 2s;
    animation-name: drop-shadow1;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}
.tut-bot:after {
    content: "";
    position: absolute;
    left: 50%;
    top: 13px;
    z-index: 80;
    border-radius: 50%;
    animation-duration: 2s;
    animation-name: drop-shadow2;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}
.tutorialWrap .imgTop {
    visibility: hidden;
    animation: fadeIn4 2s 1.5s;
    animation-fill-mode: forwards;
}
@-webkit-keyframes fadeIn4 {
    0% {
        visibility: visible;
        transform: scale(0);
    }
    100% {
        visibility: visible;
        transform: scale(1);
    }
}
@-webkit-keyframes drop-shadow1 {
    0% {
        width: 72px;
        height: 64px;
        margin-left: -32px;
    }
    50% {
        z-index: 0;
        top: -60px;
        width: 128px;
        height: 120px;
        background: rgba(253, 81, 81, 0.2);
        margin-left: -80px;
    }
    100% {
        width: 72px;
        height: 64px;
        margin-left: -36px;
    }
}
@-webkit-keyframes drop-shadow2 {
    0% {
        width: 72px;
        height: 64px;
        margin-left: -32px;
    }
    50% {
        z-index: 0;
        top: -90px;
        width: 180px;
        height: 172px;
        background: rgba(253, 81, 81, 0.1);
        margin-left: -106px;
    }
    100% {
        width: 72px;
        height: 64px;
        margin-left: -36px;
    }
}
@-webkit-keyframes bounce {
    0% {
        transform: translateY(0px);
    }
    100% {
        transform: translateY(-15px);
    }
}
@-webkit-keyframes bounce2 {
    0% {
        top: 0;
    }
    100% {
        top: 135px;
    }
}

/** 팝업수정 **/
.mdf-error .contArea .txt_title {
    padding-top: 0 !important;
}
.mdf-error .contArea p {
    font-weight: 400 !important;
    line-height: 26px !important;
    color: #464646;
}
.mdf-error .mdf-icon-network {
    width: 179px;
    height: 189px;
    margin: 69px auto 174px !important;
    background: url("../images/icon/icon_network.svg") no-repeat 0 0;
    background-size: 179px 189px;
}

.mdf-tit {
    height: auto !important;
}
.mdf-tit2 {
    height: auto !important;
    line-height: 23px !important;
}
.mdf-tit3 {
    height: auto !important;
    line-height: 16px !important;
}
.mdf-tit4 {
    height: auto !important;
    line-height: 71px !important;
}
.mdf-tit5 {
    height: auto !important;
    line-height: 0 !important;
}
.mdf-tit6 {
    height: auto !important;
    line-height: 1.5 !important;
}
.mdf-price1 {
    position: relative;
    top: 10px;
}
.mdf-slide .txt_title {
    height: auto !important;
    line-height: 1 !important;
}
.mdf-tip-btn {
    width: 24px;
    height: 24px;
    background-size: 24px 24px;
    background: url("../images/icon/i_btn_24.png") no-repeat;
}
.mdf-timesale .topArea > .txt_title,
.mdf-timesale .topArea > .timeWrap {
    text-align: left !important;
}
.mdf-timesale .topArea {
    padding: 19px 25px 9px !important;
}
.mdf-mdl-icon {
    position: absolute;
    top: 30px;
    right: 28px;
}

/* Join 아이콘 반응형 수정 */
/* Mobile Screen 320 */
@media screen and (max-width: 320px) {
    .join.new .topArea:after {
        width: 160px !important;
        top: -50px !important;
        right: -40px !important;
        background-size: 180px auto;
    }
}

/*** 교환권 팝업 ***/
#couponSlide .box_slide.event-pop {
    width: 200px;
    text-align: center;
}
#couponSlide .box_slide.event-pop .box_title strong {
    margin-bottom: 5px;
    font-size: 16px;
    line-height: 25px;
    color: #000000;
}
#couponSlide .box_slide.event-pop p {
    font-size: 16px;
    line-height: 25px;
    font-weight: 500;
    color: #363636;
}
#couponSlide .box_slide.event-pop button {
    width: 100%;
    height: 32px;
    line-height: 29px;
    margin-top: 14px;
    background: #fd5050;
    border-radius: 6px;
    border: 1px solid #fd5050;
    font-size: 14px;
    font-weight: 500;
    color: #fff;
    cursor: pointer;
}
.modalArea .popWrap .txt_desc em {
    font-size: 18px;
    font-weight: 400;
}
.mesg-pop {
    position: fixed;
    z-index: 50000;
    bottom: 100px;
    width: 100%;
    padding: 0 10px;
}
.mesg-pop p {
    border-radius: 11px;
    width: 100%;
    height: 54px;
    line-height: 54px;
    color: #fff;
    font-weight: 400;
}
.mesg-pop .btn_basic.dark {
    background: rgba(0, 0, 0, 0.7);
}
.modalArea.alert.mdf-modal {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 20000 !important;
    width: 100%;
    height: 100%;
}

/*** index_link_error.htm ***/
.mdf-error .modalArea.cancel.payment .contArea .txt_title {
    width: 100%;
    margin-top: 55px;
    padding-bottom: 0;
}
.mdf-error .modalArea.cancel.payment .contArea .imgWrap {
    padding: 43px 0 43px;
}
.mdf-error
    .modalArea.cancel.payment
    .csArea
    strong
    .modalArea.cancel.payment
    .buttonArea {
    margin-top: 90px;
}
.mdf-error .modalArea.cancel.payment .csArea strong {
    padding-top: 45px;
}

/* 20210818 badge */
.badge_line span {
    display: block;
    width: 100%;
    height: 16px;
    line-height: 16px;
    text-align: center;
    font-size: 0.625rem;
    letter-spacing: -0.0025rem;
    color: #fff;
    background: #fd5050;
    position: absolute;
    bottom: 0px;
    left: 0;
}
.snb .list_prod > ul > li .badge_line span {
    bottom: -16px;
}
.badge_design {
    position: absolute;
    right: 5px;
    top: 5px;
}
.badge_design span {
    display: inline-block;
    width: 50px;
    height: 50px;
    line-height: 13px;
    padding-top: 11px;
    text-align: center;
    color: #fff;
    background: #fd5050;
    border: 1px solid #fff;
    border-radius: 100%;
    font-size: 0.6875rem;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.16);
    font-weight: normal;
}
.badge_design span:after {
    content: "";
    display: block;
    width: 18px;
    height: 18px;
    background: url(../images/img/badge_point.png) center center no-repeat;
    background-size: contain;
    position: absolute;
    right: 3px;
    top: -3px;
}
.badge_design span strong {
    display: block;
    font-size: 0.625rem;
    font-weight: 500;
    color: #fff;
}

/* 말줄임 */
.line1 {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
} /* 문장 한줄(···) */
.line2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    overflow: hidden;
    white-space: normal !important;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    word-wrap: break-word;
}
.line3 {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    overflow: hidden;
    white-space: normal !important;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    word-wrap: break-word;
}
.line4 {
    display: -webkit-box;
    -webkit-line-clamp: 4;
    overflow: hidden;
    white-space: normal !important;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    word-wrap: break-word;
}
.line5 {
    display: -webkit-box;
    -webkit-line-clamp: 5;
    overflow: hidden;
    white-space: normal !important;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    word-wrap: break-word;
}
.line6 {
    display: -webkit-box;
    -webkit-line-clamp: 6;
    overflow: hidden;
    white-space: normal !important;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    word-wrap: break-word;
}
.line7 {
    display: -webkit-box;
    -webkit-line-clamp: 7;
    overflow: hidden;
    white-space: normal !important;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    word-wrap: break-word;
}
.line8 {
    display: -webkit-box;
    -webkit-line-clamp: 8;
    overflow: hidden;
    white-space: normal !important;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    word-wrap: break-word;
}
.line9 {
    display: -webkit-box;
    -webkit-line-clamp: 9;
    overflow: hidden;
    white-space: normal !important;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    word-wrap: break-word;
}
.line10 {
    display: -webkit-box;
    -webkit-line-clamp: 10;
    overflow: hidden;
    white-space: normal !important;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    word-wrap: break-word;
}

/*=============== svg 색상 ===============*/
.s_white {
    fill: #ffffff;
}
.s_pink {
    fill: #e14c6f;
}
.s_blue {
    fill: #11a6b3;
}
.s_yellow {
    fill: #f9bd01;
}
/* 당첨자 팝업 */
.icon {
    display: block;
}
.icon.arrow-right {
    width: 6px;
    height: 12px;
    background: url(../images/icon/icon_arrow-right.svg) center center;
    background-size: cover;
    margin-left: 10px;
}
.modalArea.winning {
    text-align: center;
}
.modalArea .imgArea {
    padding-bottom: 20px;
}
.win_title {
    font-size: 24px;
    color: #111;
    padding: 29px 0 20px;
    font-weight: 500;
}
.win_title .win_grade {
    display: block;
    line-height: 31.2px;
}
.win_title .win_grade,
.win_title .win_grade strong {
    font-size: 26px;
    color: #fd5050;
    font-weight: bold;
}
.win_notice {
    font-size: 0.875rem;
    line-height: 19.6px;
    letter-spacing: -0.05rem;
    color: #333;
    font-weight: 400;
    padding-bottom: 13px;
}
.win_csinfo {
    font-size: 0.75rem;
    font-weight: 400;
    line-height: 16.8px;
    color: #888;
    letter-spacing: -0.05rem;
}
.win_csinfo span {
    display: block;
    font-size: 0.875rem;
    font-weight: 500;
    color: #999;
}
.popup_Tdeco {
    position: absolute;
    left: 0;
    top: -65px;
    width: 100%;
    animation: fadeIn5 3s infinite;
    transform-origin: center;
    transform: scale(1.1);
}
.modalArea.winning .buttonArea .btn {
    height: 44px;
}
.modalArea.winning .buttonArea .btn:first-child {
    margin-bottom: 7px;
}

/* 상품리스트 상단 뱃지 - 마감세일*/
.box_badge-top {
    position: absolute;
    top: 10px;
    left: 10px;
}
/* == 상품리스트 상단 뱃지 - 마감세일 overwrite 시작*/
.list_prod .box_badge-top {
    top: -5px;
}
.closingSale .box_badge-top {
    position: absolute;
    top: 10px;
    left: 10px;
}
/* == 상품리스트 상단 뱃지- 마감세일 overwrite 끝*/
.box_badge-top .badge {
    font-size: 11px;
    font-weight: bold;
    height: 20px;
    padding: 0 8px;
    border-radius: 5px;
}
.box_badge-top .badge.timebadge {
    padding: 3px 8px;
    background: #48ca45;
    color: #fff;
}

/* 마감세일 리스트 페이지 */
/*#container.closingSale{
	padding-top: 0 ;
}*/
.closingSale .list_prod > ul > li a {
    padding: 0;
}
.closingSale .img_prod {
    width: 100%;
    height: 166px;
    text-align: center;
    padding: 10px;
    border-radius: 10px 10px 0 0;
    margin: auto;
    position: relative;
    overflow: hidden;
}
.closingSale .img_prod img {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%;
}
.closingSale .list_prod > ul > li {
    /* min-height: 284px; */
    min-height: 0;
    padding-bottom: 15px;
}
.closingSale .list_prod > ul > li.soldOut::after,
.closingSale .list_prod > ul > li.soldOut::after {
    height: 166px;
}
.closingSale .list_prod .btn_wish {
    bottom: 10px;
}
.closingSale .list_prod .txt_name {
    min-height: 19px;
    font-size: 0.938rem;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    line-height: 19.5px;
    word-break: break-all;
}
/* 리스트 비주얼 */
.visual {
    width: 100%;
    height: 160px;
    /*margin-top: 60px;*/
    text-align: center;
    background-size: cover !important;
}
.closingSale_visual {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    background: url(../images/img/closingsale_visual_bg.png);
}
.closingSale_visual h1 {
    font-size: 1.25rem;
    font-weight: 700;
    color: #fff;
}
.closingSale_visual button {
    color: #fff;
    border: 1px solid #fff;
    border-radius: 30px;
    padding: 10px 28px;
    margin-top: 20px;
}
.noticeArea {
    padding: 15px;
    background: #fff;
}
.noticeArea .notice {
    font-size: 0.875rem;
    color: #fff;
    text-align: center;
    padding: 15px 0;
    border-radius: 10px;
    background: #b5b5b5;
}
.noticeArea .notice .icon.notice {
    width: 1rem;
    height: 1rem;
    padding: 0;
    margin-right: 6px;
    background: url(../images/icon/icon_notice_wh.svg);
    background-size: cover;
}

/*220728 추가 css*/
.mt-90 {
    margin-top: 5.625rem !important;
}
.pt-90 {
    padding-top: 5.625rem !important;
}
.ai-center {
    align-items: center !important;
}
.v-start {
    align-items: start !important;
}
.my-36 {
    margin: 2.25rem 0;
}

/*220812 픽업전용 상품 배지 추가*/
.list_prod .box_badge-top.flex {
    line-height: 20px;
}

.box_badge-top .badge.pickupbadge,
.box_badge .badge.pickupbadge {
    padding: 3px 8px;
    background: #ffbc10;
    color: #fff;
}

/*메인 alert 팝업 미디어 쿼리 추가(화면비 5:7 이상 기기용)_이승미*/
@media screen and (min-aspect-ratio: 5/7) {
    .modalArea .popWrap {
        background: #fff;
    }
    .modalArea .popWrap:has(.imgArea) {
        background: #fff;
    }
    .modalArea.alert .popWrap img {
        width: 40%;
    }
    .modalArea.alert .popWrap a img {
        margin-left: 50%;
        transform: translate(-50%, 0);
    }
}

/*box_border style 추가*/
.boxDeco_border {
    border: 1px solid #1c1c1c;
}

.boxDeco_border_tb {
    border-top: 1px solid #1c1c1c;
    border-bottom: 1px solid #1c1c1c;
}

.boxDeco_border_lr {
    border-left: 1px solid #1c1c1c;
    border-right: 1px solid #1c1c1c;
}

/*info_font style 추가*/
.info_txtStyle {
    color: #909090;
    font-size: 0.75rem;
}

/*말줄임 라인 초기화*/
.lineReset {
    -webkit-line-clamp: 1 !important;
}

/*202210 대용량 식자재 스타일 추가*/
/*상품 badge*/
.txt_name .box_badge,
.txt_title .box_badge {
    display: inline-block;
    position: static !important;
    vertical-align: text-bottom;
    margin-right: 0.25rem !important;
}

.txt_name .box_badge .badge,
.txt_title .box_badge .badge {
    font-size: 11px;
    font-weight: bold;
    padding: 0 8px 0 6px;
    margin: 0;
    border-radius: 5px;
}

.txt_name .box_badge .badge.large_prod_badge,
.txt_title .box_badge .badge.large_prod_badge {
    background-color: #fd5050;
}

/*20221220 상품 리스트 유닛 UI 리뉴얼*/
.badge.radius-edge {
    border-radius: 6px 6px 0 6px;
}

.list_prod .list_price .num_price strong.bold_style,
.snb .list_prod .list_price .num_price strong.bold_style,
.modal-list_prod .list_price .num_price strong {
    /*상품 리스트 "(할인적용)판매가격" 굵게*/
    font-size: 1.125rem;
    font-weight: 600;
}

.list_prod .list_price .num_pre.small_style {
    /*상품 리스트 "할인률" 폰트사이즈 작게*/
    font-size: 0.85rem;
}

/*230104 수산대전 배지 추가*/
.box_badge .badge.blue {
    background: #1e9ae0;
}

.box_badge.box_susan {
    position: absolute;
    right: 5px;
    top: 138px;
    left: unset;
}

/* 굵은 구분선 */
.interval-line {
    width: 100%;
    height: 12px;
    background: #f4f4f4;
    display: block;
}

/* 카테고리 리뉴얼 */
.line-up-list {
    padding: 1rem;
    padding-bottom: 40px;
    height: auto;
    overflow-y: auto;
    /*max-height: 520px;*/
    max-height: 80vh;
}
.line-up-list .line-up {
    display: flex;
    align-items: center;
    position: relative;
    overflow: hidden;
    margin-bottom: 0.5rem;
    font-size: 0.875rem;
    font-weight: 500;
}
.line-up-list .line-up .title {
    color: #1c1c1c;
    line-height: 24px;
}
.line-up-list .line-up span {
    color: #bcbcbc;
    line-height: 24px;
    text-decoration-line: underline;
}
.line-up-list .line-up input[type="radio"] {
    position: absolute;
    left: -999rem;
}
.line-up-list .line-up input[type="radio"] + label {
    display: block;
    width: 100%;
    position: relative;
    padding: 1rem;
    padding-left: 56px;
    width: 100%;
    height: 80px;
    border-radius: 10px;
    border: 1px solid #e8ecf0;
    background: #fff;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}
.line-up-list .line-up input[type="radio"] + label:before {
    content: "";
    position: absolute;
    left: 1rem;
    top: 50%;
    transform: translate(0, -50%);
    width: 20px;
    height: 20px;
    text-align: center;
    background: #fff;
    border: 1px solid #b7b7b7;
    border-radius: 100%;
}
.line-up-list .line-up input[type="radio"]:checked + label {
    border-color: #fd5050;
}
.line-up-list .line-up input[type="radio"]:checked + label:after {
    content: "";
    position: absolute;
    top: 50%;
    left: 1rem;
    transform: translate(5px, -50%);
    width: 12px;
    height: 12px;
    background: #fd5050;
    border-radius: 100%;
}
.guide {
    position: absolute;
    left: 50%;
    transform: translate(-50%, 0);
    display: flex;
    align-items: center;
}
.bubble {
    width: 280px;
    position: relative;
    height: 40px;
    padding: 0.5rem 0.75rem;
    background: #1c1c1c;
    border-radius: 10px;
    color: #fff;
    font-size: 0.875rem;
    letter-spacing: -0.42px;
    line-height: 24px;
    display: flex;
    align-items: center;
}
.bubble:after {
    content: "";
    position: absolute;
    border-style: solid;
    border-width: 0 10px 14px;
    border-color: #1c1c1c transparent;
    display: block;
    width: 0;
    z-index: 1;
    top: -12px;
    left: 130px;
}
.bubble button {
    flex: 1;
    display: flex;
    align-items: center;
    padding-left: 0.75rem;
}