@charset "utf-8";

/*=============== header color mode ===============*/
header.top_color {
    border-bottom: none;
    background: #fd5050;
}
header.top_menu {
    border-bottom: none;
}
.top_color h2 {
    color: #fff;
}
header.top_color .btn_search {
    right: 15px;
}
header.top_color .box_notice,
header.top_menu .box_notice {
    position: absolute;
    top: 20px;
    right: 0;
}
header.top_color .box_notice li,
header.top_menu .box_notice li {
    padding: 0 16px;
    position: relative;
}
header.top_color .box_notice li:first-child::after,
header.top_menu .box_notice li:first-child::after {
    content: "";
    width: 1px;
    height: 17px;
    background: #ffacac;
    position: absolute;
    right: 0;
    top: 3px;
}
header.top_color .box_notice li:last-child::after,
header.top_menu .box_notice li:last-child::after {
    display: none;
}
header.top_menu .box_notice li:first-child::after {
    background: #e0e0e0;
}
.index .box_notice li.new a,
header.top_color .box_notice li.new a,
header.top_menu .box_notice li.new a {
    position: relative;
}
/*.index .box_notice li.new a::after,*/
/*header.top_color .box_notice li.new a::after,*/
/*header.top_menu .box_notice li.new a::after {*/
/*content:'';*/
/*width:5px;*/
/*height:5px;*/
/*border-radius: 50%;*/
/*background:#fd5050;*/
/*position:absolute;*/
/*top:0;*/
/*right:-5px;*/
/*}*/
header.top_color .box_notice li.green a::after {
    content: "";
    width: 5px;
    height: 5px;
    border-radius: 50%;
    position: absolute;
    top: 0;
    right: -5px;
    background: #48ca45;
}

header.top_color .searchArea input[type="text"] {
    background: #fff;
}

/*=============== content color mode ===============*/
header.top_color {
    /*border-bottom:0.5px solid #F4F4F4;*/
}
#container.top_fixed {
    height: calc(100vh - 60px);
}
.top_fixed .content {
    overflow: hidden;
}

/*top area*/
.top_color .topArea {
    /* background:#fd5050; */
    position: relative;
}
/* .top_color .topArea::before {
    content:'';
    width:100%;
    height:calc((100% - 4.26%) / 3);
    background:#F5F6F8;
    position:absolute;
    bottom:0;
    left:0;
} */
.top_color .topArea .nicknameWrap {
    display: flex;
    padding: 25px 1.5rem 30px;
    align-items: end;
    justify-content: space-between;
}
.nickname-id {
    /* display: flex;
	justify-content:flex-start;
	column-gap: 13px; */
}
.nickname-button {
    height: 28px;
    line-height: 26px;
    font-size: 0.875rem;
    /* color: #fff; */
    border-radius: 3px;
    /* background: rgba(255, 255, 255, 0.2); */
    border: 1px solid #eaeaea;
    padding: 0 12px;
}
.top_color .topArea .txt_hello {
    /* color:#FFD6D6; */
    font-size: 1.125rem;
    line-height: 1.625rem;
    /* padding-left:3.73%; */
}
.top_color .topArea .txt_hello strong {
    /* color:#fff; */
    font-size: 1.35rem;
    /* margin: 0 0 0 8px; */
}
.top_color .topArea .btn_inquiry {
    height: auto;
    justify-content: flex-end;
    color: #fff;
    font-size: 0.75rem;
    font-weight: 400;
    padding-right: 4.26%;
    padding-bottom: 16px;
}
.top_color .topArea .btn_inquiry strong {
    color: #fff;
    font-weight: bold;
    padding-right: 5px;
}
.top_color .topArea .myWrap {
    /* width:calc(100% - 4.26%);
    border-radius: 12px 0 0 12px;
    box-shadow:0 2px 12px #00000014, 2px 0 12px #00000014;
    background:#fff;
    position:relative;
    left:4.26%; */
}
/* s: 마이페이지 주소 추가 10211224*/
.box_adress {
    padding: 1rem 1rem 23px;
}
.myPage .box_adress {
    width: calc(100% - 3rem);
    padding: 10px;
    margin: 0 auto;
    border: 1px solid #ededed !important;
    border-radius: 5px;
}
.box_adress .adress_btn {
    align-items: center;
    margin-bottom: 10px;
}
.box_adress .adress_btn .adress_badge.basic {
    color: #8b8b8b;
    border: 1px solid #ddd;
    padding: 4px 10px;
    border-radius: 4px;
    font-size: 0.75rem;
}
.myPage .box_adress .adress_btn .adress_badge.basic {
    padding: 5px 10px;
    color: #5f6264 !important;
    border: none;
    border-radius: 10px;
    background-color: #f7f8fb !important;
}
.box_adress .adress_btn .setting {
    padding: 5px;
}
.myPage .box_adress .adress_btn .setting {
    font-size: 0.875rem;
    border: 1px solid #eaeaea;
    border-radius: 3px;
}

.adress_list .adress_detail {
    font-size: 1rem;
    font-weight: 500;
    letter-spacing: -0.05rem;
    line-height: 1.25rem;
    color: #1c1c1c;
    margin-bottom: 7px;
}
.adress_list .adress_road {
    font-size: 0.875rem;
    letter-spacing: -0.05rem;
    color: #8b8b8b;
    padding-left: 40px;
    line-height: 1.25rem;
    position: relative;
}
.adress_list .adress_road:after {
    content: "도로명";
    display: block;
    font-size: 10px;
    color: #1aafa0;
    padding: 0px 4px;
    border: 1px solid #1aafa0;
    border-radius: 6px;
    height: 18px;
    line-height: 16px;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}
/* e : 마이페이지 주소 추가 10211224*/
.top_color .myWrap > ul {
    display: flex;
    align-items: center;
    padding: 10px 0;
}
.top_color .myWrap .box_benefit {
    /* border-top:1px solid #E0E0E0;
    border-bottom:1px solid #E0E0E0; */
    margin: 0 1.5rem 1rem;
    padding: 0 0 5px;
}
.top_color .myWrap .box_benefit li {
    width: 50%;
    justify-content: center;
    align-items: center;
    gap: 15px;
    padding: 4px 10px;
    position: relative;
}
.top_color .myWrap .box_benefit li:first-child {
    border-right: 1px solid #e7ebef;
}
.top_color .myWrap .box_benefit li > .icon-my-coupon::before {
    width: 19px;
    height: 17px;
}
.top_color .myWrap .box_benefit li > .icon-my-point::before {
    width: 19px;
    height: 19px;
}
.top_color .myWrap .box_benefit li a {
    display: block;
}
.top_color .myWrap .box_benefit span {
    color: #1c1c1c;
    font-weight: 400;
    line-height: 1;
}
.top_color .myWrap .box_benefit a .icon {
    padding-right: 10px;
}
.top_color .myWrap .box_benefit a .icon::before {
    width: 7px;
}
.top_color .myWrap .box_order {
    width: calc(100% - 3rem);
    padding: 20px 5px;
    margin: 10px auto;
    background: #f7f8fb;
    border-radius: 5px;
}
.top_color .myWrap .box_order li {
    width: 20%;
    position: relative;
}
.top_color .myWrap .box_order .icon {
    position: absolute;
    top: 8px;
    right: -3px;
    margin-top: -6px;
}
.top_color .myWrap .box_order a {
    text-align: center;
}
.top_color .myWrap .box_order strong {
    color: #e5e5e5;
    font-size: 1.375rem;
    font-weight: 600;
}
.top_color .myWrap .box_order span {
    display: block;
    color: #8b8b8b;
    font-size: 0.75rem;
    margin-top: 10px;
}
.top_color .myWrap .box_order .active strong {
    color: #000;
}
.top_color .myWrap .box_order .active span {
    color: #000;
    font-weight: bold;
}

/*non*/
.top_color.non .topArea::before {
    display: none;
}
.top_color.non .topArea .txt_hello strong {
    font-size: 1.5rem;
}
.top_color.non .topArea .myWrap {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 165px;
}
.top_color.non .topArea .myWrap > img {
    width: 116px;
}

/*cont area*/
.top_color .contArea {
    /*height:calc(100vh - 345px);*/
    /* text-indent:4.26%; */
    padding: 0 1rem;
}
.top_color .contArea.mypage{
    padding: 0 1.5rem;
}

/*=============== bg full ===============*/
.bg_full .content {
    height: calc(100vh - 60px);
    background: #f5f6f8;
}
.bg_full.myPage .content,
.bg_full.coupon .content,
.bg_full.accountSetting .content,
.bg_full.mart.con-has--tab .content {
    background: #fff;
}
.bg_full .content.gr_bg {
    background: #f0f0f0;
}
.bg_full .popWrap {
    height: calc(100vh - 60px);
    background: #f5f6f8;
}
.modalArea .bg_full .contArea {
    background: #f7f7f7;
}

/*=============== box coupon ===============*/
.box_coupon {
    padding: 0 20px;
}
.box_coupon > div {
    display: none;
}
.box_coupon > div.active {
    display: block;
}
.box_coupon li {
    border: 1px solid #e7ebef;
    padding: calc(2.46vh - 1px) 19px;
    box-shadow: 0 2px 10px #00000014;
    position: relative;
}
.box_coupon li.select {
    border: 1.5px solid #48ca45;
}
.box_coupon .box_tag.sm .tag {
    font-weight: 400;
}
.box_coupon .box_tag .tag {
    display: inline-block;
    font-size: 0.625rem;
    border-radius: 9px;
    padding: 3px 5px;
}
.box_coupon .box_tag .tag.gray.fill {
    color: #363636;
    background: #f5f6f8;
}
.box_coupon .box_tag .tag.green.fill {
    color: #fff;
    background: #48ca45;
}
.couponWrap .box_coupon li .txt_title {
    display: block;
    color: #363636;
    font-size: 1rem;
    padding: 10px 0 2px;
}
.couponWrap .box_coupon li.used .txt_title,
.couponWrap .box_coupon li.overdate .txt_title {
    color: #a3a3a3;
}
.couponWrap li.used .box_title .num_price,
.couponWrap li.used .box_title .num_price span,
.couponWrap li.overdate .box_title .num_price,
.couponWrap li.overdate .box_title .num_price span {
    color: #a3a3a3;
}
.box_coupon .txt_desc {
    width: 50%;
    color: rgba(0, 0, 0, 0.3);
    font-size: 0.813rem;
    line-height: 1.25rem;
    margin-bottom: 3.07vh;
}
.box_coupon .img_order {
    width: 79px;
    height: 59px;
    position: absolute;
    top: 5.78vh;
    right: 22px;
}
.box_coupon .img_order img {
    width: 100%;
}
.box_coupon .num_date {
    display: block;
    color: #b2b2b2;
    font-size: 0.75rem;
    border-top: 1px dashed #e7ebef;
}
/*.box_coupon .btn_down {*/
/*color:#48CA45;*/
/*font-size:0.625rem;*/
/*border:1px solid #48CA45;*/
/*border-radius: 11px;*/
/*background:none;*/
/*padding:5px 10px;*/
/*}*/

/*m coupon*/
.coupon .couponWrap .box_coupon .imgWrap {
    width: 74%;
    padding: .25rem;
}
.coupon .couponWrap .box_coupon .imgWrap img {
    width: 100%;
}
.coupon .couponWrap .box_coupon .offline li {
    background: #fff;
}
.coupon .couponWrap .box_coupon .offline li.used {
    height: 152px;
    background: #fff;
}
.coupon .couponWrap .box_coupon .offline li.noImg {
    background: #fff url(../images/img/bg_coupon_color_lg.svg) top left
        no-repeat;
    background-size: contain;
}
.coupon .couponWrap .box_coupon .offline li.noImg.used {
    background: #fff url(../images/img/bg_coupon_color_gray_lg.svg) top left
        no-repeat;
    background-size: contain;
}

/*=============== my page ===============*/
.myPage .img_logo {
    padding: 66px 6.66% 44px;
    position: relative;
    z-index: 12;
}
.myPage .contArea .box_menu > li {
    padding: 15px 0;
    border-bottom: 1px solid #ededed;
}
.myPage .contArea .box_menu > li:not(:has(ul)) {
    border-bottom: none;
    padding: 5px 0;
}
.myPage .contArea .box_menu > li:not(:has(ul)):first-of-type {
}
.myPage .contArea .box_menu > li > a,
.myPage .contArea .box_menu > li > button {
    display: block;
    padding: 10px 0;
}
.myPage .contArea .box_menu > li > p {
    padding: 10px 0;
    font-size: 0.9375rem;
    color: #ff8282;
}
.myPage .contArea .box_menu > li > ul {
    display: flex;
    flex-wrap: wrap;
}
.myPage .contArea .box_menu > li > ul > li {
    width: 50%;
}
.myPage .contArea .box_menu > li > ul > li > a {
    display: block;
    padding: 15px 0;
}
.myPage .contArea .bottom-button {
    margin-top: 1rem;
}
.myPage .contArea .bottom-button > a {
    display: block;
    padding: 15px;
    text-align: center;
    font-size: 1.0625rem;
    font-weight: 500;
    color: #fd5050;
    border: 1px solid #fd5050;
    border-radius: 5px;
}
/* .myPage .contArea .box_menu li:first-child a {
    border-top:1px solid #E7EBEF;
}
.myPage .contArea .box_menu a {
    height:60px;
    color:#1C1C1C;
    line-height:60px;
    border-bottom:1px solid #E7EBEF;
} */
.myPage .contArea .box_menu a > .badge {
    display: inline-block;
    width: 28px;
    height: 14px;
    line-height: 14px;
    text-align: center;
    font-size: 9px;
    font-weight: normal;
    color: #fff;
    background: #fd5050;
    border-radius: 7px;
    animation: fadetoggle 1s infinite;
    vertical-align: 2px;
    text-transform: uppercase;
}
@keyframes fadetoggle {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
.myPage .contArea .box_menu li.txt_version a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    border-bottom: none;
    padding: 0 5px;
}
.myPage .contArea .box_menu li.txt_version strong {
    flex: 1;
}
.myPage .contArea .box_menu li.txt_version span {
    flex: 1;
    color: #8b8b8b;
    font-size: 0.813rem;
    text-align: right;
}
.myPage .buttonArea .btn {
    width: 100%;
    color: #8b8b8b;
    border-color: #d9d9d9;
    margin-top: 60px;
}

