/* BASIC css start */
/* 공통 */
.pep-wrap { max-width:800px; margin:0 auto; color:#000; }
.pep-wrap * { box-sizing:border-box; }
.pep-wrap ul { margin:0; padding:0; list-style:none; }
.pep-wrap p { margin:0; }
.pep-wrap img { display:block; max-width:100%; }

/* 타이틀 이미지 */
.pep-hero { position:relative; overflow:hidden; padding:13% 0 11%; background: url(//xexymix.jpg3.kr/xexymix/sub/notice/kakaopay_bg.jpg) no-repeat center top; background-size: cover; text-align:center; }
.pep-logo { position:relative; margin-bottom:36px; }
.pep-logo img { margin:0 auto; max-width:423px; }
.pep-title { position:relative; }
.pep-title h2 { font-size:60px; font-weight: bold; line-height:80px; color:#000; margin: 80px 0 35px; }
.pep-title h2 br + br { display:none; }
.pep-date { display:inline-block; padding:10px 30px; background:#ffe600; color:#000; font-size:30px; font-weight:500; border-radius:50px; }

/* 혜택 카드 */
.pep-benefit-list { position:relative; display:flex; flex-direction:column; gap:20px; padding: 0 5%; }
.pep-benefit-item { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:44px; background:#ffe600; border-radius:30px; text-align:left; }
.pep-benefit-info { flex:1; min-width:0; }
.pep-event-label { display:block; font-size:24px; font-weight:bold; color:#FF5100; margin-bottom:30px; }
.pep-condition { font-size:32px; color:#333; margin-bottom:4px; }
.pep-discount { display:block; font-size:44px; font-weight:bold; color:#000; margin-bottom:10px; }
.pep-note { display:block; font-size:20px; color:#777; }

/* 쿠폰 */
.pep-ticket { position:relative; flex-shrink:0; display:flex; align-items:center; width:270px; height:144px; background:#ffffff; border-radius:16px; overflow:hidden; }
.pep-ticket-info { flex:1; text-align:left; padding:0 10%; }
.pep-ticket-label { display:block; font-size:16px; color:#444; margin-bottom:6px; }
.pep-ticket-price { display:block; font-size:44px; font-weight:bold; color:#000; white-space:nowrap; letter-spacing: -1px; }
.pep-ticket-price .pep-won { font-size:28px; font-weight:600; margin-left:1px; }
.pep-ticket-sub { display:block; font-size:16px; color:#999; margin-top:4px; }
.pep-ticket-brand { width:55px; height:100%; display:flex; align-items:center; justify-content:center; font-size:11px; font-weight:700; letter-spacing:2px; color:rgba(0,0,0,.4); border-left:1px dashed rgba(0,0,0,.15); }
.pep-ticket-brand img { width: auto; height: 60%; opacity: .3; }
.pep-ticket-brand::before, .pep-ticket-brand::after { content:''; position:absolute; right:47px; width:16px; height:16px; background:#ffe600; border-radius:50%; }
.pep-ticket-brand::before { top:-8px; }
.pep-ticket-brand::after { bottom:-8px; }

/* 유의사항 */
.pep-notice { padding:60px 6%; background:#e8e8e8; text-align:left; color:#000; }
.pep-notice h3 { font-size:33px; font-weight:bold; margin:0 0 28px; }
.pep-notice-block { margin-bottom:26px; }
.pep-notice-tit { font-size:22px; font-weight:700; margin-bottom:10px !important; }
.pep-notice-sub { font-size:22px; font-weight:700; margin-bottom:10px !important; }
.pep-notice-list li { font-size:22px; line-height:1.7; }
.pep-notice-block > .pep-notice-list > li { padding-left:14px; position:relative; margin-bottom:4px; word-break: keep-all; }
.pep-notice-block > .pep-notice-list > li::before { content:'-'; position:absolute; left:0; }
.pep-notice-tit + .pep-notice-list > li { padding-left:22px; }
.pep-notice-tit + .pep-notice-list > li::before { content:'-'; left:8px; }
.pep-dash li { margin-bottom:10px; }
.pep-dash li:last-child { margin-bottom:0; }
.pep-notice-indent { display:inline-block; margin-left:4px; }

/* 모바일 (480px 이하) */
@media (max-width:480px){
    .pep-hero { padding:44px 16px 40px; }
    .pep-logo { margin-bottom:20px; }
    .pep-logo img { width:180px; }
    .pep-title h2 { font-size:30px; line-height:40px; margin:38px 0 18px; }
    .pep-date { font-size:15px; padding:7px 18px; }
    .pep-benefit-list { gap:12px; padding:0; }
    .pep-benefit-item { flex-direction:row; align-items:center; padding:20px; border-radius:16px; gap:10px; }
    .pep-event-label { font-size:13px; margin-bottom:14px; }
    .pep-condition { font-size:16px; }
    .pep-discount { font-size:22px; margin-bottom:6px; letter-spacing: -1px; }
    .pep-note { font-size:12px; }
    .pep-ticket { width:150px; height:88px; border-radius:7px; }
    .pep-ticket-label { font-size:11px; margin-bottom: 3px; }
    .pep-ticket-price { font-size:22px; font-weight: 600; }
    .pep-ticket-price .pep-won { font-size:15px; }
    .pep-ticket-sub { font-size:10px; margin-top:2px; }
    .pep-ticket-brand { font-size:8px; width: 30px; }
    .pep-ticket-brand::before, .pep-ticket-brand::after { right:25px; width:9px; height:9px; }
    .pep-ticket-brand::before { top:-5px; }
    .pep-ticket-brand::after { bottom:-5px; }
    .pep-notice { padding:40px 6%; }
    .pep-notice h3 { font-size:18px; margin:0 0 18px; }
    .pep-notice-block { margin-bottom:18px; }
    .pep-notice-tit,.pep-notice-sub { font-size:14px; margin-bottom:8px !important; }
    .pep-notice-list li { font-size:13px; }
}
/* BASIC css end */

