.coupon-header { margin-left: 48px; margin-bottom: 16px; font-size: 3.6rem; font-weight: 300; color: #424242; }

@media (max-width: 768px) { .coupon-header { display: none; } }

.coupon { margin: auto; max-width: 920px; }

.coupon .nav-tabs { border-bottom: 1px solid #e0e0e0; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: nowrap; flex-wrap: nowrap; width: 100%; }

@media (max-width: 768px) { .coupon .nav-tabs { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } }

.coupon__tab { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; min-width: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }

@media (max-width: 768px) { .coupon__tab { -webkit-box-flex: 0; -ms-flex: none; flex: none; min-width: auto; padding: 10px 4px !important; } }

@media (max-width: 768px) { .coupon__tab#everyone-tab { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; min-width: auto; } }

@media (max-width: 768px) { .coupon__tab#personal-tab { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; min-width: auto; } }

@media (max-width: 768px) { .coupon__tab#history-tab { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; min-width: auto; -webkit-box-align: end; -ms-flex-align: end; align-items: end; } }

@media (max-width: 768px) { .coupon__tab .title { display: none; } }

@media (max-width: 768px) { .coupon__tab.active { min-width: auto; -ms-flex-negative: 0; flex-shrink: 0; padding: 10px 8px !important; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 4px; } }

@media (max-width: 768px) { .coupon__tab.active .title { display: inline-block; white-space: nowrap; font-size: 1.4rem; line-height: 1.2; margin: 0; } }

@media (max-width: 480px) { .coupon__tab.active .title { font-size: 1.3rem; } }

.coupon__tab:not(.active) { font-weight: 300; color: #757575; }

@media (max-width: 768px) { .coupon__tab:not(.active) { min-width: auto; -ms-flex-negative: 0; flex-shrink: 0; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 10px 2px !important; } }

.coupon__tab .svg-icon { width: 20px; height: 20px; -ms-flex-negative: 0; flex-shrink: 0; }

@media (max-width: 768px) { .coupon__tab .svg-icon.active { margin-right: 0; } }

.coupon__summary { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 16px; margin: 25px 0; background-color: #eef7ff; border-radius: 6px; }

@media (max-width: 768px) { .coupon__summary { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } }

.coupon__summary .svg-icon { margin-right: 8px; min-width: 24px; min-height: 24px; fill: #1560c5; }

.coupon__summary ul { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }

.coupon__summary ul li { font-size: 1.4rem; font-weight: 300; line-height: 1.5; color: #212121; }

.coupon__summary ul li span { color: #ff6b00; }

.coupon__campaign .coupon-item { pointer-events: none; }

@media (max-width: 768px) { .coupon__campaign .coupon-item { pointer-events: auto; } }

.coupon__campaign .coupon-item__image { border-radius: 10px; pointer-events: auto; }

.coupon__campaign .coupon-item__body { word-wrap: break-word; word-break: break-word; }

@media (max-width: 768px) { .coupon__campaign .coupon-item__body { gap: 0; } }

@media (max-width: 768px) { .coupon__campaign .coupon-item__body .coupon-item__label { display: none; } }

@media (max-width: 768px) { .coupon__campaign .coupon-item__body .coupon-item__content p { display: none; } }

.coupon__personal .coupon-item__image { border-radius: 14px; }

@media (max-width: 992px) { .coupon__personal .coupon-item__image { max-width: 343px; width: auto; } }

.coupon__personal .coupon-item__date { margin: -20px auto 24px 0; font-weight: 300; }

@media (max-width: 992px) { .coupon__personal .coupon-item__date { margin-top: 0; } }

.coupon__personal .coupon-item .coupon-item__dropdown { display: none; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-transition: 0.3s linear; transition: 0.3s linear; cursor: pointer; }

.coupon__personal .coupon-item .coupon-item__dropdown .svg-icon { fill: #9e9e9e; margin-right: 0 !important; }

.coupon__personal .coupon-item .coupon-item__dropdown--up { -webkit-transform: rotate(180deg) !important; transform: rotate(180deg) !important; }

@media (max-width: 768px) { .coupon__personal .coupon-item .coupon-item__dropdown { display: -webkit-box; display: -ms-flexbox; display: flex; } }

.coupon__personal .coupon-item__type { padding: 4px; margin-bottom: 16px; max-width: 343px; background-color: #eef7ff; border-radius: 14px; text-align: center; font-size: 1.3rem; font-weight: 600; color: #0a2d88; }

.coupon__personal .coupon-item__body { width: 100%; }

@media (max-width: 768px) { .coupon__personal .coupon-item__body li + li .coupon-item__label { display: none; } }

@media (max-width: 768px) { .coupon__personal .coupon-item__body .coupon-item__content { display: none; } }

.coupon__list { border-bottom: 1px solid #e0e0e0; }

.coupon--empty { font-weight: 300; margin: 24px 0; }

@media (max-width: 768px) { .coupon--empty { margin-bottom: 16px; } }

.coupon__personal { margin-bottom: 48px; }

@media (max-width: 768px) { .coupon__personal { margin-bottom: 32px; } }

.coupon-item { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; padding: 25px 0; gap: 40px; border-top: 1px solid #e0e0e0; }

@media (max-width: 992px) { .coupon-item { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 18px; } }

@media (max-width: 992px) { .coupon-item > .position-relative { margin: auto; } }

.coupon-item__image { display: block; overflow: hidden; width: 343px; }

.coupon-item__image img { max-width: 100%; }

.coupon-item__info { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }

@media (max-width: 768px) { .coupon-item__info { width: 100%; } }

.coupon-item__category { display: -webkit-box; display: -ms-flexbox; display: flex; gap: 8px; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; margin-bottom: 8px; }

.coupon-item__category .label-tag--orange { color: #ff6b00; font-weight: 600; font-size: 1.2rem; border-color: #ffbe88; }

.coupon-item__category .label-tag--light { padding: 0; font-size: 1.4rem; }

.coupon-item__title { margin-bottom: 24px; line-height: 1.5; font-size: 2rem; font-weight: 600; color: #212121; word-break: break-all; }

@media (max-width: 768px) { .coupon-item__title { margin-bottom: 8px; font-size: 1.8rem; } }

.coupon-item__body { display: -webkit-box; display: -ms-flexbox; display: flex; gap: 16px; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; line-height: 1.5; color: #212121; }

.coupon-item__body .coupon-item__label { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-weight: 600; font-size: 1.6rem; margin-bottom: 8px; }

.coupon-item__body .coupon-item__label .svg-icon { margin-right: 8px; width: 24px; height: 24px; fill: #1560c5; }

.coupon-item__body .coupon-item__content { font-weight: 300; font-size: 1.4rem; word-break: break-all; }

.coupon-item__body .coupon-item__content ul { margin-left: 8px; list-style: disc inside; }

.coupon-item__body .coupon-item__button { width: 100%; max-width: 240px; margin-top: 16px; pointer-events: auto; }

@media (max-width: 768px) { .coupon-item__body .coupon-item__button { display: none; } }

.coupon-item--used { position: absolute; right: 0; top: 0; bottom: 0; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; gap: 6px; background-color: #f5f5f5; width: calc(100% - 246px); border: 0; border-radius: 0 14px 14px 0; -webkit-box-shadow: 1px 0 0.5px 0 #f5f5f5; box-shadow: 1px 0 0.5px 0 #f5f5f5; }

.coupon-item--used .svg-icon { fill: #757575; min-width: 28px; min-height: 28px; }

.coupon-item--used span { font-weight: 600; font-size: 1.5rem; color: #757575; }

.coupon-item--expired { position: absolute; right: 0; top: 0; bottom: 0; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; gap: 6px; background-color: #f5f5f5; width: calc(100% - 246px); border: 0; border-radius: 0 14px 14px 0; -webkit-box-shadow: 1px 0 0.5px 0 #f5f5f5; box-shadow: 1px 0 0.5px 0 #f5f5f5; }

.coupon-item--expired .svg-icon { fill: #757575; min-width: 28px; min-height: 28px; }

.coupon-item--expired span { font-weight: 600; font-size: 1.5rem; color: #757575; }

.coupon-item .disabled { pointer-events: none; opacity: 0.5; }

.suggest-app { background: #eef7ff; border-radius: 10px; padding: 24px 90px; }

@media (max-width: 768px) { .suggest-app { padding: 24px 20px; } }

.suggest-app__header { display: -webkit-box; display: -ms-flexbox; display: flex; gap: 16px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin: auto; max-width: 622px; }

.suggest-app__header img { width: 60px; height: 60px; }

@media (max-width: 768px) { .suggest-app__content { text-align: center; } }

.suggest-app__content p { font-weight: 600; font-size: 1.6rem; line-height: 1.5; color: #0a2d88; }

.suggest-app__content p span { color: #ff6b00; }

.suggest-app__body { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: space-evenly; -ms-flex-pack: space-evenly; justify-content: space-evenly; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-top: 16px; }

@media (max-width: 768px) { .suggest-app__body { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } }

.suggest-app__left { text-align: center; }

.suggest-app__left img + img { margin: 32px auto 16px; width: 60px; height: 60px; }

.suggest-app__right { display: -webkit-box; display: -ms-flexbox; display: flex; gap: 9px; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; width: 256px; }

.suggest-app__apple, .suggest-app__google { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100%; }

.suggest-app__apple img + img, .suggest-app__google img + img { margin-top: 12px; }

@media (max-width: 768px) { .suggest-app__apple img + img, .suggest-app__google img + img { display: none; } }

.suggest-app__google > img:first-child { height: 40px; }

#history-tab.active .svg-icon use { -webkit-filter: none; filter: none; }

#history-tab:not(.active) .svg-icon use { -webkit-filter: grayscale(1) brightness(1.4) sepia(0.2) saturate(2) hue-rotate(-30deg); filter: grayscale(1) brightness(1.4) sepia(0.2) saturate(2) hue-rotate(-30deg); }

.coupon__navigate-history { margin: 24px 0; text-align: center; }

@media (max-width: 768px) { .coupon__navigate-history { margin: 16px 0; } }

.coupon__history-link { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-size: 1.6rem; font-weight: 300; color: #1560c5; cursor: pointer; -webkit-transition: opacity 0.2s ease; transition: opacity 0.2s ease; }

.coupon__history-link:hover { opacity: 0.8; }

.coupon__history-link .svg-icon { margin-right: 8px; width: 24px; height: 24px; fill: #1560c5; }