/*=============== alarm ===============*/
/*list*/
#container.alarm {
    overflow: auto;
    height: 100%;
}
.alarm .listWrap .box_alarm {
    margin: 33px 6.4%;
    position: relative;
}
.alarm .listWrap .box_alarm::before {
    content: "";
    width: 2px;
    height: 100%;
    min-height: calc(100vh - 96px);
    background: #e0e0e0;
    position: absolute;
    top: 3px;
    left: 0;
}
.alarm .listWrap .box_alarm li {
    min-height: 100px;
    margin-bottom: 48px;
    padding: 0 5.6%;
    position: relative;
}
.alarm .listWrap .box_alarm li::before {
    width: 18px;
    text-align: center;
    position: absolute;
    top: 1px;
    left: -8px;
}
.alarm .listWrap .box_alarm li.time::before {
    content: url("../images/icon/icon_alarm_time.svg");
}
.alarm .listWrap .box_alarm li.basic::before {
    content: url("../images/icon/icon_alarm_circle.svg");
}
.alarm .box_alarm .badge {
    color: #fd5050;
    font-size: 0.625rem;
    font-weight: bold;
    border: 1px solid #fd5050;
    border-radius: 9px;
    padding: 1px 8px;
}
.alarm .box_alarm .txt_mart {
    font-weight: bold;
    display: block;
    margin-top: 10px;
}
.alarm .box_alarm .txt_title {
    display: block;
    width: 100%;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    padding: 10px 0 7px;
}
.alarm .box_alarm .txt_title ~ p {
    color: #757575;
    width: 100%;
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.25rem;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    padding-bottom: 10px;
}
.alarm .box_alarm .num_date {
    color: #bdbdbd;
    font-size: 0.75rem;
}

/*detail*/
.modalArea.alarm.detail h2 {
    text-indent: 4.26%;
    text-align: left;
}
.alarm.detail .box_alarm {
    padding: 14px 4.26%;
}
.alarm.detail .box_alarm > .txt_title {
    display: block;
}
.alarm.detail #alarmSlide {
    width: 100%;
    height: 246px;
    border-top: 1px solid #e7ebef;
    border-bottom: 1px solid #e7ebef;
    background: #f5f6f8;
}
.alarm.detail #alarmSlide .box_slide {
    height: 246px;
}
.alarm.detail .box_list {
    padding: 0 4.26%;
}
.alarm.detail .box_list > .txt_title {
    display: block;
    color: #1c1c1c;
    font-weight: 400;
}
.alarm.detail .box_list ul {
    margin-bottom: 20px;
}
.alarm.detail .box_list li {
    color: #8b8b8b;
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.625rem;
}

/*none*/
.alarm.bg_full {
    text-align: center;
}
.alarm.bg_full .contArea > .txt_notice {
    color: #555555;
    font-size: 1.25rem;
    font-weight: 400;
    line-height: 2rem;
    padding-top: 86px;
}
.alarm.bg_full .contArea > .imgWrap {
    padding-top: 86px;
}

/*=============== modify ===============*/
/*mem*/
.modify.mem .contArea > div {
    margin: 0;
    padding: 20px 1rem;
    border-bottom: 7px solid #f3f4f8;
}
.modify.mem input[type="text"],
.modify.mem input[type="email"] {
    width: calc(100% - 105px);
    height: 42px;
    border: 1px solid #d9d9d9;
    background: #f0f2f5;
}
.modify.mem .btn_line {
    width: auto;
    height: auto;
    padding: 5px 10px;
    color: #222;
    font-size: 0.813rem;
    font-weight: 500;
    border: 1px solid #eaeaea;
    border-radius: 3px;
    background: none;
}
.modify.mem .btn_basic {
    width: 100px;
    height: 42px;
    font-size: 0.813rem;
}
.modify.mem .txt_title {
    width: 80px;
    color: #1c1c1c;
    font-size: 0.9375rem;
    /* margin-bottom:10px; */
}
.modify.mem .box_info {
    /* padding:32px 0;
    margin:0 4.26%; */
}
.modify.mem .box_info > .txt_title {
    /* font-size:1.125rem; */
    margin: 0 0 20px;
    font-weight: 600;
    color: #ff8282;
}
.modify.mem .list_mem {
    /* text-align:center; */
    display: flex;
    align-items: center;
    margin: 0 0 15px;
}
.modify.mem .list_mem:last-of-type {
    margin: 0;
}
.modify.mem .list_mem > button {
    padding: 15px 0 30px;
    margin: 0 4.26%;
}
.modify.mem .list_mem > div {
    flex: 1;
    gap: 5px;
}
.modify.mem .list_mem > div input {
    /* margin:auto;
    text-align:center; */
    /* width: calc(100% - 70px); */
    flex: 1;
    height: auto;
    padding: 0;
    line-height: 1;
    font-size: 1rem;
    background: transparent;
    border: none;
}
.modify.mem .list_mem > div button {
    /* display:none; */
}
/* .modify.mem .list_mem > div.modify button {
    display:block;
}
.modify.mem .list_mem > div.modify input {
    margin:0;
    text-align:left;
} */
.modify.mem .list_phone {
    border-top: 1px solid #e7ebef;
    padding-top: 23px;
    margin-top: 33px;
}
.modify.mem .list_phone > div {
    margin-bottom: 23px;
}
.modify.mem .box_login {
    padding: 29px 0;
    margin: 0 4.26%;
}
.modify.mem .box_login strong {
    line-height: 33px;
    margin-bottom: 0;
}
.modify.mem .box_login > div button {
    width: 45px;
    text-align: center;
}
.modify.mem .list_login {
    margin-bottom: 25px;
}
.modify.mem .list_email {
    margin-top: 20px;
}
.modify.mem .list_email .box_alert {
    position: initial;
    padding-top: 5px;
}
.modify.mem .box_push {
    padding: 29px 0;
    margin: 0 4.26%;
}
.modify.mem .box_push > .txt_title {
    margin: 0 0 20px;
    font-weight: 600;
    color: #ff8282;
}
.modify.mem .box_push > .flex {
    margin: 0 0 20px;
    min-height: 30px;
}
.modify.mem .box_push > .flex:last-of-type {
    margin: 0;
}
.modify.mem .box_push > .flex .txt_title {
    padding: 3px 0 0;
}
.modify.mem .box_push .num_date {
    color: #ababab;
    font-size: 0.775rem;
    font-weight: 400;
}
.modify.mem .box_policy {
    padding: 29px 0;
    margin: 0 4.26%;
    font-weight: bold;
}
.modify.mem .box_policy .txt_title {
    font-weight: bold;
}
.modify.mem .btn_quit {
    display: inline-block;
    height: auto;
    /* color:#9B9B9B; */
    font-size: 0.875rem;
    font-weight: 400;
    border: none;
    margin: 20px 1rem 32px;
}
.modify.mem .box_license {
}
.modify.mem .box_license .txt_title {
    font-size: 1.125rem;
    margin-bottom: 0;
}
.modify.mem .box_license > div {
    margin: 19px 0;
    padding: 0 4.26%;
}
.modify.mem .box_license > div:first-child {
    border-bottom: 1px solid #e7ebef;
    border-top: 1px solid #e7ebef;
    padding: 17px 4.26%;
}
.modify.mem .box_license > div span {
    color: #1c1c1c;
    font-size: 0.875rem;
    font-weight: 400;
}
.modify.mem .box_license > div span:last-child {
    color: #8b8b8b;
}

/*profile popup*/
.modalArea.profile .popWrap .txt_title {
    font-size: 1.125rem;
    text-align: center;
    line-height: 1.688rem;
    padding: 36px 8% 26px;
}
.modalArea.profile .popWrap ul {
    padding: 0 10.6%;
}
.modalArea.profile .popWrap li {
    width: 54px;
    height: 54px;
    border: 1.5px solid transparent;
    border-radius: 50%;
    margin-right: 12px;
    margin-bottom: 16px;
}
.modalArea.profile .popWrap li:nth-child(4n) {
    margin-right: 0;
}
.modalArea.profile .popWrap li.select {
    position: relative;
}
.modalArea.profile .popWrap li.select::after {
    content: url("../images/icon/icon_mem_check.svg");
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.modalArea.profile .popWrap li.white {
    border-color: #d3d3d3;
    background: #fff;
}
.modalArea.profile .popWrap li.orange {
    border-color: #f47b3b;
    background: #ff8d2b;
}
.modalArea.profile .popWrap li.yellow {
    border-color: #ffb033;
    background: #ffd258;
}
.modalArea.profile .popWrap li.green {
    border-color: #15d141;
    background: #87eb3e;
}
.modalArea.profile .popWrap li.blue {
    border-color: #5985b9;
    background: #7bc7ff;
}
.modalArea.profile .popWrap li.purple {
    border-color: #724dad;
    background: #ac85f7;
}
.modalArea.profile .popWrap li.black {
    border-color: #0f0f0f;
    background: #292929;
}
.modalArea.profile .popWrap li.gray {
    border-color: #6f5f5f;
    background: #acacac;
}
.modalArea.profile .buttonArea .btn {
    height: 44px;
    margin-top: 19px;
}

/*phone*/
.modify.phone .topArea p {
    height: auto;
    color: #8b8b8b;
    background: #f5f6f8;
    padding: 20px;
}
.modify.phone .topArea strong {
    display: inline-block;
    color: #8b8b8b;
    padding-left: 5.33%;
}
.modify.phone .box_info {
    padding: 24px 4.26%;
}
.modify.phone .box_info .txt_title {
    color: #888888;
    font-size: 0.875rem;
    margin-bottom: 8px;
}
.modify.phone .box_info input {
    width: calc(100% - 112px);
    background: #f0f2f5;
    margin-bottom: 12px;
}
.modify.phone .box_confirm .btn_check {
    width: 108px;
    height: 42px;
    border-radius: 8px;
    background: #fd5050;
}
.modify.phone .time {
    color: #fd5050;
    font-size: 0.75rem;
    font-weight: 400;
    margin-left: -50px;
}
.modify.phone .icon {
    margin-right: 5px;
}
.modify.phone .box_notice > span {
    display: none;
}
.modify.phone .box_notice > span.print {
    display: block;
}
.modify.phone .box_notice > span > strong {
    font-size: 0.688rem;
    vertical-align: middle;
}
.modify.phone .box_notice .txt_ok strong {
    color: #48ca45;
}
.modify.phone .box_notice .txt_wrong strong {
    color: #fd5050;
}
.modify.phone .box_confirm {
    position: relative;
}
.modify.phone.end input[type="text"].num_check {
    width: 100%;
}
.modify.phone.end .txt_ok {
    position: absolute;
    top: 12px;
    left: calc(100% - 188px);
}
.modify.phone .txt_ok strong {
    color: #48ca45;
    font-size: 0.688rem;
    vertical-align: middle;
}

/*phone modal*/
.modify.phone.modalArea .popWrap {
    text-align: center;
}
.modify.phone.modalArea .txt_title {
    display: block;
    font-size: 1.125rem;
    border-bottom: 1px solid #d9d9d9;
    margin: 0 4.26%;
}
.modify.phone .popWrap .contArea {
    padding-top: 22px;
}
.modify.phone.modalArea ul {
    padding-bottom: 22px;
    margin: 0 4.26% 22px;
    border-bottom: 1px solid #d9d9d9;
}
.modify.phone.modalArea ul > li {
    font-weight: 400;
    line-height: 1.75rem;
}
.modify.phone.modalArea ul > li.color {
    color: #fd5050;
    font-weight: 500;
}
.modify.phone.modalArea .txt_ques {
    font-size: 1.063rem;
}
.modify.modalArea .buttonArea {
    padding: 0 4.26% 16px;
}
.modify.modalArea .buttonArea a {
    height: 44px;
}

/*password*/
.modify.password .topArea {
    padding: 20px 4.26%;
    background: #f5f6f8;
}
.modify.password .topArea p {
    height: auto;
    color: #8b8b8b;
    font-size: 0.875rem;
    line-height: 1.625rem;
}
.modify.password .topArea p ~ .txt_notice {
    color: #8b8b8b;
    font-size: 0.75rem;
    font-weight: 400;
}
.modify.password .contArea {
    min-height: 360px;
}
.modify.password .box_info {
    padding: 24px 4.26%;
}
.modify.password .box_info .txt_psw {
    display: block;
    position: relative;
    margin-bottom: 10px;
}
.modify.password .box_info .btn_show {
    position: absolute;
    right: 15px;
    top: 10px;
}
.modify.password .box_info input {
    background: #f0f2f5;
}
.modify.password .box_notice .txt_notice {
    color: #8b8b8b;
    font-size: 0.75rem;
    line-height: 1.25rem;
}
.modify.password .box_notice .txt_wrong {
    color: #e81f1f;
    font-size: 0.688rem;
    position: relative;
    top: 5px;
}

/*=============== point ===============*/
/*top area*/
.point .topArea .pointWrap {
    padding: 0 0 25px;
    position: relative;
}
.point .box_mart,
.coupon .box_mart {
    line-height: 1;
    background: #fff;
    padding: 0 8.53%;
    position: relative;
    z-index: 10;
}
.point .box_mart {
    padding: 25px 8.53%;
}
.point .box_mart .txt_name,
.coupon .box_mart .txt_name {
    font-size: 0.938rem;
    font-weight: 400;
    line-height: 1.5rem;
}
.point .box_mart .txt_name strong,
.coupon .box_mart .txt_name strong {
    display: block;
    font-size: 1.25rem;
    font-weight: 500;
    padding-bottom: 5px;
}
.point .box_mart .txt_name strong::after,
.coupon .box_mart .txt_name strong::after {
    content: "";
    display: inline-block;
    width: 8px;
    height: 8px;
    border-top: 2px solid #fd5050;
    border-left: 2px solid #fd5050;
    margin: 0 0 4px 10px;
    transform: rotate(225deg);
    transition: 0.3s;
}
.coupon.barcode2 .box_mart .txt_name strong::after,
.coupon.barcode2 .box_mart .txt_name strong::after {
    display: none;
}
.point .pointWrap .box_info {
    border-top: 2px solid #000;
    padding-top: 24px;
    margin: 0 8.53%;
}
.point .list_point .txt_title {
    /*font-size:0.938rem;*/
    /*font-weight:400;*/
}
.point .list_point .icon-gPoint {
    vertical-align: top;
}
.point .list_point .num_point {
    color: #222222;
    font-size: 1.5rem;
    font-weight: 400;
}
.point .list_point .num_point strong {
    color: #fd5050;
    font-size: 1.875rem;
    font-weight: 500;
    padding-right: 10px;
}
.point .list_point .txt_notice {
    color: #aaaaaa;
    font-size: 0.75rem;
    font-weight: 400;
    padding: 9px 0 26px;
}
.point .list_point .txt_notice .icon {
    padding-right: 5px;
    vertical-align: top;
}
.point .box_gGroup {
    width: 100%;
}
.point .box_gGroup .btn_line_2 {
    height: 40px;
    color: #1c1c1c;
    font-size: 0.813rem;
    font-weight: 400;
    line-height: 40px;
    border-radius: 12px;
}
.point .box_gGroup .btn_line_2 .icon-btn-prev {
    padding-right: 8px;
}

.point .list_use {
    width: 100%;
}
.point .list_use .txt_title {
    font-size: 0.938rem;
    font-weight: 400;
}
.point .list_use {
    margin-top: 20px;
}
.point .list_use > div,
.point .list_use > ul {
    width: 50%;
    line-height: 1.75rem;
}
.point .list_use > div p {
    color: #222222;
    font-size: 0.938rem;
    font-weight: bold;
}
.point .list_use > ul {
    position: relative;
}
.point .list_use > ul::after {
    content: "";
    width: 1px;
    height: 44px;
    background: #e0e0e0;
    position: absolute;
    left: 0;
    top: 3px;
}
.point .list_use > ul .txt_title {
    display: inline-block;
    width: 70px;
    text-align: center;
}
.point .list_use > ul .num_point {
    font-size: 0.875rem;
    font-weight: 500;
}
.point .list_use > ul .num_point strong {
    font-size: 0.938rem;
    font-weight: bold;
}
.point .list_use .txt_notice {
    width: 100%;
    height: 38px;
    color: #757575;
    font-size: 0.75rem;
    line-height: 38px;
    border: 1px solid #e0e0e0;
    border-radius: 12px;
    padding: 0 10.66%;
    margin-top: 34px;
}
.point .list_use .txt_notice .icon {
    vertical-align: sub;
    padding-right: 5px;
}

/*cont area*/
.point .box_subFilter {
    align-items: center;
    background: none;
    padding: 18px 4.26% 0;
}
.point .box_subFilter > .txt_title {
    color: #222222;
    font-size: 0.875rem;
    padding: 16px 4.26%;
}
.point .contArea > .box_tab {
    border-top: 1px solid #e7ebef;
}
.point .contArea > .box_tab li {
    width: 25%;
}
.point .contArea > .box_tab li.active::after {
    display: none;
}
.point .useWrap .box_detail .num_month {
    background: #f5f6f8;
    padding: 0 8.53%;
}
.point .useWrap .box_detail .num_month strong {
    display: inline-block;
    font-size: 0.75rem;
    font-weight: bold;
    border-bottom: 1.5px solid #000;
    padding: 22px 0 10px;
}
.point .useWrap .box_detail li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 82px;
    border-bottom: 1px solid #eeeeee;
    padding: 0 8.53% 0 8px;
    margin-left: 24px;
}

