.prem__ask--layout{display: flex; flex-direction: column; gap: 30px;}
.prem__ask--layout .ask__more{align-self: center;}
.prem__ask--list{display: flex; flex-wrap: wrap; gap: 20px;}
.prem__ask--list .ask__item{display: flex; flex-direction: column; gap: 12px; width: 212px; border-radius: 12px; overflow: hidden; border: 1px solid var(--gray-30); padding: 20px;}
.prem__ask--list .ask__item .item__thumb{border-radius: 8px; overflow: hidden; width: 172px; height: 124px; aspect-ratio: 172 / 124;}
.prem__ask--list .ask__item .item__thumb img{width: 100%; height: 100%; object-fit: cover; border-radius: 8px;}
.prem__ask--list .ask__item .item__info{display: flex; flex-direction: column; gap: 8px;}
.prem__ask--list .ask__item .item__info .info__tag{display: flex; gap: 6px;}
.prem__ask--list .ask__item .item__info .info__ct p{margin-top: 2px;}
.prem__ask--list .ask__item .item__info .info__tag > span:first-child{max-width: 95px;}
.prem__ask--list .ask__item .item__info .info__tag > span{background: #F6F6F9; color: #5C6675; font-size: 13px; padding: 0 6px; line-height: 27px; height: 27px; border-radius: 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.prem__ask--list .ask__item input[type=radio]{display: none;}
.prem__ask--list.panel__list{display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px;}
.prem__ask--list.panel__list .ask__item:has(input:checked){border-color: #6101D9;}
.prem__ask--list.panel__list .ask__item{flex-direction: row; width: 100%; gap: 16px;}
.prem__ask--list.panel__list .ask__item .item__thumb{flex-shrink: 0; width: 60px; height: 60px; border-radius: 50px;}
.prem__ask--list.panel__list .ask__item .item__info{flex: 1; padding-top: 4px; gap: 6px;}
.prem__ask--list.panel__list .ask__item .item__info .info__ct p{margin-top: 4px;}
.prem__ask--list.mypage__list{}

/* 멘토 프로필 모달 — cnModal(.mento_modal) + .prem__modal, premium에 없는 보정만 */
.mento_modal.prem__modal a:hover,
.mento_modal.prem__modal a:focus{text-decoration: none;}

.mento_modal.prem__modal .cn-modal-main{background: var(--gray-0, #fff); border-radius: var(--border-radius-l, 12px); width: 600px; overflow: visible;}
.mento_modal.prem__modal .modal_content.prem__modal__inner{position: relative; text-align: left;}
.mento_modal.prem__modal .prem__modal__close{position: absolute; top: 0; right: 0; width: 60px; height: 60px; display: flex; align-items: center; justify-content: center; z-index: 2;}
.mento_modal.prem__modal .prem__modal__close .ico_close::after{background-color: var(--gray-60, #7E8B9A);}

.mento_modal.prem__modal .prem__modal__hero{display: flex; flex-direction: row; align-items: center; margin-bottom: 0; padding-right: 36px;}
.mento_modal.prem__modal .prem__modal__avatar-wrap{flex-shrink: 0;}
.mento_modal.prem__modal .prem__modal__avatar{width: 120px; height: 120px; border-radius: 1000px; overflow: hidden; background: #DBD2FC; display: flex; align-items: center; justify-content: center;}
.mento_modal.prem__modal .prem__modal__avatar img{width: 100%; height: 100%; object-fit: cover;}

.mento_modal.prem__modal .prem__modal__intro{display: flex; flex-direction: column; min-width: 0; flex: 1;}
.mento_modal.prem__modal .prem__modal__badge{display: inline-block; width: fit-content;}
.mento_modal.prem__modal .prem__modal__name{display: block;}
.mento_modal.prem__modal .prem__modal__quote{margin: 0; line-height: 22px;}

.mento_modal.prem__modal .prem__modal__section{margin-bottom: 0;}
.mento_modal.prem__modal .prem__modal__section-title{margin: 0;}

.mento_modal.prem__modal .prem__modal__row{display: flex; flex-direction: row; align-items: center; justify-content: space-between; gap: 8px; min-height: 22px;}
.mento_modal.prem__modal .prem__modal__label{flex: 0 0 110px;}
.mento_modal.prem__modal .prem__modal__value{flex: 1; text-align: right; line-height: 22px;}

.mento_modal.prem__modal .prem__modal__score-wrap{background: var(--gray-0, #fff);}
.mento_modal.prem__modal .prem__modal__score-head,
.mento_modal.prem__modal .prem__modal__score-body{display: flex; flex-direction: row;}
.mento_modal.prem__modal .prem__modal__cell{flex: 1 1 0; min-width: 0; display: flex; align-items: center; justify-content: center; text-align: center; min-height: 40px; padding: 10px 8px; box-sizing: border-box; border-right: 1px solid var(--gray-30, #E0E3EB); border-bottom: 1px solid var(--gray-30, #E0E3EB); line-height: 22px;}
.mento_modal.prem__modal .prem__modal__cell:last-child{border-right: 0;}
.mento_modal.prem__modal .prem__modal__score-head .prem__modal__cell{border-bottom: 1px solid var(--gray-30, #E0E3EB);}
.mento_modal.prem__modal .prem__modal__score-body .prem__modal__cell{border-bottom: 0; background: var(--gray-0, #fff);}
.mento_modal.prem__modal .prem__modal__cell--head{font-family: var(--font-pr), 'Pretendard', sans-serif; font-size: 13px; font-weight: 600; line-height: 18px; letter-spacing: -0.26px;}

.mento_modal.prem__modal .prem__modal__actions{display: flex; justify-content: center; align-items: center;}
.mento_modal.prem__modal .prem__modal__cta.prem__btn--box{width: 180px; max-width: 100%;}

.prem__qna--list .ask__btn{height: 38px;}
.mento__panel{background: var(--prem-background); border-radius: 12px;}
.mento__panel .panel__tit{display: flex; justify-content: space-between; align-items: center;}
.mento__panel .panel__layout{display: flex; gap: 24px; height: 522px;}
.mento__panel .panel__layout > div{background: #fff; border-radius: 12px;}
.mento__panel .panel__layout .panel__side{flex-shrink: 0; width: 332px; box-shadow: 0 4px 6px 0 rgba(0, 0, 0, 0.08); position: relative; overflow: hidden; padding: 2px; border-radius: 12px; padding: 24px;}
.mento__panel .panel__layout .panel__side.highlight{padding: 2px;}
.mento__panel .panel__layout .panel__side.highlight::before{content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(180deg, #6101D9 0%, #C800FF 100%); box-sizing: border-box;}
.mento__panel .panel__layout .panel__side.highlight > div{padding: 24px; position: relative; background: #fff; border-radius: 9px; height: 100%;}
.mento__panel .panel__layout .panel__side.disabled::after{content: "아직 멘토를 선택하지 않았어요.\A우측에서 멘토를 선택해보세요!"; display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; font-size: 16px; font-weight: 600; line-height: 150%; position: absolute; top: 0; left: 0; background: rgba(255, 255, 255, 0.20); backdrop-filter: blur(10px); white-space: pre-line;}
.mento__panel .panel__layout .panel__side .mento__avatar{display: flex; justify-content: center;}
.mento__panel .panel__layout .panel__side .mento__avatar .avatar{width: 130px; height: 130px; aspect-ratio: 1 / 1; position: relative; border-radius: 999px;}
.mento__panel .panel__layout .panel__side .mento__avatar .avatar i{width: 30px; height: 30px; border: 2px solid #fff; border-radius: 999px; background: #5C6675; position: absolute; right: 2px; bottom: 2px;}
.mento__panel .panel__layout .panel__side .mento__avatar .avatar i::after{width: 17px; height: 17px; background: #fff;;}
.mento__panel .panel__layout .panel__side .mento__avatar .avatar img{width: 100%; height: 100%; object-fit: cover; border-radius: 999px;}
.mento__panel .panel__layout .panel__side .mento__info{text-align: center; margin: 16px 0 20px;}
.mento__panel .panel__layout .panel__side .mento__info .info__label{display: flex; justify-content: center; align-items: center; gap: 4px;}
.mento__panel .panel__layout .panel__side .mento__info .info__label i{display: flex; width: 20px; height: 20px; border-radius: 100px; background: linear-gradient(180deg, #6101D9 0%, #C800FF 100%);}
.mento__panel .panel__layout .panel__side .mento__info strong{display: block; margin: 2px 0 6px;}
.mento__panel .panel__layout .panel__side .mento__info p{height: 38px;}
.mento__panel .panel__layout .panel__side .mento__tab .info__list > li{height: 22px; display: flex; align-items: center; justify-content: space-between;}
.mento__panel .panel__layout .panel__side .side__grade{display: flex; flex-wrap: wrap; gap: 0 20px; padding: 10px 20px;}
.mento__panel .panel__layout .panel__side .side__grade > div{display: flex; justify-content: space-between; align-items: center; gap: 4px; width: 112px; height: 42px;}
.mento__panel .panel__layout .panel__side .side__grade > div:not(:nth-last-child(-n+2)){border-bottom: 1px solid rgba(0, 0, 0, 0.04);}
.mento__panel .panel__layout .panel__side .side__grade > div > p{flex: 0 auto; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.mento__panel .panel__layout .panel__side .side__grade > div > span{flex-shrink: 0;}
.mento__panel .panel__layout .panel__main{flex: 1; display: flex; flex-direction: column; overflow: hidden;}
.mento__panel .panel__layout .panel__main .mento__filter{flex-shrink: 0; display: flex; flex-direction: column; gap: 20px; padding: 24px 24px 16px 24px;}
.mento__panel .panel__layout .panel__main .mento__filter .filter__layout{display: flex; align-items: center; gap: 8px;}
.mento__panel .panel__layout .panel__main .mento__filter .filter__layout .prem__select--box{width: 140px;}
.mento__panel .panel__layout .panel__main .mento__list{flex: 1; padding: 0 24px 24px 24px; overflow: auto;}
.mento__panel.mypage__panel{background: #fff; padding-bottom: 80px;}
.mento__panel.mypage__panel .panel__layout{gap: 30px; height: 460px;}
.mento__panel.mypage__panel .panel__layout .panel__side{width: 360px;}
.mento__panel.mypage__panel .panel__layout .panel__main{padding: 30px; background: var(--prem-background); display: flex; flex-direction: column; gap: 20px;}
.mento__panel.mypage__panel .panel__layout .panel__main .mento__rank{overflow: auto; background: #FAFAFC; border-radius: 12px; overflow: hidden;}
.mento__panel.mypage__panel .panel__layout .panel__main .mento__rank .rank__scroll{overflow: auto; height: 100%;}
.mento__panel.mypage__panel .panel__layout .panel__main .mento__rank .rank__item.my__item{background: #fff; border-radius: 12px; box-shadow: 0 4px 6px 0 rgba(0, 0, 0, 0.08); position: sticky; top: 0;}
.mento__panel.mypage__panel .panel__layout .panel__main .mento__rank .rank__item{display: flex; align-items: center; padding: 0 20px; height: 78px; gap: 16px;}
.mento__panel.mypage__panel .panel__layout .panel__main .mento__rank .rank__item > div{display: flex; align-items: center; gap: 16px; width: 100%; height: 100%;}
.mento__panel.mypage__panel .panel__layout .panel__main .mento__rank .rank__item + .rank__item > div{border-top: 1px solid var(--gray-20)}
.mento__panel.mypage__panel .panel__layout .panel__main .mento__rank .rank__item .item__thumb{width: 50px; height: 50px; aspect-ratio: 1 / 1; overflow: hidden; border-radius: 50px;}
.mento__panel.mypage__panel .panel__layout .panel__main .mento__rank .rank__item .item__thumb img{width: 100%; height: 100%; object-fit: cover;}
.mento__panel.mypage__panel .panel__layout .panel__main .mento__rank .rank__item .item__info{display: flex; align-items: center; justify-content: space-between; flex: 1;}
.mento__panel.mypage__panel .panel__layout .panel__main .mento__rank .rank__item .item__info > p{display: flex; align-items: center; gap: 4px; line-height: normal;}
.mento__panel.mypage__panel .panel__layout .panel__main .mento__rank .rank__item .item__info > p > span{display: inline-flex; align-items: center; background: #121212; color: #fff; height: 18px; padding: 0 4px; font-size: 11px; font-weight: 600; border-radius: 4px;}
.mento__panel.mypage__panel .panel__layout .panel__main .mento__rank .rank__item .item__num{display: flex; justify-content: center; align-items: center; width: 34px; height: 34px;}
.mento__panel.mypage__panel .panel__layout .panel__main .mento__rank .rank__item.rank1 .item__num{background: url('https://un-static.conects.com/premium/ask/pc/icon_rank1.png') no-repeat center top / auto 100%; font-size: 0;}
.mento__panel.mypage__panel .panel__layout .panel__main .mento__rank .rank__item.rank2 .item__num{background: url('https://un-static.conects.com/premium/ask/pc/icon_rank2.png') no-repeat center top / auto 100%; font-size: 0;}
.mento__panel.mypage__panel .panel__layout .panel__main .mento__rank .rank__item.rank3 .item__num{background: url('https://un-static.conects.com/premium/ask/pc/icon_rank3.png') no-repeat center top / auto 100%; font-size: 0;}

.prem__point{background:#F6F6F9; padding: 50px 0;}
.prem__point .point__mission{display: flex; gap: 20px;}
.prem__point .point__mission .mission__item{display: flex; flex-direction: column; gap: 20px; color: #fff; border-radius: 12px; background: linear-gradient(180deg, var(--Brand-primary, #6101D9) 0%, var(--Brand-secondary, #C800FF) 100%); box-shadow: 0 8px 12px 0 rgba(97, 1, 217, 0.24); padding: 30px; flex: 1; max-width: 367px;}
.prem__point .point__mission .mission__item .mission__tit{display: flex; align-items: center; gap: 4px;}
.prem__point .point__mission .mission__item .mission__tit > span{align-self: flex-end; padding-bottom: 5px; opacity: .7;}
.prem__point .point__mission .mission__item .mission__tip{display: flex; align-items: center; gap: 6px; border-radius: var(--Radius-medium, 8px); background: rgba(255, 255, 255, 0.20); padding: 12px;}
.prem__point .point__mission .mission__item .mission__tip > span{border: 1px solid #fff; border-radius: 4px; height: 21px; line-height: 21px; padding: 0 5px;}
.prem__point .point__mission .mission__item .mission__tip > p{font-size: 14px; font-weight: 500;}
.prem__point .point__banner{display: flex; justify-content: center; align-items: center; gap: 8px; background: #121212 url('https://un-static.conects.com/premium/ask/pc/mission_banner.jpg') no-repeat center top; border-radius: 12px; height: 76px;}
.prem__point .point__banner > strong{display: flex; justify-content: center; align-items: center; gap: 4px;}
.prem__point .point__banner > strong > i{width: 20px; height: 20px;}
.ask__area{padding: 80px 0;}
.ask__banner--cta{border-radius: 12px; overflow: hidden;}
.ask__banner__lead{display: flex; flex-direction: column; align-items: flex-start; gap: 12px; flex: 1 1 auto; min-width: 0;}
.ask__banner__tit{display: block; margin: 0; font-family: var(--font-pr), 'Pretendard', sans-serif; font-size: 18px; font-weight: 700; line-height: 26px; letter-spacing: -0.18px; color: #fff;}
a.ask__banner__pill{display: inline-flex; align-items: center; justify-content: center; height: 40px; padding: 0 24px; border-radius: 20px; background: #fff; box-sizing: border-box; font-family: var(--font-pr), 'Pretendard', sans-serif; font-size: 14px; font-weight: 600; line-height: 20px; letter-spacing: -0.14px; color: #121212; text-decoration: none;}
a.ask__banner__pill:hover, a.ask__banner__pill:focus{text-decoration: none; color: #121212;}
.ask__banner__opts{display: flex; flex-shrink: 0; align-items: stretch; gap: 12px; flex-wrap: nowrap;}
.ask__banner__item{position: relative; display: flex; align-items: center; gap: 12px; width: 180px; box-sizing: border-box; padding: 0 0 0 16px; border-radius: 12px; background: rgba(246, 240, 255, 0.1); border: 1px solid transparent; cursor: pointer; height: 80px;}
.ask__banner__item input.ask__banner__chk{position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;}
.ask__banner__item:has(.ask__banner__chk:checked){border-color: #e0e3eb;}
.ask__banner__ico{width: 20px !important; height: 20px !important;}
.ask__banner__ico.on{display: none;}
.ask__banner__ico::after{background: #A4B1C1;}
.ask__banner__item:has(.ask__banner__chk:checked) .ask__banner__ico.on{display: inline-flex;}
.ask__banner__item:has(.ask__banner__chk:checked) .ask__banner__ico.off{display: none;}
.ask__banner__item:has(.ask__banner__chk:checked) .ask__banner__ico::after{background: #fff;}
.ask__banner__txt{font-family: var(--font-pr), 'Pretendard', sans-serif; font-size: 14px; font-weight: 600; line-height: 20px; letter-spacing: -0.14px; color: #fff;}
.ask__banner__item:not(:has(.ask__banner__chk:checked)) .ask__banner__txt{opacity: 0.92;}

/* 멘토 프로필 모달 — cnModal(.mento_modal) + .prem__modal, Figma 프로필 등록 폼 / premium에 없는 BEM만 */
.mento__modal--form.prem__modal a:hover,
.mento__modal--form.prem__modal a:focus{text-decoration: none;}

.mento__modal--form.prem__modal .cn-modal-main{background: var(--gray-0, #fff); border-radius: var(--border-radius-l, 12px); width: 600px; max-width: calc(100vw - 40px); overflow: visible;}
.mento__modal--form.prem__modal .modal_content.prem__modal__inner{position: relative; text-align: left; overflow: visible;}
.mento__modal--form.prem__modal .prem__modal__inner.prem__layout--column{justify-content: flex-start;}
.mento__modal--form.prem__modal .prem__modal__close{position: absolute; top: 0; right: 0; width: 60px; height: 60px; display: flex; align-items: center; justify-content: center; z-index: 2;}
.mento__modal--form.prem__modal .prem__modal__close .ico_close::after{background-color: var(--gray-60, #7E8B9A);}

.mento__modal--form.prem__modal .prem__modal__profile{display: flex; justify-content: center; width: 100%;}
.mento__modal--form.prem__modal .prem__modal__avatar-wrap--profile{position: relative; display: inline-flex; justify-content: center;}
.mento__modal--form.prem__modal .prem__modal__avatar{width: 120px; height: 120px; border-radius: 1000px; overflow: hidden; background: #dbd2fd; display: flex; align-items: center; justify-content: center;}
.mento__modal--form.prem__modal .prem__modal__avatar input{display: none;}
.mento__modal--form.prem__modal .prem__modal__avatar img{width: 100%; height: 100%; object-fit: cover;}

.mento__modal--form.prem__modal .prem__modal__avatar-edit{position: absolute; right: 0; bottom: 0; width: 30px; height: 30px; padding: 0; margin: 0; border: 1.6px solid var(--gray-0, #fff); border-radius: 25.7px; background: var(--gray-70, #5c6675); cursor: pointer; display: flex; align-items: center; justify-content: center; box-sizing: border-box;}
.mento__modal--form.prem__modal .prem__modal__avatar-edit i{width: 18px; height: 18px;}
.mento__modal--form.prem__modal .prem__modal__avatar-edit i::after{background: #fff;}

.mento__modal--form.prem__modal .prem__modal__form{margin-bottom: 0;}
.mento__modal--form.prem__modal .prem__modal__block{margin-bottom: 0;}
.mento__modal--form.prem__modal .prem__modal__block-title{margin: 0; font-weight: 700;}

.mento__modal--form.prem__modal .prem__modal__field-row{display: flex; flex-direction: row; align-items: stretch; width: 100%; flex-wrap: nowrap;}
.mento__modal--form.prem__modal .prem__modal__field-row--3 > .prem__modal__field{flex: 1 1 0; min-width: 0;}

.mento__modal--form.prem__modal .prem__modal__card{border: 1px solid var(--gray-20, #ededf3); border-radius: var(--border-radius-l, 12px); background: var(--gray-0, #fff); box-sizing: border-box; overflow: visible;}

.mento__modal--form.prem__modal .prem__modal__field-title{display: block;}
.mento__modal--form.prem__modal .prem__modal__field-sublabel{display: block;}
.mento__modal--form.prem__modal .prem__modal__field [style*="display: block"]{width: 100%;}
.mento__modal--form.prem__modal .prem__modal__field [class*=prem__select--box]{width: 100%; box-sizing: border-box;}
.mento__modal--form.prem__modal .prem__modal__field [class*=prem__select--box] .select{white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width: 100%; display: inline-block; height: 44px; line-height: 44px; vertical-align: top;}
.mento__modal--form.prem__modal .prem__modal__field [class*=prem__dropdown--menu]{min-width: 100%; box-sizing: border-box;}
.mento__modal--form.prem__modal .prem__modal__field .prem__ico--arrow_down_s{width: 12px; height: 24px;}
.mento__modal--form.prem__modal .prem__modal__field .prem__ico--arrow_down_s::after{background: var(--text-secondary);}

.mento__modal--form.prem__modal .prem__modal__field--mentor input.prem__input--text{border-color: var(--prem-primary, #6101d9) !important;}
.mento__modal--form.prem__modal .prem__modal__field--mentor input.prem__input--text:focus{border-color: var(--prem-primary, #6101d9) !important;}

.mento__modal--form.prem__modal .prem__modal__input--readonly,
.mento__modal--form.prem__modal input.prem__modal__input--readonly{background: var(--gray-10, #f6f6f9) !important; color: var(--gray-50, #a4b1c1) !important; cursor: default;}
.mento__modal--form.prem__modal .prem__modal__field input.prem__input--text{height: 48px; box-sizing: border-box;}

.mento__modal--form.prem__modal .prem__modal__actions{display: flex; justify-content: center; align-items: center;}
.mento__modal--form.prem__modal .prem__modal__cta.prem__btn--box{width: 180px; max-width: 100%;}

/* 모달 단독 퍼블 시 premium 유틸 미포함 대비 */
.mento__modal--form.prem__modal .gap-12{gap: 12px !important;}
.mento__modal--form.prem__modal .gap-16{gap: 16px !important;}
.mento__modal--form.prem__modal .gap-20{gap: 20px !important;}
.mento__modal--form.prem__modal .gap-24{gap: 24px !important;}
.mento__modal--form.prem__modal .px-20{padding-left: 20px !important; padding-right: 20px !important;}
.mento__modal--form.prem__modal .py-24{padding-top: 24px !important; padding-bottom: 24px !important;}
.mento__modal--form.prem__modal .px-32{padding-left: 32px !important; padding-right: 32px !important;}
.mento__modal--form.prem__modal .py-40{padding-top: 40px !important; padding-bottom: 40px !important;}
.mento__modal--form.prem__modal .px-12{padding-left: 12px !important; padding-right: 12px !important;}

.prem__dropdown--menu.mento_dd_type{width: auto !important;}

/* 멘토 마일리지 · 쿠폰 — coupon.html */
.coupon-page .prem__contents{padding-bottom: 80px;}

.coupon__tab .prem__paging{margin-top: 12px;}
.mile__summary{border: 2px solid var(--prem-primary, #6101d9); background: var(--gray-0, #fff); overflow: visible;}
.mile__summary__inner{display: flex; flex-direction: row; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: nowrap;}
.mile__summary__main{display: flex; flex-direction: column; gap: 12px; flex: 1 1 auto; min-width: 0;}
.mile__summary__label{margin: 0;}
.mile__summary__point{display: flex; flex-direction: row; align-items: center; gap: 4px;}
.mile__summary__num{font-family: var(--font-pr), sans-serif; font-size: 36px; font-weight: 700; line-height: 1; letter-spacing: -0.72px; color: var(--text-primary, #121212);}
.mile__summary__ico{display: inline-flex; width: 28px; height: 28px; align-items: center; justify-content: center;}
.mile__summary__ico .prem__ico--mileage{width: 28px; height: 28px;}

.mile__summary__stats{display: flex; flex: 1 1 50%; max-width: 540px; align-items: stretch; background: var(--gray-10, #f6f6f9); border-radius: var(--border-radius-l, 12px); padding: 20px; box-sizing: border-box;}
.mile__stat{display: flex; flex-direction: column; gap: 4px; flex: 1 1 0; min-width: 0; padding: 0 16px; border-right: 1px solid var(--gray-20, #ededf3);}
.mile__stat:first-child{padding-left: 0;}
.mile__stat:last-child{padding-right: 0; border-right: 0;}
.mile__stat__label{display: block;}
.mile__stat__value{display: block; margin: 0;}

.mile__banner{display: flex; flex-direction: row; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; background: var(--prem-background, #f6f0ff); border-radius: var(--border-radius-l, 12px); padding: 14px 20px; box-sizing: border-box;}
.mile__banner__txt{margin: 0;}
.mile__banner__accent{color: var(--prem-primary, #6101d9);}
.mile__banner__link{display: inline-flex; align-items: center; gap: 5px; text-decoration: none; white-space: nowrap;}
.mile__banner__link:hover{text-decoration: none;}
.mile__banner__link .prem__ico--arrow_right_s{width: 12px; height: 24px;}
.mile__banner__link .prem__ico--arrow_right_s::after{background: var(--text-secondary);}

.coupon__toolbar{width: 100%;}
.coupon__toolbar .coupon__count{display: flex; flex-direction: row; align-items: center; gap: 6px; margin: 0;}
.coupon__toolbar .coupon__filter{margin-left: auto;}

.coupon__grid{display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; width: 100%;}
.coupon__card{border: 1px solid var(--gray-30, #e0e3eb); border-radius: var(--border-radius-l, 12px); background: var(--gray-0, #fff); padding: 20px; box-sizing: border-box;}
.coupon__card__body{display: flex; flex-direction: row; align-items: center; gap: 16px;}
.coupon__card__thumb{flex-shrink: 0; width: 110px; height: 110px; border-radius: 5.5px; background: var(--gray-10, #f6f6f9); overflow: hidden; aspect-ratio: 1 / 1;}
.coupon__card__thumb img{width: 100%; height: 100%; object-fit: cover;}
.coupon__card__info{display: flex; flex-direction: column; gap: 8px; flex: 1 1 auto; min-width: 0;}
.coupon__card__tags{display: flex; flex-direction: row; flex-wrap: wrap; gap: 4px;}
.coupon__tag{display: inline-flex; align-items: center; justify-content: center; padding: 2px 6px; border-radius: var(--border-radius-s, 4px); background: #F6F6F9;}
.coupon__card__name{margin: 0;}
.coupon__card__price{margin: 0;}

.coupon__card--used{display: flex; flex-direction: column; gap: 0; padding: 20px;}
.coupon__card--used .coupon__card__body{padding-bottom: 0;}
.coupon__card__thumb--dim{position: relative;}
.coupon__card__thumb--dim::before{content: ""; position: absolute; inset: 0; background: rgba(0, 0, 0, 0.35); border-radius: inherit; z-index: 1;}
.coupon__card__badge{position: absolute; inset: 0; z-index: 2; display: flex; align-items: center; justify-content: center; font-size: 16px; font-weight: 600; line-height: 24px; letter-spacing: -0.16px; color: var(--gray-0, #fff);}
.coupon__card__foot{margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--gray-20, #ededf3);}
.coupon__card__foot .coupon__card__date{margin: 0;}
.coupon__card__btn{width: auto !important; min-width: 77px; flex-shrink: 0;}

.coupon__sort{position: relative;}
.coupon__sort .prem__dropdown--btn{display: inline-flex;}

.mile__history{border-radius: var(--border-radius-l, 12px);}
.mile__history__row{display: grid; grid-template-columns: 90px 90px minmax(0, 1fr) auto; align-items: center; min-height: 80px; column-gap: 0; border-bottom: 1px solid var(--gray-20, #ededf3);}
.mile__history__row--last{border-bottom: 0;}
.mile__history__date{width: 90px;}
.mile__history__badge{display: inline-flex; align-items: center; justify-content: center; padding: 2px 6px; border-radius: var(--border-radius-s, 4px); width: fit-content; justify-self: center;}
.mile__history__badge--earn{background: var(--prem-background, #f6f0ff); color: var(--prem-primary, #6101d9);}
.mile__history__badge--deduct{background: var(--gray-10, #f6f6f9);}
.mile__history__desc{padding-left: 20px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.mile__history__amount{display: inline-flex; flex-direction: row; align-items: center; gap: 8px; justify-content: flex-end; padding-right: 20px; white-space: nowrap;}
.mile__history__earn,
.mile__history__deduct{margin: 0;}
.mile__history__balance{margin: 0;}

.mile__page-info{background: var(--gray-10, #f6f6f9); border-radius: var(--border-radius-l, 12px); padding: 24px 20px; box-sizing: border-box;}
.mile__page-info__head{display: flex; flex-direction: row; align-items: center; gap: 4px; margin-bottom: 12px;}
.mile__page-info__head > i{width: 20px; height: 20px; flex-shrink: 0;}
.mile__page-info__head > i::after{background: var(--text-secondary);}
.mile__page-info__title{margin: 0;}
.mile__page-info__body{margin: 0;}
.mile__page-info__list{margin: 0; padding-left: 22px; list-style: disc;}
.mile__page-info__list li{margin: 0 0 4px;}
.mile__page-info__list li:last-child{margin-bottom: 0;}
.mile__page-info__note{margin: 8px 0 12px; padding-left: 8px; color: var(--text-primary, #121212);}

/* 쿠폰 교환 확인 모달 (cnModal + prem__modal) */
.coupon-page a.coupon__card{display: block; text-decoration: none; color: inherit; cursor: pointer; box-sizing: border-box;}
.coupon-page a.coupon__card:hover{text-decoration: none; color: inherit;}

.coupon__exchange-modal.prem__modal .gap-30{gap: 30px !important;}
.coupon__exchange-modal.prem__modal .gap-16{gap: 16px !important;}
.coupon__exchange-modal.prem__modal .gap-8{gap: 8px !important;}
.coupon__exchange-modal.prem__modal .px-32{padding-left: 32px !important; padding-right: 32px !important;}
.coupon__exchange-modal.prem__modal .py-40{padding-top: 40px !important; padding-bottom: 40px !important;}
.coupon__exchange-modal.prem__modal .prem__modal__actions{display: flex; justify-content: center; align-items: center;}
.coupon__exchange-modal.prem__modal .prem__modal__actions a{min-width: 180px;}

.coupon__modal__hero{display: flex; flex-direction: row; align-items: center; gap: 16px; width: 100%;}
.coupon__modal__thumb{flex-shrink: 0; width: 110px; height: 110px; border-radius: var(--border-radius-m, 8px); background: var(--gray-10, #f6f6f9); overflow: hidden;}
.coupon__modal__thumb img{width: 100%; height: 100%; object-fit: cover; display: block;}
.coupon__modal__info{flex: 1 1 auto; min-width: 0;}

.coupon__modal__mile{display: flex; flex-direction: column; gap: 0; width: 100%; padding: 12px 24px; box-sizing: border-box;}
.coupon__modal__mile-row{box-sizing: border-box;}
.coupon__modal__mile-row.result__mile{height: 50px;}
.coupon__modal__divider{height: 1px; background: var(--gray-20, #ededf3); margin: 0;}
.coupon__modal__notice{margin: 0;}

.coupon__card__btn--action{cursor: pointer; display: inline-flex; align-items: center; justify-content: center;}