.point .useWrap .box_detail .txt_sort {
    color: #363636;
    font-size: 0.938rem;
}
.point .useWrap .box_detail .num_date {
    display: block;
    color: #8b8b8b;
    font-size: 0.688rem;
    padding-top: 10px;
}

.point .useWrap .box_detail li .list_point {
    text-align: right;
}
.point .useWrap .box_detail .num_point {
    color: #fd5050;
    font-size: 0.875rem;
}
.point .useWrap .box_detail .num_point > strong {
    color: #fd5050;
    font-size: 0.875rem;
    font-weight: bold;
    padding: 0;
}
.point .useWrap .box_detail .txt_desc {
    display: block;
    color: #8b8b8b;
    font-size: 0.688rem;
    padding-top: 10px;
}
.point .useWrap .box_detail .txt_desc .store,
.point .useWrap .box_detail .txt_desc .onOff,
.point .useWrap .box_detail .txt_desc .percent {
    color: #8b8b8b;
}

/*option*/
.modalArea.point .box_martName {
    width: 83%;
    border: 1px solid #f4f4f4;
    border-radius: 5px;
    background: #fff;
    box-shadow: 1px 3px 9px 4px #98a8ae14;
    position: absolute;
    top: calc(100% - 30px);
    left: 8.53%;
    z-index: 11;
}
.modalArea.point .list_menu li {
    height: 48px;
    line-height: 48px;
    border-bottom: 1px solid #f4f4f4;
    padding: 0 24px 0 5px;
    margin: 0 16px;
    position: relative;
}
.modalArea.point .list_menu li a {
    display: inline-block;
}
.modalArea.point .list_menu li strong {
    color: #1c1c1c;
    font-size: 0.938rem;
}
.modalArea.point .list_menu li.select strong {
    /* color: #F42D1F; */
    font-weight: 600;
}
.modalArea.point .list_menu li.select::after {
    content: "";
    display: inline-block;
    position: absolute;
    top: 50%;
    right: 0;
    width: 10px;
    height: 7px;
    border-radius: 0;
    vertical-align: middle;
    background: #fff;
    border-top: 1px solid #fd5050;
    border-right: 1px solid #fd5050;
    margin-left: 0;
    transform: rotate(135deg) translateY(calc(50% + 4px));
}
.modalArea.point .list_menu li:last-child {
    border-bottom: none;
}
.modalArea.point .closeArea {
    border-bottom: none;
}
.modalArea.point .box_mart .txt_name strong::after {
    transform: rotate(45deg);
    margin: 0 0 0 10px;
}

/*detail*/
.modalArea.point .popWrap {
    /*height:647px;*/
    /*border-radius:20px 20px 0 0;*/
}
.modalArea.point .topArea {
    /*text-align:center;*/
    line-height: 1.5rem;
    border-bottom: 1px dashed #e7ebef;
    /*margin:0 4.26%;*/
    /*padding:40px 0 29px;*/
}
.modalArea.point .box_badge .badge {
    height: 19px;
    font-size: 0.75rem;
    background: #ff6c6c;
    padding: 0 10px;
}
.modalArea.point .topArea > .txt_title {
    color: #ff1d1d;
    font-size: 1.5rem;
    font-weight: bold;
    padding: 9px 0;
}
.modalArea.point .topArea > .txt_title span {
    color: #ff1d1d;
    font-weight: bold;
    vertical-align: middle;
}
.modalArea.point .topArea > .txt_desc {
    display: block;
    color: #8b8b8b;
}
.modalArea.point .topArea > .num_date {
    color: #8b8b8b;
}
.modalArea.point .topArea > .num_date .color {
    color: #ff6c6c;
    font-size: 0.875rem;
    padding-left: 10px;
}
.modalArea.point .contArea {
    padding: 24px 5.33% 49px;
}
.modalArea.point table {
    line-height: 2.5rem;
}
.modalArea.point tr {
    height: 32px;
}
.modalArea.point th {
    width: 85px;
    font-weight: 400;
}
.modalArea.point td {
    color: #8f8f8f;
    font-weight: 400;
    line-height: 1.563rem;
}
.modalArea.point .long th {
    text-align: left;
}
.modalArea.point .long td {
    padding-left: 16px;
}
.modalArea.point .buttonArea {
    position: absolute;
}

/*option*/
.modalArea.point.option .popWrap {
    border-radius: 0;
    left: 0;
    transform: translate(0, 0);
}
.modalArea.point.option .topArea {
    display: flex;
    align-items: center;
    height: 103px;
    border-bottom: none;
    position: relative;
    background: #fff;
}
.modalArea.point.option .martWrap {
    width: 100%;
    height: 100%;
    align-content: center;
}
.modalArea.point.option .box_mart .txt_name strong::after {
    /* border-top:none;
    border-bottom: 6px solid #FD5050; */
    transform: rotate(45deg);
    margin: 0 0 0 10px;
}

/*=============== quit ===============*/
/*notice*/
.quit .topArea {
    height: auto;
    line-height: 1.5rem;
    font-size: 0.875rem;
    padding: 22px 4.26% 0;
}
.quit .topArea p {
    color: #8b8b8b;
    font-size: 0.875rem;
    font-weight: 400;
}
.quit .topArea strong {
    display: block;
    color: #1c1c1c;
    font-size: 1rem;
    padding-right: 10px;
}
.quit .contArea {
    padding: 0 4.26%;
    margin: 20px 0;
}
.quit .contArea .txt_title {
    display: block;
}
.quit .contArea .box_notice {
    height: 100%;
    overflow-y: scroll;
    padding: 20px 4.26%;
    border: 1px solid #b7b7b7;
    border-radius: 12px;
}
.quit .content .box_notice > p {
    color: #8b8b8b;
    font-size: 0.813rem;
    font-weight: 400;
    line-height: 1.625rem;
    padding-bottom: 30px;
}
.quit .box_notice > p.indent {
    padding-left: 10px;
}
.quit .agreeArea {
    width: 100%;
    font-size: 0.875rem;
    font-weight: 400;
    border-top: 1px solid #d9d9d9;
    padding: 15px 4.26% 47px;
}
.quit .agreeArea input[type="checkbox"] {
    vertical-align: middle;
}
.quit .agreeArea label {
    color: #1c1c1c;
    font-size: 0.875rem;
    vertical-align: top;
}

/*reason*/
.quit.reason .topArea {
    padding: 16px 4.26% 20px;
    border-bottom: 1px solid #e7ebef;
}
.quit.reason .topArea p.txt_reason {
    width: 95%;
    color: #1c1c1c;
    font-size: 1rem;
    font-weight: 500;
}
.quit.reason .topArea p.txt_reason:first-child {
    margin-bottom: 30px;
}
.quit.reason .contArea {
    margin: 0 0 20px;
}
.quit.reason .box_why ul {
    padding: 10px 0;
}
.quit.reason .box_why li {
    color: #1c1c1c;
    font-size: 0.875rem;
    font-weight: 400;
    margin-bottom: 20px;
}
.quit.reason .box_why li:first-child {
    padding-top: 10px;
}
.quit.reason .box_why li:last-child {
    margin-bottom: 0;
    border-top: 1px solid #d9d9d9;
    padding: 20px 0 10px;
    margin-top: 10px;
}
.quit.reason .box_why li:last-child .box_txt {
    margin: 18px 0 0;
}
.quit.reason .box_why li:last-child .box_num {
    padding: 12px 0 43px;
}
.quit.reason .box_why label {
    color: #1c1c1c;
    font-size: 0.875rem;
    font-weight: 400;
}
.quit.reason .box_num {
    text-align: right;
    color: #8b8b8b;
    font-size: 0.813rem;
    line-height: 1;
}
.quit.reason .box_num span {
    color: #8b8b8b;
    font-size: 0.813rem;
    font-weight: 400;
}

/*finish*/
.quit .finishWrap {
    padding: 18px 0 22px;
}
.quit .finishWrap .txt_title {
    display: block;
    color: #1c1c1c;
    padding-bottom: 22px;
}
.quit .finishWrap .box_mem {
    width: 100%;
    text-align: center;
    border: 1px solid #e3e3e3;
    border-radius: 12px;
    box-shadow: 0 3px 8px #00000017;
    padding: 24px 4.26%;
}
.quit .finishWrap .box_mem span {
    display: block;
    font-size: 1.125rem;
    padding-bottom: 4px;
}
.quit .finishWrap .box_mem strong {
    font-size: 1.25rem;
}
.quit .noticeWrap li {
    color: #8b8b8b;
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.75rem;
}

/*=============== coupon ===============*/
.coupon .popWrap {
    top: 0;
}
.coupon .topArea {
    display: flex;
    align-items: center;
    height: 103px;
    position: relative;
    background: #fff;
}
.coupon .topArea > .btn_close {
    position: absolute;
    top: 29px;
    right: 25px;
    z-index: 10;
}
.coupon .topArea .martWrap {
    width: 100%;
}
.coupon .box_tab {
    height: 50px;
    border-bottom: none;
    padding: 0 5.33%;
    background: #fff;
}
.contArea .tit_border {
    border-top: 1px solid #e7ebef;
}
.coupon .box_tab li {
    width: 50%;
    line-height: 50px;
    text-align: left;
    text-indent: 5px;
}
.coupon .box_tab li.active::after {
    width: 90%;
    bottom: 0;
}

.coupon .box_sort {
    width: 100%;
    overflow-x: auto;
    padding: 21px 4.26% 0;
}
.coupon .box_sort ul {
    display: flex;
    align-items: center;
}
.coupon .box_sort ul > li {
    height: 28px;
    line-height: 26px;
    color: #bfc4c9;
    font-size: 0.938rem;
    border: 1px solid #bfc4c9;
    border-radius: 8px;
    background: #fff;
    padding: 0 16px;
    margin-right: 6px;
}
.coupon .box_sort ul > li.select {
    color: #fff;
    border: none;
    background: #fd5050;
}
.coupon .couponWrap {
    padding: 0;
}
.coupon .box_subFilter {
    background: #fff;
    align-items: center;
    border-top: 1px solid #ededed;
}
.coupon .box_subFilter .selectWrap.sub_filter {
    min-width: 100px;
    height: 26px;
    line-height: 26px;
}
.coupon .couponWrap .down {
    width: 72px;
    height: 26px;
    border: 1px solid #fc6b6b;
    border-radius: 8px;
    font-size: 0.688rem;
    background: #ff6c6c;
}
.coupon .couponWrap .box_coupon {
    padding: 0 4.26%;
}
.coupon .couponWrap .box_coupon li {
    min-height: 148px;
    height: 100%;
    border-color: #c6c6c6;
    padding: 0;
    background: #fff;
    position: relative;
}
.coupon .couponWrap .box_coupon li.used {
    box-shadow: none;
}
.coupon .couponWrap .box_coupon li .box_tag {
    position: absolute;
    top: 16px;
    left: 22px;
}
.coupon .couponWrap .box_coupon li .box_tag > span {
    display: inline-block;
    height: 16px;
    line-height: 14px;
    font-size: 0.563rem;
    font-weight: bold;
    border-radius: 6px;
    padding: 0 5px;
}
.coupon .couponWrap .box_coupon li .box_tag .tag_fill {
    color: #fff;
    background: #fd5050;
}
.coupon .couponWrap .box_coupon li .box_tag .tag_fill.black {
    background: #000;
}
.coupon .couponWrap .box_coupon li .box_tag .tag_line {
    border: 1px solid #000;
}
.coupon .couponWrap .box_coupon li.used .box_tag .tag_fill {
    background: #a3a3a3;
}
.coupon .couponWrap .box_coupon li.used .box_tag .tag_line {
    color: #a3a3a3;
    border: 1px solid #a3a3a3;
}
.coupon .infoWrap {
    padding-left: 9.62%;
}
.coupon .infoWrap .box_badge .badge {
    height: 12px;
    font-size: 0.5rem;
    line-height: 12px;
}
.coupon .infoWrap .txt_desc {
    color: #8b8b8b;
    font-size: 0.688rem;
}
.coupon .infoWrap .txt_title {
    font-size: 0.938rem;
    font-weight: bold;
    padding: 5px 0;
    margin: 0;
}
.coupon .offline .infoWrap .txt_title {
    margin: 34px 0 0;
    color: #ff1d1d;
}
.coupon .offline .infoWrap .txt_desc {
    color: #000;
    font-size: 0.813rem;
    font-weight: bold;
}
.coupon .infoWrap .txt_title span {
    color: #363636;
    font-size: 1.688rem;
    font-weight: bold;
}
.coupon .offline .infoWrap .txt_title span {
    color: #ff1d1d;
    font-size: 1.688rem;
    font-weight: bold;
}
.coupon .infoWrap .num_date {
    font-size: 0.625rem;
    border-top: none;
}
.coupon .downWrap {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 26%;
    height: 100%;
    min-height: 148px;
    font-size: 0.688rem;
    text-align: center;
    border-left: 1px dashed #e0e0e0;
}
@media (min-width: 414px) {
    .couponWrap li .imgWrap ~ .box_down,
    .couponWrap li .imgWrap ~ .downWrap {
        min-height: 168px;
    }
}
.coupon .downWrap .icon_down {
    display: block;
    width: 22px;
    height: 22px;
    border: 1.5px solid #ff6c6c;
    border-radius: 50%;
    margin: auto;
}
.coupon .downWrap.download .icon_down {
    border: none;
}
.coupon .downWrap .icon_down .icon {
    vertical-align: text-bottom;
    transform: scale(0.8);
}
.coupon .downWrap .txt_down {
    display: block;
    color: #ff6c6c;
    font-weight: bold;
    padding: 7px 0 5px;
}
.coupon .downWrap .txt_date {
    color: #8b8b8b;
    font-weight: bold;
}
.coupon .box_coupon .btn_more {
    display: block;
    font-size: 0.875rem;
    color: #767676;
    margin: 37px auto;
}
.coupon .box_coupon .btn_more .icon::before {
    width: 11px;
    height: 19px;
    margin-left: 5px;
}
.coupon .box_coupon .online .infoWrap {
    width: 74.34%;
    position: relative;
}
.coupon .box_coupon .online .infoWrap .imgWrap {
    width: 29.92%;
    position: absolute;
    right: 14px;
    top: 0;
}
.coupon .box_coupon .online .box_title .imgWrap img {
    width: 100%;
}

/*used*/
.coupon .couponWrap .box_coupon li.used {
    box-shadow: none;
}
.coupon .couponWrap .box_coupon .used .infoWrap span,
.coupon .couponWrap .box_coupon .used .infoWrap strong {
    color: #a3a3a3;
}
.coupon .couponWrap .box_coupon .used .coupon-balance-price,
.coupon .couponWrap .box_coupon .used .coupon-balance-price span {
    color: #a3a3a3;
}

.coupon .couponWrap .box_coupon .used .infoWrap .box_badge .badge {
    color: #fff;
    background: #a3a3a3;
}
.coupon .couponWrap .box_coupon .used .downWrap {
    background: #a3a3a3;
    border-radius: 0 6px 6px 0;
}
.coupon .couponWrap .box_coupon .used .downWrap .icon_down {
    border-color: #e0e0e0;
}
.coupon .couponWrap .box_coupon .used .downWrap .txt_down {
    color: #e0e0e0;
}
/*overdate*/
.coupon .couponWrap .box_coupon .overdate .downWrap {
    background: #333;
    border-radius: 0 6px 6px 0;
}
.coupon .couponWrap .box_coupon .overdate .downWrap .txt_down {
    color: #e0e0e0;
}
/*menu*/
.coupon .box_mart {
    padding: 0 8.53%;
}
.coupon .box_martName {
    border-color: #e0e0e0;
    top: 100%;
}

/*none, mart*/
.coupon.none .contArea {
    height: calc(100vh - 157px);
    background: #f4f4f4;
}
.coupon.none .imgWrap,
.coupon.mart .imgWrap {
    text-align: center;
    padding-bottom: 36px;
}
.coupon.none .txt_notice {
    color: #767676;
    font-size: 1.25rem;
    text-align: center;
    line-height: 2rem;
    padding: 127px 0 45px;
}
.coupon.mart .txt_notice {
    color: #000;
    font-size: 1.25rem;
    text-align: center;
    line-height: 2rem;
    padding: 80px 0 85px;
}
.coupon.mart .buttonArea {
    margin-top: 112px;
}

/*detail*/
.modalArea.point.coupon .popWrap {
    height: 92.61%;
    border-radius: 20px 20px 0 0;
}
.modalArea.point.coupon .popWrap .content {
    padding-bottom: 60px;
}
.modalArea.point.coupon .topArea {
    display: block;
    height: auto;
    text-align: center;
    border-radius: 20px 20px 0 0;
    padding: 40px 0 30px;
    margin: 0 5.33%;
}
.modalArea.point.coupon .topArea > .imgWrap img {
    width: 49.55%;
}
.modalArea.point.coupon .topArea > .imgWrap.offline img {
    width: 100%;
}
.modalArea.point.coupon .topArea > .num_date .color {
    font-size: 1rem;
    font-weight: 400;
}
.modalArea.point.coupon .topArea .box_barcode {
    width: 74.32%;
    text-align: left;
    margin: 28px auto 0;
}
.modalArea.point.coupon .topArea .box_barcode .icon_barcode {
    display: block;
}
.modalArea.point.coupon .topArea .box_barcode .num_barcode {
    display: block;
    font-size: 0.75rem;
}
.modalArea.point.coupon th {
    font-weight: 500;
}

/*=============== mart ===============*/
/*none*/
.list_mart.none {
    text-align: center;
}
.list_mart.none .txt_notice {
    padding-top: 62px;
    color: #767676;
    font-size: 1.25rem;
    line-height: 2rem;
    margin-bottom: 40px;
}
.list_mart.none .content .buttonArea {
    width: 100%;
    background: none;
    margin: 104px auto 0;
    bottom: 28px;
}
.list_mart .buttonArea .icon-btn-arr {
    padding-left: 15px;
}
.list_mart .buttonArea .icon-btn-arr::before {
    width: 6px;
    height: 11px;
}

/*list*/
.list_mart .topArea {
    align-items: center;
    height: 52px;
    line-height: 52px;
    border-bottom: 1px solid #e7ebef;
    background: #fff;
    padding: 0 4.26%;
}

.list_mart .topArea > .btn {
    width: 50px;
    height: 26px;
    color: #fd5050;
    font-size: 0.813rem;
    border: 1px solid #fd5050;
    border-radius: 10px;
}
.list_mart .myWrap {
    padding: 14px 4.26%;
}
.list_mart .myWrap .martArea {
    border: 1px solid #eaeaea;
    border-radius: 6px;
    box-shadow: none;
    background: #ffffff;
    margin-top: 14px;
    padding: 16px;
}
.list_mart .myWrap .martArea:first-child {
    margin-top: 0;
}
.list_mart .myWrap .martArea .martTopArea{
    border-bottom: none;
}
.list_mart .myWrap .martArea .badgeWrap{
    gap: 5px;
}
.list_mart .myWrap .martArea .badgeWrap .badge{
    display: inline-block;
    padding: 5px 12px;
    font-size: 0.8125rem;
    font-weight: 400;
    color: #fff;
    border-radius: 20px;
    background: #FF6A6A;
}
.list_mart .myWrap .martArea .badgeWrap .badge.pickup{
    background: #4CCE49;
}
.list_mart .myWrap .martArea .martTopArea .box_push{
    height: auto;
    margin-right: -10px;
    line-height: 1;
    justify-content: flex-start;
    border-bottom: none;
}
.list_mart .martArea .box_push {
    height: 45px;
    justify-content: flex-end;
    align-items: center;
    line-height: 45px;
    border-bottom: 1px solid #e5e5e5;
}
.list_mart .martArea .box_push .txt_title {
    margin: 0 5px 2px 0;
    font-size: 0.875rem;
    color: #ababab;
}
.list_mart .martArea .infoWrap {
    margin: 0;
    padding: 5px 0 15px;
}
.list_mart .martArea .infoWrap > div {
    width: 100%;
}
.list_mart .martArea .infoWrap .box_name {
    padding: 0 0 8px;
    justify-content: space-between;
}
.list_mart .martArea .infoWrap .box_name > .flex{
    justify-content: flex-start;
}
.list_mart .infoWrap .box_name .txt_title {
    font-size: 1.125rem;
    max-width: calc(100% - 24px);
    margin-top: 2px;
    margin-bottom: 0;
    padding-bottom: 0;
}
.list_mart .infoWrap .box_name .btn_fav{
    width: 24px;
    height: 24px;
    border: none;
}
.list_mart .infoWrap .box_name .txt_lct {
    font-size: 1.125rem;
}
.list_mart .infoWrap .box_name > .color {
    display: inline-block;
    color: #fd5050;
    font-size: 0.813rem;
    padding-left: 5px;
}
.list_mart .infoWrap .box_name > .color .icon {
    transform: rotate(180deg);
    filter: invert(51%) sepia(82%) saturate(4299%) hue-rotate(332deg)
        brightness(107%) contrast(99%);
}
.list_mart .infoWrap .box_name > .color .icon::before {
    width: 6px;
    height: 10px;
    padding-left: 10px;
}
.list_mart .infoWrap .box_point {
    display: flex;
    justify-content: space-between;
    line-height: 1.25rem;
    padding: 15px 0 0;
}
.list_mart .infoWrap .box_point li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 50%;
    flex-direction: column;
}
.list_mart .infoWrap .box_point li:first-of-type{
    position: relative;
}
.list_mart .infoWrap .box_point li:first-of-type::after{
    content: "";
    position: absolute;
    top: 5px;
    bottom: 5px;
    right: 0;
    width: 1px;
    background: #eaeaea;
}
.list_mart .infoWrap .box_point li > strong {
    margin: 0 0 4px;
    font-weight: 400;
}
.list_mart .infoWrap .box_point li > strong span {
    color: #a5a5a5;
    font-size: .9375rem;
    padding: 0;
}
.list_mart .infoWrap .box_point li > p{
    width: 100%;
    text-align: center;
    font-weight: 700;
}
.list_mart .infoWrap .box_point li > p .martPoint{
    margin-right: 0;
}
.list_mart .infoWrap .box_point li > p span{
    vertical-align: middle;
    font-weight: 700;
}
.list_mart .infoWrap + .flex{
    justify-content: center;
    gap: 10px;
}
.list_mart .infoWrap + .flex > .btn{
    flex: 1;
    height: 45px;
    font-size: 1.0625rem;
    font-weight: 600;
    color: #7b7b7b;
    border: 1px solid #d6d6d6;
}
.list_mart .infoWrap + .flex > .btn:nth-of-type(2){
    color: #FD5050;
    border-color: #FD5050;
}
/* .list_mart .infoWrap .box_point li > strong .icon-mart-coin::before {
    width: 17px;
    height: 17px;
}
.list_mart .infoWrap .box_point li > strong .icon-mart-coupon::before {
    width: 20px;
    height: 20px;
} */
/* .list_mart .infoWrap .box_point li > span {
    font-size: 1.125rem;
} */
.list_mart .martArea .timeWrap {
    height: auto;
    padding: 0;
    line-height: 1;
    background: #fff;
}
.list_mart .martArea .timeWrap ul{
    height: auto;
    justify-content: flex-start;
    gap: 20px;
    align-items: center;
    background: #fff;
}
.list_mart .martArea .timeWrap li {
    flex: none;
    padding: 0;
    line-height: 1;
    text-align: left;
}
.list_mart .martArea .timeWrap li > span{
    display: inline-block;
    margin: 0 4px 0 0;
    line-height: 1;
    font-size: 0.875rem;
    font-weight: 500;
    color: #7b7b7b;
}
.list_mart .martArea .timeWrap li > span.numStyle{
    margin: 0;
    font-size: 0.875rem;
    font-weight: 400;
    color: #ababab;
}
.list_mart .timeWrap li:last-child::before {
    display: none;
    content: "";
    width: 1px;
    height: 14px;
    background: #d3d3d3;
    position: absolute;
    top: 12px;
    left: 0;
}
.list_mart .txt_notice {
    color: #767676;
    text-align: center;
    font-size: 0.813rem;
    padding: 35px 0;
}
.list_mart .txt_notice .icon {
    margin-right: 4px;
}
.list_mart.my .content .buttonArea {
    width: 100%;
    background: none;
}
.list_mart.my .content .buttonArea .btn {
    width: 65.73%;
    height: 52px;
}

/*modify*/
.list_mart.modify .topArea > .btn {
    color: #fff;
}
.list_mart.modify .topArea > .btn.btn_modify {
    color: #fd5050;
}
.list_mart.modify .btn_close {
    padding: 0 4.26%;
    margin-left: 4.26%;
    position: relative;
}
.list_mart.modify .btn_close::before {
    content: "";
    width: 1px;
    height: 14px;
    background: #e5e5e5;
    position: absolute;
    top: 17px;
    left: 0;
}
.list_mart.modify .icon-close-modal::before {
    width: 12px;
    height: 12px;
}

.list_mart.detail .topArea {
    height: auto;
    padding: 0;
}
.list_mart.detail .topArea .imgWrap {
    height: 240px;
    background: tomato;
}
.list_mart.detail #eventSlide .box_slide {
    width: 100%;
    height: 240px;
}
.list_mart.detail #eventSlide .box_slide img {
    width: 100%;
    height: 100%;
}
.list_mart.detail #eventSlide .slick-dots {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
}
.list_mart.detail #eventSlide .slick-dots li.slick-active {
    background: #fff;
}
.list_mart.detail .topArea .btn_option {
    height: 102px;
    display: flex;
    align-items: center;
    line-height: 2.125rem;
    padding: 0 8.53%;
    background: #fff;
}
.list_mart.detail .btn_option strong {
    font-size: 1.25rem;
}
.list_mart.detail .btn_option span {
    display: block;
    font-size: 0.938rem;
    line-height: 1;
}
.list_mart.detail .btn_option .icon {
    transform: rotate(90deg);
}
.list_mart.detail .btn_option.close .icon {
    transform: rotate(270deg);
}
.list_mart.detail .martInfoWrap .intro.close {
    height: 90px;
    overflow: hidden;
}

@media screen and (max-width: 480px) {
    .list_mart .martArea .timeWrap ul{
        gap: 5px 10px;
    }
    .list_mart .martArea .timeWrap ul li > span{
        font-size: 13px;
    }
}

/*contArea*/
.list_mart.detail .martInfoWrap {
    background: #f4f4f4;
}

/*intro*/
.list_mart.detail .martInfoWrap > .introWrap {
    padding-bottom: 5px;
}
.list_mart.detail .martInfoWrap > .introWrap .img-box{

}
.list_mart.detail .martInfoWrap > .introWrap .img-box img{
    display: block;
    width: 100%;
    max-height: 240px;
    object-fit: cover;
}
.list_mart.detail .martInfoWrap > .introWrap.close .box_info {
    height: 90px;
    overflow: hidden;
}
.list_mart.detail .martInfoWrap > .introWrap.close .box_title .icon {
    transform: rotate(270deg);
}
.list_mart.detail .martInfoWrap .intro {
    display: block;
    border-radius: 0;
    background: #fff;
    padding: 23px 8%;
    margin: 0;
}
.list_mart.detail .martInfoWrap .intro > .flex{
    padding: 0 25px 0 0;
    justify-content: flex-start;
    align-items: center;
}
.list_mart.detail .martInfoWrap .intro h4{
    font-size: 1.125rem;
    font-weight: 700;
}
.list_mart.detail .martInfoWrap .intro h4 + div{
    margin: 0 0 0 5px;
    font-weight: 600;
}
.list_mart.detail .martInfoWrap .intro p {
    width: 100%; /*width:255px; 20230315_마트정보 리뉴얼로 텍스트 영역 100%로 변경*/
    color: #555555;
    font-size: 0.875rem;
    line-height: 1.25rem;
    padding-bottom: 25px;
}
.list_mart.detail .martInfoWrap .intro .dvy_info{
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 10px 0 0;
}
.list_mart.detail .martInfoWrap .intro .dvy_info div{
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: .875rem;
    font-weight: 400;
}
.list_mart.detail .martInfoWrap .intro .dvy_info dt{
    color: #333;
}
.list_mart.detail .martInfoWrap .intro .dvy_info dd,
.list_mart.detail .martInfoWrap .intro .dvy_info dd span{
    color: #fd5050;
}

/*box info*/
.list_mart.detail .martInfoWrap > .box_info {
    background: #fff;
    position: relative;
    padding: 0 4.26%;
}
.list_mart.detail .martInfoWrap > .box_info > div {
    align-items: end;
    border-bottom: 1px solid #eeeeee;
}

.list_mart.detail .martInfoWrap .box_info.box_intro p:last-child {
    padding-bottom: 0;
}
.list_mart.detail .box_info .icon_arrow {
    position: absolute;
    right: 18px;
    top: 23px;
}
.list_mart.detail .box_info .icon-btn-prev {
    transform: rotate(90deg);
}
.list_mart.detail .box_info.active .icon-btn-prev {
    transform: rotate(270deg);
}
.list_mart.detail .martInfoWrap .box_info .icon_info {
    display: flex;
    justify-content: center;
    width: 80px;
    height: 100%;
    margin-top: -4px;
    padding-top: 30px;
}
.list_mart.detail .martInfoWrap .box_info .list_info {
    width: calc(100% - 80px);
    padding: 30px 0;
}
.list_mart.detail .martInfoWrap .box_info .list_info > span {
    display: block;
    font-size: 0.938rem;
    margin-bottom: 10px;
}
.list_mart.detail .martInfoWrap .box_info .list_info > p {
    width: 208px;
    color: #717171;
    font-size: 0.938rem;
    font-weight: 400;
    line-height: 1.375rem;
    margin-bottom: 20px;
}
.list_mart.detail .martInfoWrap .box_info .list_info > p:last-child {
    margin-bottom: 0;
}
.list_mart.detail .martInfoWrap .box_info .list_info strong {
    display: block;
    color: #717171;
    font-size: 0.938rem;
    line-height: 1.375rem;
}
.list_mart.detail .martInfoWrap .box_info .list_info > div strong {
    display: inline-block;
}
.list_mart.detail .martInfoWrap .box_info .list_info > div span {
    display: inline-block;
    color: #999999;
    font-size: 0.688rem;
    margin-left: 5px;
}

.list_mart.detail footer {
    padding: 0;
}
.list_mart.detail footer .businessWrap {
    padding: 20px 5.33%;
    background: #f4f4f4;
}
.list_mart.detail footer .businessWrap strong {
    display: block;
    color: #717171;
    font-size: 0.938rem;
    padding-bottom: 14px;
}
.list_mart.detail footer .businessWrap li {
    color: #717171;
    font-size: 0.813rem;
    font-weight: 400;
    line-height: 1.5rem;
}
.list_mart.detail footer .businessWrap li span {
    color: #717171;
    font-size: 0.813rem;
    padding-left: 10px;
}
.list_mart.detail footer h3 {
    padding: 30px 5.33% 0;
}
.list_mart.detail footer .companyArea {
    padding: 0 5.33%;
}
.list_mart.detail footer .policyArea {
    padding: 0 5.33% 105px;
}

/*price*/
/* .list_mart.detail .martInfoWrap > .box_info.delivery {
    padding:0;
} */
.list_mart.detail .martInfoWrap > .box_info.delivery.price {
    border-bottom: 1px solid #eeeeee;
}
.list_mart.detail .martInfoWrap > .box_info.delivery > div {
    border-bottom: none;
}
.list_mart.detail .martInfoWrap > .box_info .btn_option {
    width: 100%;
    height: 48px;
    font-size: 0.938rem;
    border-bottom: 1px solid #eee;
    background: #fff;
    padding: 0 8.53% 0 80px;
}
.list_mart.detail .martInfoWrap > .box_info .btn_option > div {
    display: inline-block;
    margin-right: 13px;
}
.list_mart.detail .martInfoWrap > .box_info .btn_option .icon {
    transform: rotate(270deg);
}
.list_mart.detail .martInfoWrap > .box_info .btn_option.close .icon {
    transform: rotate(90deg);
}
.list_mart.detail .martInfoWrap > .box_info .btn_option .icon::before {
    width: 6px;
    height: 14px;
}
.list_mart.detail .martInfoWrap > .box_info .txt_info {
    display: block;
    background: #f4f4f4;
    padding: 27px 8.53% 7px;
}
.list_mart.detail .martInfoWrap > .box_info .txt_info.close {
    display: none;
}
.list_mart.detail .martInfoWrap > .box_info .txt_info p {
    color: #555;
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.375rem;
}
.list_mart.detail .martInfoWrap > .box_info .txt_info table {
    width: 100%;
    font-size: 0.938rem;
    line-height: 1.75rem;
    margin: 22px 0 24px;
}
.list_mart.detail .martInfoWrap > .box_info .txt_info .price th {
    text-align: left;
}
.list_mart.detail .martInfoWrap > .box_info .txt_info table td {
    color: #555;
    font-weight: 400;
    text-align: right;
}
.list_mart.detail .martInfoWrap > .box_info .txt_info .place th {
    border-bottom: 1px solid #c6c6c6;
    padding-bottom: 16px;
}
.list_mart.detail .martInfoWrap > .box_info .txt_info .place th:first-child {
    text-align: left;
}
.list_mart.detail .martInfoWrap > .box_info .txt_info .place th:last-child {
    text-align: right;
}
.list_mart.detail .martInfoWrap > .box_info .txt_info .place td {
    color: #555;
    font-weight: 400;
    padding: 16px 0;
}
.list_mart.detail .martInfoWrap > .box_info .txt_info .place tr:first-child td {
    border-bottom: 1px solid #c6c6c6;
}
.list_mart.detail .martInfoWrap > .box_info .txt_info .place td:first-child {
    width: 54.01%;
    text-align: left;
}
.list_mart.detail .martInfoWrap > .box_info .txt_info .place td:last-child {
    text-align: right;
}

/*footer*/
/*footer.list_mart {*/
/*background:#F5F6F8;*/
/*}*/
/*footer.list_mart .companyArea li:nth-child(2),*/
/*footer.list_mart .companyArea li:nth-child(5) {*/
/*padding:0;*/
/*}*/
/*footer.list_mart .companyArea li:nth-child(1)::after,*/
/*footer.list_mart .companyArea li:nth-child(4)::after {*/
/*display:none;*/
/*}*/

/*modal*/
.modalArea.list_mart .popWrap .txt_title {
    padding: 41px 8% 15px;
}
.modalArea.list_mart .popWrap .txt_desc {
    padding: 0 8% 33px;
    font-weight: 400;
}
.modalArea.list_mart .popWrap .buttonArea .btn {
    height: 42px;
}

/*=============== delivery ===============*/
.delivery .topArea {
    display: flex;
    align-items: center;
    height: 103px;
    border-bottom: 1px solid #e7ebef;
    background: #fff;
    position: relative;
}
.delivery .topArea > .btn_close {
    position: absolute;
    top: 29px;
    right: 25px;
}

.delivery .btn_option {
    width: 70%;
    padding: 0 4.26%;
}
.delivery .btn_option strong {
    font-size: 1.25rem;
}
.delivery .btn_option strong::after {
    content: "";
    display: inline-block;
    border-top: 6px solid #fd5050;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    vertical-align: middle;
    margin-left: 10px;
}
.delivery .btn_option span {
    display: block;
    font-size: 0.938rem;
    margin-top: 5px;
}

.delivery .box_tab {
    height: 50px;
    border-bottom: none;
    padding: 0 8.53%;
    background: #fff;
}
.delivery .box_tab li {
    width: 50%;
    line-height: 50px;
    text-align: left;
}
.delivery .box_tab li.active::after {
    width: 90%;
    bottom: 0;
}
.delivery .deliveryWrap {
    background: #f5f6f8;
    padding: 0;
    min-height: 100vh;
}
.delivery .deliveryWrap .box_delivery .online,
.delivery .deliveryWrap .box_delivery .offline {
    padding-bottom: 260px;
}

.delivery .deliveryWrap .box_delivery .online .txt_notice,
.delivery .deliveryWrap .box_delivery .offline .txt_notice {
    color: #767676;
    font-size: 1.0625rem;
    text-align: center;
    padding-top: 195px;
    font-weight: 500;
}
.delivery .box_subFilter {
    /*display:flex;*/
    /*justify-content:flex-end;*/
}
.delivery .box_subFilter .selectWrap.sub_filter {
    min-width: auto;
    height: 26px;
    line-height: 26px;
}
.delivery .box_delivery > div {
    display: none;
}
.delivery .box_delivery > div.active {
    display: block;
}
/* .delivery .box_delivery > div > ul {
    padding-bottom:20px;
} */
.delivery .box_delivery > div > ul > li {
    border: 1px solid #eeeeee;
    border-radius: 10px;
    box-shadow: 0 3px 6px #0000001a;
    background: #fff;
    margin: 0 4.26% 16px;
    padding: 16px 4.26%;
    position: relative;
}
.delivery .box_delivery > div > ul > li:last-child {
    margin-bottom: 0;
}
.delivery .infoWrap .box_status > span {
    color: #b4b4b4;
    font-size: 0.875rem;
    font-weight: bold;
}
.delivery .infoWrap .box_status > span.color {
    color: #fd5050;
}
.delivery .infoWrap .box_status > a {
    transform: rotate(180deg);
    position: absolute;
    top: 17px;
    right: 20px;
}
.delivery .infoWrap > .txt_title {
    font-size: 1.063rem;
    padding: 15px 0 10px;
}
.delivery .infoWrap > .txt_cancel_title {
    font-size: 1.063rem;
    line-height: 1.375rem;
    padding: 0px;
}

.delivery .infoWrap > .num_price strong {
    font-size: 1.063rem;
}
.delivery .infoWrap > .txt_location {
    display: block;
    color: #8b8b8b;
    font-size: 0.875rem;
    padding: 10px 0 17px;
    border-bottom: 1px solid #e0e0e0;
}
.delivery .box_delivery .payWrap {
    padding: 15px 0 5px;
}
.delivery .box_delivery .payWrap.cancel_page {
    padding: 8px 0 15.5px;
    border-bottom: 1px solid #e0e0e0;
}
.delivery .box_delivery .payWrap span {
    display: inline-block;
    color: #8b8b8b;
    font-size: 0.813rem;
    font-weight: 400;
    line-height: 1.25rem;
}
.delivery .box_delivery .payWrap span.sub {
    display: block;
    padding-left: 85px;
}
.delivery .box_delivery .payWrap span:first-child {
    min-width: 72px;
    padding-right: 10px;
}
.delivery .box_delivery .payWrap span:nth-child(2) {
    padding-left: 10px;
    position: relative;
}
.delivery .box_delivery .payWrap span:nth-child(2)::before {
    content: "";
    display: inline-block;
    width: 1px;
    height: 14px;
    background: #e0e0e0;
    position: absolute;
    top: 0;
    left: 0;
}
.delivery .box_delivery .cancelWrap {
    padding: 13.5px 0 16px;
}
.delivery .box_delivery .cancelWrap span {
    display: inline-block;
    font-size: 0.8125rem;
    line-height: 1.1875rem;
    letter-spacing: -0.0325rem;
    margin-bottom: 4px;
}
.delivery .box_delivery .cancelWrap span:first-child {
    padding-right: 8px;
    min-width: 72px;
    position: relative;
}
.delivery .box_delivery .cancelWrap span:first-child:after {
    content: "";
    display: inline-block;
    width: 1px;
    height: 14px;
    background: #e0e0e0;
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
}
.delivery .box_delivery .cancelWrap span:nth-child(2) {
    padding-left: 8px;
}
.delivery .box_delivery p.notice {
    font-size: 0.8125rem;
    letter-spacing: -0.0325rem;
    line-height: 1.125rem;
    text-align: center;
    padding: 8px 0;
    border-radius: 8px;
    color: #8b8b8b;
    background: #f4f4f4;
}
.delivery .box_delivery p.notice img {
    display: inline-block;
    width: 18px;
    height: 18px;
    vertical-align: -3px;
}

.delivery .box_delivery .buttonArea {
    width: 100%;
    left: 0;
    margin: 0;
    padding: 0;
}
.delivery .box_delivery .buttonArea .btn {
    width: calc(50% - 3px);
    height: 44px;
    color: #757575;
    font-size: 0.875rem;
    font-weight: 500;
}
.delivery .box_delivery .buttonArea .btn.disabled {
    color: #c4c2c2;
    border: none;
    background: #f5f6f8 !important;
}

.floatArea.delivery .list_menu li:first-child {
    border-top: none;
}

/*none*/
.delivery .contArea .descArea {
    text-align: center;
}
.delivery .contArea .descArea .imgWrap {
    padding: 28.16% 0 12.15%;
}
.delivery .contArea .descArea p {
    color: #767676;
    font-size: 1.125rem;
    font-weight: 400;
    line-height: 1.625rem;
}
.delivery .buttonArea {
    margin-top: 45%;
}

/*=============== order ===============*/
#container.order {
    background: #f7f8fa;
}
.order .topArea {
    font-size: 0.875rem;
    background: #fff;
    position: relative;
}
.order .topArea > span {
    display: block;
    height: 52px;
    color: #767676;
    font-size: 0.938rem;
    line-height: 52px;
    padding: 0 4.26%;
}
.order .topArea strong {
    color: #767676;
    font-size: 0.938rem;
}

.order .topArea .call {
    display: inline-block;
    width: 100px;
    height: 34px;
    line-height: 34px;
    font-size: 0.875rem;
    letter-spacing: -0.035rem;
    text-align: center;
    border-radius: 8px;
    color: #fff;
    background: #fd5050;
    /* position: absolute;
    right: 16px;
    top: 50%;
    transform: translateY(-50%); */
}
.order .topArea .buttonArea {
    border-top: 1px solid #e7ebef;
    border-bottom: 1px solid #e7ebef;
    margin: 0;
    padding-bottom: 12px;
}
.order .topArea .buttonArea .btn {
    width: calc(50% - 3px);
    height: 44px;
    color: #757575;
    font-size: 0.875rem;
    font-weight: 500;
}
.order .topArea .buttonArea .btn.disabled {
    color: #ffffff;
    border: none;
    background: #d3d3d3 !important;
}
.order .topArea .buttonArea .btn.lg {
    width: 100%;
}
.order .prodWrap {
    margin: 0;
    background: #fff;
    border-top: 1px solid #e7ebef;
}
.order .prodWrap .sub {
    padding: 9px 4.26%;
}
.order .prodWrap .sub.cancel {
    width: 100%;
}

.order .prodWrap .sub li {
    justify-content: start;
    padding: 10px 0;
    position: relative;
}
.order .prodWrap > li.active .sub {
    display: block;
}
.order .prodWrap .sub .imgWrap {
    width: 82px;
    height: 82px;
    border: 1px solid #e7ebef;
    border-radius: 10px;
    overflow: hidden;
    position: relative;
}
.order .prodWrap .sub .imgWrap img {
    width: 100%;
}
.order .prodWrap .sub .box_desc {
    flex: 1;
    width: calc(100% - 98px);
    margin-left: 14px;
}
.order .prodWrap .sub .box_desc label {
    position: absolute;
    top: 10px;
    right: 0;
}
.order .prodWrap .sub .box_desc label input {
    margin-right: 0;
}
.order .prodWrap .sub .txt_name {
    display: block;
    max-width: 193px;
    height: 45px;
    color: #1c1c1c;
    font-size: 0.875rem;
    line-height: 1.25rem;
    padding-top: 3px;
    overflow: hidden;
    display: -webkit-box;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.order .prodWrap .sub .txt_name .tag_4 {
    height: 12px;
    color: #fff;
    font-size: 0.5rem;
    border-radius: 5px;
    background: #000;
    padding: 0 5px 2px;
}
.order .prodWrap .sub .list_num {
    color: #1c1c1c;
    font-size: 0.75rem;
    text-align: right;
    margin-top: 5px;
}
.order .prodWrap .sub .list_option {
    align-items: center;
    margin-top: 15px;
    position: relative;
}
.order .sub .list_option .num_prise {
    color: #9a9a9a;
    font-size: 0.875rem;
}
.order .sub .list_option .num_prise strong {
    font-size: 1rem;
}
.order .sub .list_option .txt_step {
    color: #fd5050;
    font-size: 0.75rem;
    font-weight: bold;
    position: absolute;
    top: -16px;
    right: 0;
}
.order .sub .list_option .num_quant,
.order .sub .list_option .num_quant span {
    color: #9a9a9a;
    font-size: 0.875rem;
}
.order .prodWrap .sub li .txt_message {
    width: 100%;
    color: #242426;
    font-size: 0.875rem;
    border: 1px solid #b7b7b7;
    border-radius: 8px;
    background: #f0f2f5;
    padding: 10px 13px;
    margin: 20px 0;
}

/*sold out*/
.order .prodWrap .sub .soldOut .imgWrap::after {
    content: "품절";
    width: 40px;
    height: 40px;
    color: #fff;
    font-size: 0.875rem;
    text-align: center;
    line-height: 40px;
    border-radius: 12px;
    position: absolute;
    top: 21px;
    left: 21px;
}
.order .prodWrap .sub .soldOut .imgWrap::before {
    content: "";
    width: 82px;
    height: 82px;
    border-radius: 10px;
    background: rgba(0, 0, 0, 0.4);
    position: absolute;
    top: 0;
    left: 0;
}
.order .sub .soldOut .txt_name,
.order .sub .soldOut strong,
.order .sub .soldOut span {
    color: rgba(28, 28, 28, 0.4);
}

.order .infoWrap .box_tab {
    height: 56px;
    line-height: 56px;
    border-top: 1px solid #e7ebef;
    padding: 0 4.26%;
    position: relative;
}
.order .infoWrap li.active .icon {
    transform: rotate(90deg);
}
.order .infoWrap li.active .icon-re_rotate {
    transform: rotate(0deg);
}
.order .infoWrap .box_tab .icon {
    transform: rotate(270deg);
    position: absolute;
    top: 17px;
    right: 25px;
}
.order .infoWrap .sub {
    display: none;
    background: #f7f8fa;
    padding: 24px;
}
.order .infoWrap li.active .sub {
    display: block;
}
.order .infoWrap .sub table {
    width: 100%;
}
.order .infoWrap .sub table tr {
    font-size: 0.938rem;
    line-height: 2rem;
}
.order .infoWrap .sub table th {
    width: 125px;
    color: #666666;
    font-size: 0.938rem;
    font-weight: 400;
}
.order .infoWrap .sub table td {
    color: #222222;
    font-size: 0.938rem;
    line-height: 1.375rem;
}

/*결제정보*/
.order .infoWrap .sub.pay .indent {
    text-indent: 6px;
}
.order .infoWrap .sub.pay .indent {
    line-height: 1.25rem;
}
.order .infoWrap .sub.pay .indent th,
.order .infoWrap .sub.pay .indent td {
    font-size: 0.875rem;
}
.order .infoWrap .sub.pay tr.top {
    border-top: 1px solid #e7ebef;
}
.order .infoWrap .sub.pay tr.top th {
    padding-top: 10px;
}
.order .infoWrap .sub.pay tr.bottom {
    border-bottom: 1px solid #e7ebef;
}
.order .infoWrap .sub.pay tr.bottom th {
    padding-bottom: 10px;
}
.order .infoWrap .sub.pay td {
    text-align: right;
}

/*cancel*/
.order.cancel .topArea {
    align-items: center;
}
.order.cancel .topArea .btn {
    width: 50px;
    height: 26px;
    color: #9a9a9a;
    font-size: 0.813rem;
    margin-right: 4.26%;
    margin-top: 0;
}
.order.cancel .prodWrap {
    margin: 0;
}
.order.cancel .prodWrap .box_all {
    display: flex;
    align-items: center;
    height: 52px;
    font-size: 0.875rem;
    border-top: 1px solid #e7ebef;
    border-bottom: 1px solid #e7ebef;
    padding: 0 4.26%;
}
.order.cancel .prodWrap .sub li > label {
    position: absolute;
    top: 12px;
    right: 0;
    margin-right: 0;
}
.order.cancel .prodWrap .sub li > label input {
    margin-right: 0;
}
.order.cancel .num_order input {
    float: left;
    width: 30px;
    height: 26px;
    line-height: 26px;
    color: #121212;
    font-size: 0.75rem;
    text-align: center;
    border-top: 1px solid #e8ecf0;
    border-left: none;
    border-right: none;
    border-bottom: 1px solid #e8ecf0;
    border-radius: 0;
    vertical-align: top;
    padding: 0;
}
.order.cancel .num_order button {
    float: left;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    color: #8b8b8b;
    border: 1px solid #e8ecf0;
    border-radius: 4px 0 0 4px;
    background: #fff;
    position: relative;
}
.order.cancel .num_order button:last-child {
    border-radius: 0 4px 4px 0;
}
.order.cancel .num_order button > .icon {
    transform: scale(0.7);
}

.order.cancel .buttonArea {
    border-top: 1px solid #e7ebef;
    background: #fff;
    padding: 16px;
    margin-top: 10px;
}

/*=============== receipt ===============*/
.receipt .topArea {
    border-bottom: 1px solid #e7ebef;
}
.receipt .topArea ul {
    height: 68px;
    align-items: center;
    padding: 12px 4.26%;
}
.receipt .topArea ul li {
    width: calc(50% - 3px);
}
.receipt .topArea ul li .btn {
    height: 44px;
    color: #757575;
    font-size: 0.875rem;
    font-weight: 500;
    border-color: #d3d3d3;
    margin-top: 0;
}
.receipt .contArea {
    height: calc(100% - 146px);
}
.receipt .noticeWrap {
    margin-top: 22px;
    height: 72.11%;
    overflow-y: auto;
    background: url("../images/img/img_watermark.svg") center center no-repeat;
}
.receipt .box_barcode {
    width: 100%;
    text-align: center;
    border-top: 1px solid #e7ebef;
    padding: 37px 0 0;
}
.receipt .icon_barcode {
    display: block;
    height: 44px;
}
.receipt .icon_barcode img {
    width: 65.4%;
}
.receipt .num_barcode {
    display: block;
    width: 65.4%;
    font-size: 0.75rem;
    font-weight: 500;
}

/*receipt 약관 임시 스타일*/
.receipt .noticeWrap > div {
    padding-bottom: 20px;
}
.receipt .noticeWrap .txt_title {
    color: #222222;
    font-size: 0.813rem;
    font-weight: bold;
    line-height: 1.375rem;
    padding: 10px 18px 5px;
}
.receipt .noticeWrap > div:first-child .txt_title {
    padding-top: 0;
}
.receipt .noticeWrap p {
    color: #222222;
    font-size: 0.813rem;
    font-weight: 400;
    line-height: 1.375rem;
    padding: 0 18px 10px;
}
.receipt .noticeWrap p b {
    font-weight: bold;
}

.receipt .noticeWrap p.indent {
    padding-left: 30px;
}
.receipt .noticeWrap p.indent_2 {
    color: #222222;
    font-size: 0.813rem;
    font-weight: 400;
    line-height: 1.375rem;
    padding: 0 18px 10px 40px;
}

/*2021_04_29 mart_icon 추가*/
.mart .myWrap .titArea > .color {
    display: inline-block;
    color: #fd5050;
    font-size: 1rem;
    padding-left: 5px;
}
.mart .myWrap .titArea > .color.bold {
    font-weight: bold;
}
.mart .myWrap .titArea > .color .icon {
    vertical-align: 0;
    transform: rotate(180deg);
    filter: invert(51%) sepia(82%) saturate(4299%) hue-rotate(332deg)
        brightness(107%) contrast(99%);
}
.mart .myWrap .titArea > .color .icon::before {
    width: 6px;
    height: 13px;
    padding-left: 10px;
}

/* 환불계좌 추가 */
.refund_info {
    padding: 20px 0px;
    margin: 0 4.26%;
}
.refund_info .title {
    /* height: 20px; */
    margin-bottom: 20px;
}

.refund_info .title strong {
    display: block;
    margin: 0;
    font-size: 0.9375rem;
    font-weight: 600;
    /* padding-right: 1rem;
    letter-spacing: -.0375rem;   */
    color: #ff8282;
}
.refund_info .title span {
    display: inline-block;
    margin: 5px 0 0;
    font-size: 0.775rem;
    /* line-height: 1.125rem;
    letter-spacing: -0.0325rem; */
    color: #ababab;
}
.refund_info .row {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
}
.refund_info .row:last-child {
    margin-bottom: 0;
}
.refund_info .row .wid20 {
    width: 80px;
    flex-shrink: 0;
}
.refund_info .row .wid20 span {
    font-size: 0.9375rem;
    /* letter-spacing: -0.035rem; */
    /* color: #8B8B8B; */
}
.refund_info .row .wid80 {
    /* width: 80%; */
    flex: 1;
}
.refund_info .row .wid80 input {
    width: 100%;
    padding: 0 10px;
    background: #fff;
    border-radius: 4px;
    border-color: #eaeaea;
}
.refund_info .btnRight {
    display: flex;
    gap: 10px;
    /* text-align: right; */
    margin-top: 20px;
}
.refund_info .btnRight button {
    display: inline-block;
    /* width: 100px; */
    flex: 1;
    height: 40px;
    line-height: 39px;
    text-align: center;
    font-size: 0.875rem;
    color: #fff;
    background: #fd5050;
    border-radius: 4px;
}
.refund_info .btnRight button.edit {
    border: 1px solid #fd5050;
    color: #fd5050;
    background: #fff;
}

/* 주문배송조회 추가 */
.order .prodWrap .tab_menu {
    height: 60px;
    line-height: 60px;
    padding: 0 4.26%;
    border-bottom: 1px solid #e7ebef;
}
.order .prodWrap .tab_menu > li {
    width: 50%;
    font-size: 0.9375rem;
    font-weight: normal;
    text-align: center;
    color: #8b8b8b;
}
.order .prodWrap .tab_menu > li.active {
    font-weight: bold;
    color: #fd5050;
    border-bottom: 2px solid #fd5050;
}
.order .prodWrap .tab_menu > li strong {
    font-size: 0.9375rem;
    font-weight: normal;
    text-align: center;
    color: #8b8b8b;
}
.order .prodWrap .tab_menu > li.active strong {
    font-weight: bold;
    color: #fd5050;
}
.order .prodWrap .sub .btnCenter {
    margin-top: 14px;
}
.order .prodWrap .sub .btnCenter .btn {
    display: inline-block;
    width: 100%;
    font-size: 1rem;
    letter-spacing: -0.04rem;
    color: #757575;
    border: 1px solid #757575;
}
/* 회원가입 우리동네마트찾기 */
.myWrap .listMart li .btnLeft {
    display: flex;
    justify-content: flex-end;
    column-gap: 4px;
    margin-top: 8px;
}
.myWrap .listMart li .btnLeft .btn_fav {
    position: static;
}
.myWrap .listMart li .btnLeft .btn_visit {
    display: inline-block;
    width: 66px;
    height: 32px;
    line-height: 29px;
    text-align: center;
    border: 1px solid #fd5050;
    border-radius: 6px;
}
.myWrap .listMart li .btnLeft .btn_visit span {
    font-size: 0.8125rem;
    color: #fd5050;
}

/* 주차관리 추가 20210830 */
.parking {
    background: #f5f6f8;
}
.parking .topArea {
    background: #fff;
    padding: 4.26%;
}
.parking .topArea .notice {
    border: 1px solid #b7b7b7;
    border-radius: 10px;
    padding: 5%;
    background: #fff;
}
.parking .topArea .notice li {
    font-size: 0.875rem;
    padding-left: 10px;
    margin-bottom: 10px;
    position: relative;
    color: #888;
}
.parking .topArea .notice li:before {
    content: "";
    display: block;
    width: 4px;
    height: 4px;
    background: #888;
    border-radius: 100%;
    position: absolute;
    top: 5px;
    left: 0;
}
.parking .topArea .notice li:last-child {
    margin-bottom: 0;
}
.parking .contArea {
    padding: 0 4.26%;
}
/* .parking .parking_num{
    display: flex;
    column-gap: 3%;
} */
.parking .parking_num:after {
    content: "";
    display: block;
    clear: both;
}
.parking .parking_num input {
    float: left;
    width: 75%;
}
.parking .notice_txt {
    font-size: 0.75rem;
    color: #fd5050;
    margin: 1% 0;
}
.parking .btn_check {
    height: 42px;
    width: 22.26%;
    border-radius: 10px;
    background: #fd5050;
}
.parking .btn_check:disabled,
.parking .md:disabled {
    background: #d9d9d9;
    color: #fff;
}
.parking .txt_title {
    font-size: 0.875rem;
    letter-spacing: -0.56px;
    line-height: 25px;
    color: #888888;
    margin-top: 4.26%;
}
.parking .parking_list {
    /* padding: 4.26% 0; */
    margin-bottom: 170px;
}
.parking .parking_list li {
    display: flex;
    justify-content: space-between;
    align-items: center;

    padding: 4.26%;
    margin-bottom: 10px;
    border-bottom: 1px solid #ddd;
    border-radius: 10px;
    box-shadow: 0 3px 6px #0000001a;
    background: #fff;
}
.parking .parking_list li span {
    display: inline-block;
    width: 70%;
    font-size: 0.875rem;
    color: #888;
}
.parking .parking_list li .btn_line {
    width: 22.26%;
    height: 30px;
    font-size: 0.875rem;
    border-radius: 10px;
    background: #fff;
}

/* 회원프로모션 이벤트 관련 (1회성)*/
.myPage .btnArea {
    padding: 0 4.26%;
    margin: 20px 0;
}
.myPage .btnArea .evt_btn {
    width: 100%;
    height: 50px;
    background: #fd5050;
    border-radius: 10px;
    color: #fff;
    font-size: 0.9375rem;
    letter-spacing: -0.05rem;
}
/* 주소검색 */
.modalArea.adress .popWrap {
    height: 92.61%;
    border-radius: 20px 20px 0 0;
    overflow: hidden;
}
.modalArea.adress .popWrap.pop_md {
    height: 89%;
}
.modalArea.adress .popWrap.pop_full {
    height: 98%;
}
.modalArea.adress .popWrap header {
    width: 100%;
    height: 60px;
    border-bottom: none;
    background: #fff;
    position: relative;
    z-index: 10;
}
.modalArea.adress .popWrap .searchArea {
    padding: 5px 10px;
    background: #f5f6f8;
}
.modalArea.adress .popWrap .box_search {
    position: relative;
}
.modalArea.adress .popWrap .box_search input {
    background: #fff;
    border-color: #e7ebef;
    border-radius: 8px;
    padding-right: 35px;
}
.modalArea.adress .popWrap .box_search .btn_search {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    width: 30px;
    height: 30px;
}
.modalArea.adress .popWrap .pd-b130 {
    padding-bottom: 130px;
}
.modify.adress_pop.modalArea {
    text-align: center;
}
.tab_refund .box_subFilter .selectWrap.sub_filter {
    min-width: auto;
    height: 26px;
    line-height: 26px;
}

/* 우리동네마트찾기 추가 */
.con-has--tab .box_tab {
    background: #fff;
    padding: 0 4.26%;
}
.con-has--tab .box_tab li {
    width: 50%;
    line-height: 50px;
    text-align: left;
    text-indent: 5px;
}

.con-has--tab .box_tab.item-3 li {
    width: 33.3333%;
}

.con-has--tab .box_tab li.active::after {
    width: 90%;
    bottom: 0;
}
.con-has--tab .box_tab + .cont_tab > div {
    display: none;
}
.con-has--tab .box_tab + .cont_tab > div.active {
    display: block;
}
/*.con-has--tab .txt_notice{
    padding-top: 274px;
}*/
.tag-kinds {
    font-size: 0.875rem;
    height: 28px;
    line-height: 28px;
    padding: 0 10px;
    border-radius: 0.375rem;
    margin-right: 6px;
}
.tag-kinds--red {
    background: #fd5050;
    color: #fff;
}
.tag-kinds--yellow {
    background: #ffbc10;
    color: #fff;
}

@media screen and (max-width: 360px) {
    .tag-kinds {
        font-size: 0.75rem;
        height: 28px;
        line-height: 28px;
        padding: 0 8px;
        border-radius: 0.375rem;
        margin-right: 4px;
    }
    .myWrap .listMart li .tags .tag {
        padding: 0 4px;
    }
}

/*=============== event ===============*/
/*220829_plcc 이벤트 추가*/
.eventContent .plcc_moreBtn {
    position: fixed;
    width: 100%;
    bottom: 0;
    border-top: 1px solid #e7ebef;
    font-size: 1.5rem;
    font-weight: 700;
}

.eventContent .plcc_moreBtn > i {
    position: absolute;
    right: 1.25em;
}

.plccEventJoin {
    background: linear-gradient(90deg, #f1f5f6 0%, #e0e3e4 100%);
    /*background-color: #fd5050;  20230101 이전 스타일*/
}

.plccEventJoin button {
    width: 65%;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.3);
    margin: 0 auto;
}

.eventContent .textArea strong {
    color: #8b8b8b;
    font-weight: 700;
}

.eventContent .textArea ul {
    list-style-type: "\2d";
    padding: 1rem;
}

.eventContent .textArea ul li,
.eventContent .textArea ul li strong,
.eventContent .textArea b {
    color: #bfc4c9;
    font-size: 0.85rem;
    padding-top: 0.5rem;
    line-height: 1.1rem;
}

.eventContent .textArea b {
    margin-bottom: 150px;
}

.eventContent .event_alert_bar {
    position: fixed;
    height: 52px;
    width: 100%;
    /*padding: 0.5rem 1rem;*/
    border-bottom: 1px solid #e0e0e0;
    background-color: #ffffff;
}

/*이벤트 페이지 상단 info영역 이미지로 사용 시*/
.eventContent .event_alert_bar img {
    width: 100%;
}

.eventContent .event_alert_bar .tomato_info .alert_title {
    font-size: 0.75rem;
    color: #3c3c3c;
    font-weight: bold;
}
.eventContent .event_alert_bar .tomato_info .alert_sub {
    font-size: 0.625rem;
    color: #909090;
    font-weight: 400;
}
.eventContent .event_alert_bar .tomato_info .alert_sub > span {
    font-weight: bold;
    color: #e73628;
}
.eventContent .event_alert_bar button {
    font-size: 0.668rem;
    height: auto;
    padding: 0.5rem;
    text-align: center;
    border-radius: 50px;
}
.eventContent .event_alert_bar .icon::before {
    width: 32px;
    height: 32px;
}

.imgWrap.alert_margin {
    padding-top: 52px;
}

/* 220923 농수산물 쿠폰관련 추가 - 차혜리 */
.coupon-date {
    bottom: 12px !important;
}
.coupon-condition {
    bottom: 27px !important;
}
.py-xm {
    padding: 0.65rem 0 !important;
}
.coupon-balance {
    position: relative;
    top: 4px;
    padding-left: 8px;
    margin-left: 8px;
}
.coupon-balance::before {
    content: "";
    width: 1px;
    height: 24px;
    background-color: #d9d9d9;
    position: absolute;
    top: 8px;
    left: 0;
}
.coupon-balance-text {
    display: block;
    font-size: 0.7rem;
    color: #8d8d8d;
    font-weight: 400;
}
.coupon-balance-price,
.coupon-balance-price span {
    color: #2fb756;
}

/* 220926 쿠폰관련 추가 - 이승미 */
/*사용기간 - 사용 조건 class 구분*/
.couponWrap li .box_title .num_condition {
    color: #8b8b8b;
    font-size: 0.625rem;
    font-weight: 400;
    position: absolute;
    left: 20px;
}

.couponWrap li .box_title .num_condition .numStyle {
    vertical-align: middle;
    color: inherit;
}

/* 220929 쿠폰함 개선 - 차혜리 */
.coupon-add {
    width: 82px;
    height: 24px;
    position: absolute;
    top: 55%;
    right: 4px;
    transform: translateY(-50%);
    font-size: 0.75rem;
    border-radius: 20px;
    background-color: #fff6f6;
    color: #fd5050;
    font-size: 500;
}

.coupon-tab {
    width: 100%;
    padding: 0.5rem 8.53% 0 8.53%;
    background-color: #fff;
    display: flex;
}

.coupon-tab li {
    flex: 1;
    height: 2rem;
    text-align: center;
    position: relative;
}

.coupon-tab li,
.coupon-tab span {
    font-size: 1rem;
    font-weight: 500;
    color: #8b8b8b;
}
.coupon-tab li.active,
.coupon-tab li.active span {
    font-size: 1rem;
    font-weight: 700;
    color: #fd5050;
}
.coupon-tab li.active:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: #fd5050;
}
.color-red {
    color: #ff1d1d !important;
}
.color-green {
    color: #2fb756 !important;
}
.num_coupons {
    color: #ff1d1d !important;
    font-weight: 700;
    font-family: "GmarketSans", sans-serif;
}
.coupon-category-title {
    font-size: 0.75rem;
    color: #606060;
    font-weight: 500;
}
.coupon-shape-left {
    position: absolute;
    top: calc(50% - 5px);
    left: -8px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background-color: #fff;
    border: 1px solid #cdcdcd;
}
.coupon-shape-left::before {
    content: "";
    position: absolute;
    left: -3px;
    top: -1px;
    width: 9px;
    height: 16px;
    background-color: #fff;
}
.coupon-shape-right {
    position: absolute;
    top: calc(50% - 5px);
    right: -8px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background-color: #fff;
    border: 1px solid #cdcdcd;
}
.coupon-shape-right::before {
    content: "";
    position: absolute;
    right: -3px;
    top: -1px;
    width: 9px;
    height: 16px;
    background-color: #fff;
}
.tag_line.gray {
    background: #fff !important;
    color: #606060 !important;
    border-color: #606060 !important;
}
.tag_line.red {
    background: #fff !important;
    color: #fd5050 !important;
    border-color: #fd5050 !important;
    height: auto !important;
}

.tag_fill.gray {
    background: #f7f7f7 !important;
    color: #606060 !important;
}

.txt_title2 {
    font-size: 0.875rem !important;
    width: 100% !important;
}

.all-store {
    position: relative;
}

.all-store .box_tag {
    width: 100%;
    left: 0 !important;
}
.txt_date_remain {
    font-size: 0.75rem;
    font-weight: 500;
    color: #3c3c3c;
    line-height: 1rem;
}
.txt_date_end {
    color: #ff1d1d;
}

.po-rel-up {
    position: relative;
    top: -5px;
}

.get-a-coupon {
    width: 100%;
    height: 38px;
    line-height: 38px;
    background: #ffffff;
    border: 1px solid #ced8e1;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.get-a-coupon-text {
    font-weight: 500;
    font-size: 0.875rem;
    background: linear-gradient(90deg, #ff6161 53.52%, #c105e0 100%);
    -webkit-background-clip: text;
    color: transparent;
}
.monthly-coupon {
    padding: 0 0 70px;
}
.monthly-coupon .coupon-down {
    display: block;
    margin: 5px 0 0;
}
.month-coupon-list img {
    padding: 0.5rem;
    padding-left: 1rem;
}
.coupon-detail {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 20px 20px 0 0;
    padding: 1.5rem;
}
.coupon-detail-top {
    width: 100%;
    /* min-height: 140px; */
}
.coupon-itself {
    width: 100%;
    /* height: 140px; 높이 고정값 지정(기존: 지정X)_221108_이승미 */
    background: #ffffff;
    border: 1px solid #cdcdcd;
    border-radius: 8px;
    position: relative;
    padding: 2.469rem 0;
    text-align: center;
}
.coupon-itself.all-store {
    padding: .375rem 10px;
}
.coupon-another img {
    width: 100%;
    max-height: 150px;
    object-fit: contain;
}
.coupon-detail-top img {
    display: block;
    width: 100%;
    max-height: 150px;
    margin: 0 auto;
    object-fit: contain;
}
.detail-all-store {
    display: inline-block;
    background: #ffffff;
    border: 1px solid #fd5050;
    border-radius: 5px;
    padding: 0 0.5rem;
    font-weight: 500;
    font-size: 0.625rem;
    line-height: 1.2rem;
    color: #fd5050;
}
.coupon-detail-top .coupon-shape-left,
.coupon-detail-top .coupon-shape-right {
    background-color: #fff;
}
.coupon-detail-top .coupon-shape-left::before,
.coupon-detail-top .coupon-shape-right::before {
    background-color: #fff;
}
.coupon-detail-title {
    text-align: center;
    font-weight: 700;
    font-size: 1rem;
    line-height: 1.2rem;
    color: #3c3c3c;
    padding: 1.375rem 0;
}
.coupon-detail th {
    text-align: left;
    color: #919191;
    font-size: 0.9rem;
}
.coupon-detail td {
    color: #3c3c3c !important;
    font-weight: 500 !important;
    letter-spacing: -0.05em;
    font-size: 0.9rem;
}
.coupon-detail-info tr {
    line-height: 32px;
}
.ft-gmarket {
    font-family: "GmarketSans", sans-serif !important;
    letter-spacing: -0.05em;
}
.br {
    display: none;
}
.coupon-detail-notice {
    width: 100%;
    background-color: #f9f9fc;
    padding: 0 1.25rem;
    padding-bottom: 1.25rem;
    border-radius: 8px;
}
.coupon-detail-notice th {
    color: #787878 !important;
    position: relative;
    left: -0.5rem;
}
.coupon-detail-notice td {
    font-size: 0.75rem;
    color: #919191 !important;
    position: relative;
    font-weight: 400 !important;
}
.coupon-detail-notice td::before {
    content: "-";
    position: absolute;
    top: 0;
    left: -0.5rem;
    font-size: 0.8rem;
    margin-right: 0.3rem;
}
.btn_basic.dark2 {
    background-color: #555;
}
.month-coupon-list.complete img {
    opacity: 0.2;
}
.coupon-down {
    font-size: 0.75rem !important;
    color: #fd5050;
    font-weight: 500;
}
.month-coupon-before,
.month-coupon-after {
    display: none;
}
.month-coupon-before.complete,
.month-coupon-after.complete {
    display: block;
}

/* 쿠폰등록 */
.coupon-entry-wrap {
    border-radius: 0 !important;
    height: 80px !important;
    padding: 1rem;
}
.coupon-entry {
    display: flex;
    position: relative;
    width: 90%;
}
.coupon-entry button {
    position: absolute;
    top: 0;
    right: 0;
    width: 80px;
    height: 100%;
    background-color: #fd5050;
    border-radius: 0 10px 10px 0;
    color: #fff;
    font-size: 0.875rem;
}
.coupon-entry-chk,
.coupon-entry-error {
    text-align: center;
}
.coupon-entry-chk i,
.coupon-entry-error i {
    padding: 8px 0;
    position: relative;
    top: 30px;
}
.coupon-freebie .txt_desc {
    font-size: 1.125rem !important;
    color: #000 !important;
    font-weight: 500 !important;
}

/* 화면 너비 미디어 쿼리=============================================================== */
@media screen and (max-width: 400px) {
    .couponWrap li .box_title {
        padding-right: 0;
    }
    .couponWrap li .box_title .num_price > span {
        font-size: 1.5rem !important;
    }
    .coupon-balance {
        padding-left: 4px;
        margin-left: 4px;
    }
}
/* 221014 너비 370px 할인잔여금액 한줄로 나오게 수정 - 차혜리*/
@media screen and (max-width: 370px) {
    .coupon-balance {
        top: 0;
        padding: 0;
        margin: 0;
    }
    .coupon-balance::before {
        display: none;
    }
    .coupon-balance-text {
        display: inline-block;
    }
    .couponWrap li .box_title .num_price {
        width: 100%;
    }
    .py-xm {
        padding: 0.25rem 0 0 0 !important;
    }
    .br {
        display: inline-block;
    }

    /* 221018 쿠폰함 리뉴얼 -차혜리*/
    .month-coupon-list img {
        padding: 0;
        padding-left: 0.75rem;
    }
}

/* 221108 쿠폰함 개선_추가 - 이승미 */
.coupon .box_coupon div.none .txt_notice {
    color: #767676;
    text-align: center;
    padding-top: 50%;
}

/* 230102 사업자회원)계정관리 추가 - 이승미 */
.accountSetting .txt_notice {
    padding: 1rem 0;
    text-align: center;
    font-size: 0.75rem;
    color: #606060;
}

.accountSetting .account_unit {
    width: 100%;
    display: flex;
    flex-wrap: nowrap;
    align-items: stretch;
    padding: 1rem;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
    background-color: #ffffff;
    border: 1px solid #ededed;
    border-radius: 5px;
}

.accountSetting .account_unit.active {
    border: 1px solid #fd5050;
}

.accountSetting .account_unit > div.flex {
    flex: 1;
    justify-content: flex-start;
    gap: 0.75rem;
}

.accountSetting .account_unit .account_name {
    width: 100%;
    display: block;
    font-weight: 700;
    color: #1c1c1c;
    font-size: 1rem;
}

.accountSetting .account_unit .account_type {
    display: inline-block;
    margin: 5px 0 0;
    font-weight: 400;
    color: #FF8282;
    font-size: 0.75rem;
}

.accountSetting .account_unit > button.setting,
.accountSetting .account_unit > .box_checkbox {
    margin-left: auto;
}

.accountSetting #btnAddBusinessAccount {
    display: block;
    width: calc(100% - 2.5rem);
    margin: 0 auto;
    padding: 1rem;
    font-size: 0.9275rem;
    color: #fff;
    background: #fd5050;
    border-radius: 5px;
}

button.btn-help {
    position: absolute;
    top: 50%;
    right: 1rem;
    transform: translateY(-50%);
    z-index: 1;
}
button.btn-help i {
    filter: brightness(10);
}

.coupon-add.gray {
    background-color: #f7f8fa;
    color: #a0a0a0;
}

/* 230102 사업자회원)통합계정 관리 - 이승미 */
.accountSetting.modalArea .topArea {
    display: flex;
    align-items: center;
    height: 103px;
    position: relative;
    background: #fff;
}
.accountSetting.modalArea .box_mart {
    padding: 0 8.53%;
}
.accountSetting.modalArea .box_mart {
    line-height: 1;
    background: #fff;
    padding: 24px 8.53% 26px;
    position: relative;
    z-index: 10;
}
.accountSetting.modalArea .box_mart .txt_name strong {
    display: block;
    font-size: 1.25rem;
    font-weight: 500;
    padding-bottom: 5px;
}
.accountSetting.modalArea .box_mart .txt_name {
    font-size: 0.938rem;
    font-weight: 400;
    line-height: 1.5rem;
}
.accountSetting.modalArea .box_mart .txt_name strong::after {
    content: "";
    display: inline-block;
    border-top: 6px solid #fd5050;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    vertical-align: middle;
    margin-left: 10px;
}
.accountSetting.modalArea .contArea {
    height: 100%;
}
.accountSetting .account_unit .account_content {
    display: block;
    font-weight: 700;
    color: #1c1c1c;
    font-size: 0.75rem;
}
.accountSetting .account_unit .account_content .tag {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 14px;
    width: 36px;
    padding: 2px 0;
    margin-right: 2px;
    border-radius: 2px;
    font-size: 0.563rem;
}
.accountSetting .account_unit .account_content .tag.green {
    background-color: #f4fcf6;
    color: #2ac04b;
}
.accountSetting .account_unit .account_content .tag.red {
    background-color: #fff6f6;
    color: #fd5050;
}
.accountSetting .account_unit .account_header {
    width: 30%;
    font-weight: 400;
    color: #a0a0a0;
    font-size: 0.75rem;
}
.accountSetting .account_unit.merge .flex {
    justify-content: flex-start;
    border-right: 1px solid #e7ebef;
}

@media (max-width: 300px) {
    .accountSetting .account_unit.merge {
        padding: 1rem 0.5rem;
    }
}

@media (max-width: 330px) {
    .accountSetting .account_unit > div.flex {
        width: 170px;
    }
}

/* 230203 토마토 소개페이지(토마토,포인트,페이)탭으로 취합 - 이승미 */
.intro .all_info .topArea {
    padding: 0;
    background: #fff;
}
.intro .all_info .topArea .box_tab {
    padding: 0 4.26%;
}
.intro .all_info .topArea .box_tab li.active::after {
    bottom: 0;
}
.intro .all_info .topArea .box_tab > li > a {
    width: 100%;
    padding: 20px 0;
}
.intro .all_info .imgWrap .tomato_pay_apply {
    position: relative;
}
.intro .all_info .imgWrap .tomato_pay_apply .buttonArea {
    position: absolute;
    top: unset;
    bottom: 2rem;
    padding: 0 1rem;
}

/* 20230315 마트정보 화면 리뉴얼 - 이승미*/
.list_mart.detail .martInfoWrap .intro.close p {
    /*매장 설명 접혀있을 때 말줄임 처리*/
    display: -webkit-box;
    -webkit-line-clamp: 2;
    overflow: hidden;
    white-space: normal !important;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    word-wrap: break-word;
    padding-bottom: 0;
}
.list_mart.detail .martInfoWrap .info_wrap {
    background: #ffffff;
    margin-bottom: 5px;
    padding-bottom: 0.5rem;
}
.list_mart.detail .martInfoWrap .info_wrap .info_title {
    padding: 1.5rem 1rem .5rem;
    /* border-bottom: 1px solid #e7ebef; */
}
.list_mart.detail .martInfoWrap .info_wrap .info_title strong{
    font-weight: 600;
}
.list_mart.detail .martInfoWrap .info_wrap .info_content {
    padding: 1rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
.list_mart.detail .martInfoWrap .info_wrap .info_content .info_obj {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 0.25rem 0;
    font-size: 0.938rem;
}
.list_mart.detail .martInfoWrap .info_wrap .info_content .info_obj #map2{
    display: block;
    width: 100%;
    height: 240px;
}
.list_mart.detail
    .martInfoWrap
    .info_wrap
    .info_content
    .info_obj
    .info_obj_title {
    width: 116px;
    font-weight: 400;
    flex-shrink: 0;
}
.list_mart.detail
    .martInfoWrap
    .info_wrap
    .info_content
    .info_obj
    .info_obj_content,
.list_mart.detail
    .martInfoWrap
    .info_wrap
    .info_content
    .info_obj.delivery_price
    .box_txt
    p {
    flex: 1;
    font-weight: 400;
    color: #555555;
    max-width: calc(100% - 116px - 1rem);
}
.list_mart.detail
    .martInfoWrap
    .info_wrap
    .info_content
    .info_obj
    .info_obj_content#martAddress{
        line-height: 1.3;
    }
.list_mart.detail
    .martInfoWrap
    .info_wrap
    .info_content
    .info_obj.delivery_price {
    flex-direction: column;
    gap: 0;
}
.list_mart.detail
    .martInfoWrap
    .info_wrap
    .info_content
    .info_obj.delivery_price
    .info_obj_content {
    margin-top: 0.5rem;
    font-size: 0.813rem;
    color: #999999;
}
.list_mart.detail
    .martInfoWrap
    .info_wrap
    .info_content
    .info_obj.delivery_price
    .box_txt {
    flex: 1;
    width: 100%;
    margin-top: 0.75rem;
    padding: 1rem;
    background: #f4f4f4;
    border-radius: 10px;
}

/* 230516 쿠폰 사용 완료 ui 추가*/
.badge-coupon {
    display: none;
    position: absolute;
    top: 8px;
    right: 8px;
    width: 48px;
    height: 48px;
    line-height: 14px;
    padding: 9px 10px;
    border-radius: 48px;
    font-weight: 700;
    font-size: 0.75rem;
    color: #fff;
}
.badge-coupon.used {
    background-color: #a3a3a3;
}
.badge-coupon.overdate {
    background-color: #333;
}
.coupon-itself.used img,
.coupon-itself.overdate img {
    filter: invert(75%) sepia(0%) saturate(0%) hue-rotate(215deg)
        brightness(110%) contrast(97%);
}
.coupon-itself.used .badge-coupon.used,
.coupon-itself.overdate .badge-coupon.overdate {
    display: block;
}
.coupon-itself .tag_fill.gray {
    border: none;
}