@charset "utf-8";

div{box-sizing: border-box; }

.bmd-stepfix-wrap {display: flex; width: 100%; min-height: 140vh;  background:#000 url('../images_2025/bmd-stepfix-wrap_bg.webp') no-repeat center / cover; padding:150px 0; }

/* ---------- LEFT ---------- */
.bmd-stepfix-left {position: sticky; top: 0; width: 35%; height: 100vh; padding: 80px;}
.bmd-stepfix-left-inner {top:38%;position: relative;text-align: center;color: #fff;} 
.point-inner {display: flex;align-items: center; justify-content: space-between; gap: 60px;}

/* ---------- TEXT ---------- */
.point-text {width: 55%;}

/* ---------- IMAGE ---------- */
.point-image {width: 54%; display: flex; justify-content: center; align-items: center;}
.point-image img {object-fit: contain; transition: transform 0.35s ease, opacity 0.35s ease;}
.point-image img.first {animation: spin 18s linear infinite;}
@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}




.point-02 .point-image {display: flex;align-items: center;justify-content: center; position: relative;}

/* 공통 */
.point-02 .point-image img {max-height: 360px; object-fit: contain;}

/* 중앙 이미지 */
.point-02 .img-center {position: relative; opacity: 1; transform: none; z-index: 2;width: 300px;}
.point-02 .img-up,.point-02 .img-down {opacity: 0; width:110px;}
@keyframes slideUp {
  from {
    transform: translateY(-80px);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}

@keyframes slideDown {
  from {
    transform: translateY(80px);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}

.point-02.is-center .img-up {animation: slideDown 0.8s ease-out forwards; top: -60px; z-index: 1;}
.point-02.is-center .img-down {animation: slideUp 0.8s ease-out forwards; bottom: -60px; z-index: 1;}
/* 중앙 포인트일 때 이미지 강조 */
.bmd-stepfix-point.is-center .point-image img {transform: scale(1.05); opacity: 1;}

/* 비활성 상태 */
.bmd-stepfix-point:not(.is-center) .point-image img {opacity: 0.6;}
.bmd-stepfix-badge {display: inline-block; padding:16px 44px; border: 1px solid #fff; border-radius: 999px; font-size: 28px; margin-bottom: 24px;  } 
.bmd-stepfix-title {font-size: 84px;font-weight: 700; margin-bottom: 20px;line-height: 1.2;} 
  
.bmd-stepfix-desc {font-size: 18px; line-height: 1.6;  }

/* ---------- RIGHT ---------- */
.bmd-stepfix-right {width: 65%; height: auto; overflow: visible; }
.bmd-stepfix-points {display: flex;flex-direction: column;}
.bmd-stepfix-point {height: 50vh; padding: 60px 80px; display: flex; flex-direction: column; justify-content: center; background: #fff; transition: all 0.35s ease;}

/* 중앙 강조 */
.bmd-stepfix-point.is-center {background: #ffd400;}
/* ---------- TEXT ---------- */
.bmd-stepfix-point h3 {font-size: 13px;font-weight: 700; margin-bottom: 8px;}
.bmd-stepfix-point h2 {font-size: 43px;line-height: 1.3; margin-bottom: 10px;}
.bmd-stepfix-point p {font-size: 20px;line-height: 1.5;}
.point-04 .point-image {position: relative; display: flex; justify-content: center; align-items: center;}
.point-04 .point-image::before {content: "";position: absolute; width: 360px;height: 104px; border-radius: 50%; background: rgb(224 95 0 / 35%); top:187px; left:40px;
  z-index: 0;}
@keyframes haloPulse {
  0% {
    opacity: 0;
    transform: scale(0.6);
  }
  50% {
    opacity: 0.8;
    transform: scale(1);
  }
  100% {
    opacity: 0;
    transform: scale(1.25);
  }
}

.point-04.is-center .point-image::before {animation: haloPulse 1.6s ease-out infinite;}
.point-04 .point-image::after {content: "";position: absolute; width: 260px;height: 260px; border-radius: 50%; background: rgba(255, 212, 0, 0.25); filter: blur(15px);  opacity: 0;}
.point-04.is-center .point-image::after {animation: haloPulse 1.6s ease-out infinite;animation-delay: 0.4s;}


@media (max-width: 1300px) {
.bmd-stepfix-wrap{flex-direction:column; background:#000 url('../images_2025/bmd-stepfix-wrap_bg.webp') no-repeat top / contain; padding:100px 0 0;}
.bmd-stepfix-left{position:relative; width:100%; padding:0; height:50vh;}
.bmd-stepfix-right{width:100%;}
.bmd-stepfix-left-inner{top:0;}
.bmd-stepfix-point{padding:60px 20px;}
.bmd-stepfix-point p{text-align:left;}
.point-image img.first{width:170px;}
.point-image img{max-width:380px;}
.point-02 .img-up, .point-02 .img-down{width:90px;}
.point-02 .img-center{width:197px;}
.bmd-stepfix-point h3{text-align:left;}
.point-04 .point-image::before{width:260px; height:88px; top:127px; left:40px;}
}



.allinone-section {padding: 80px 0 0; text-align: center; background: linear-gradient(to right, #fff2d6 0 33.333%, #fff5d9 33.333% 66.666%, #fff8ca 66.666% 100%);}

/* TOP BADGE */
.top-badge {display: inline-block; background: #111; color: #ffd400; font-size: 27px; font-weight: 300; padding: 10px 24px; margin-bottom: 24px;}

/* TITLE */
.main-title {font-size: 77px; font-weight: 800; margin-bottom: 80px; color: #111;}

/* MENU WRAP */
.menu-wrap {display: flex; justify-content: center; gap: 0; align-items:flex-end; overflow:hidden;}

/* MENU BOX */
.menu-box {width: 33.33%; padding: 40px 0 0; position: relative;}
.menu-box h2 {font-size: 63px; font-weight: 700; margin-bottom: 6px;}
.menu-box span {display: block;font-size: 24px; letter-spacing: 1px; color: #111; margin-bottom: 40px; font-family:'PaperoziR';}
.menu-box img {margin: 0 auto; display: block; width:100%;}

.fade-up { opacity: 0; transform: translateY(60px); transition: opacity 0.8s ease, transform 0.8s ease; will-change: opacity, transform;}

/* ===== 화면에 들어오면 ===== */
.fade-up.show { opacity: 1;  transform: translateY(0);}
.menu-box:nth-child(1) { transition-delay: 0.1s; }
.menu-box:nth-child(2) { transition-delay: 0.3s; }
.menu-box:nth-child(3) { transition-delay: 0.5s; }
/* 반응형 */

@media (max-width: 1400px) {
 .menu-box img {
    width: 100%;
	}
}

@media (max-width: 1024px) {
  .allinone-section{background:linear-gradient(to bottom, #fff2d6 0 33.333%, #fff5d9 33.333% 66.666%, #fff8ca 66.666% 100%);}
  .menu-wrap {
    flex-direction: column; gap:100px;
  }

  .menu-box {
    width: 100%;
  }

  .menu-box img {
    width: 70%;
  }
}



.special_menu_rank {background: #ffc400; padding: 150px 40px 0; position: relative; overflow: hidden;}
.smr-wrap { margin: 0 auto; text-align: center;}
/* HEADER */
.smr-title {font-size: 76px;font-weight: 800; margin-bottom: 20px;}
.smr-desc {font-size: 30px;}

/* BODY */
.smr-body {position: relative; display: flex; justify-content: center; align-items: flex-end;}

/* FOOD IMAGE */
.smr-food {width:30%;position: relative;z-index: 1;}
.smr-img {width: 705px; border-radius: 50%; display: block; transform: translateY(270px);}

/* CENTER RANK */
.smr-rank {width:45%; background: linear-gradient(0deg, black, #2a2a2a); color: #fff; padding: 43px 70px; border-radius: 28px;
  position: relative; z-index: 3; margin: 60px -120px; transform: translateY(-130px); box-shadow: 0 30px 60px rgba(0,0,0,0.25); font-family: 'PaperoziB'; }

/* RANK STYLE */
.smr-rank-title {font-size: 54px; margin-bottom: 50px;}
.smr-item {display: flex; justify-content: space-around; align-items: center; margin-bottom: 5px;}
.smr-item .no {font-size: 38px;color: #aaa;}
.smr-item .menu {font-size: 58px; font-weight: 700; color: #ffc400;}
.smr-item .count {font-size: 25px; text-align: center;}
.smr-item strong {font-size: 38px;}
.smr-line {height: 1px; background: #444; margin: 30px 0;}
.smr-note {margin-top: 30px;font-size: 13px; color: #aaa;}

.smr-bubble {position: absolute;z-index: 5; opacity: 0; transform: scale(0.6) translateY(40px); transition: all 0.6s cubic-bezier(.25,.8,.25,1);}
.bubble-top {top:80px;left:0%; transform: translateX(-50%) scale(0.6) translateY(40px);}
.bubble-bottom {bottom:10px;  right:-200px;  transition-delay: .2s;}
.bubble-top2 {top:100px;left:20%; transform: translateX(-50%) scale(0.6) translateY(40px);}
.bubble-bottom2 {bottom:20px;  right:460px;  transition-delay: .2s;}
.smr-bubble.show {opacity: 1; transform: translateX(-50%) scale(1) translateY(0);}
.smr-bubble img {width: 420px; display: block;}
.bubble-bottom.show {transform: scale(1) translateY(0);}
/* 위치 조정 */
.bubble-left-1 {top: -120px; left: -50px;}
.bubble-left-2 {top: -20px; right: -80px;}

/* 활성화 상태 */
.smr-bubble.show {opacity: 1; transform: scale(1) translateY(0);}
@media (max-width: 1400px) {
  .smr-body {
    flex-direction: row; /* 전체 세로 배치 */
    align-items: center;
    gap: 20px;
    overflow-x: hidden;
    display: flex;
    flex-wrap: wrap;
  }

  /* 메뉴 두 개를 가로로 배치 */
  .smr-food.left, .smr-food.right {
    width: 43%; /* 두 이미지 합쳐서 한 줄 */
    transform: translateY(0); /* 이미지 Y축 이동 제거 */
    margin: 0 auto;
  }
  .smr-body > .smr-food.left {
    order: 2; /* 첫 번째 메뉴 */
  }
  .smr-body > .smr-food.right {
    order: 3; /* 두 번째 메뉴 */
  }

  /* 랭킹 박스 맨 아래로 */
  .smr-rank {
  margin: 30px auto; /* 기존 margin 제거 */
  transform: translateY(0);
  width: 80%;
  order: 1;
}

  /* 이미지 크기 */
  .smr-img {
    width: 100%;
    max-width: 500px;
    border-radius: 50%;
    transform: translateY(0);
  }

.bubble-bottom2 { right: 0; transform: translateX(50%) scale(0.6); }
.bubble-bottom { right: 0; transform: translateX(50%) scale(0.6); }
.smr-bubble img{width:260px;}

  /* 텍스트 크기 */
  .smr-title {font-size: 60px;}
  .smr-desc {font-size: 24px;}
  .smr-rank-title {font-size: 42px; margin-bottom: 30px;}
  .smr-item .menu {font-size: 42px;}
  .smr-item .no {font-size: 32px;}
  .smr-item strong {font-size: 32px;}
  .special_menu_rank { overflow-x: hidden; }
}





.ppl{background:url('../images_2025/ppl_bg.jpg')no-repeat; padding:40rem 150rem 150rem; display:flex !important;}
		.ppl .left_img{width:30%;}
		.ppl .right_text{color:#93080F; font-size:30rem; display:flex; flex-direction:column; align-items:center; gap:20px; justify-content:center;}
		.ppl .right_text p{font-size:40px;}
		.ppl .right_text p span{font-family:'PaperoziB'; font-size:50px;}
		.ppl .right_text .top_txt{display:flex; gap:40px; align-items:center;}
		.bottom_txt{padding:50px;font-size:50px; background:#93080f; border-radius:20px; color:#fff;}
		.bottom_txt em{font-family:'PaperoziB'; color:#FFCA01;font-size:50px;}
		.bottom_txt p{font-size:50px;}
		.ppl.mbver{display:none !important;}
		
		@media (max-width: 1600px) {
		.ppl{gap:80px; padding:20rem 50rem 50rem;}
		.ppl .right_text{width:60%;}
		.ppl .right_text p{font-size:30px;}
		.ppl .right_text p span{font-size:37px;}
		img.ppl_title_logo{width:70%;}
		.bottom_txt em{font-size:40px;}
		
		}
		@media (max-width: 1200px) {
		.ppl .right_text .top_txt{gap:30px;}
		.ppl .right_text .top_txt > div{width:50%;}
		.ppl .right_text p span{font-size:40px;}
		.ppl .right_text p{font-size:30px;}
		
		}
		
		@media (max-width: 1050px) {
		.ppl{background:none; padding:0;}
		.ppl.pcver{display:none !important;}
		.ppl.mbver{display:block !important;}
		}
		

.interview-section {position: relative; width: 100%; min-height: 800px; overflow: hidden;}
.interview-section h3,.interview-section p{text-align:center;}
.background-overlay {padding: 100px 5%; position: relative;}
.section-title {font-size: 50px;  font-weight: 700; text-align: center; margin-bottom: 50px;}
.interview-slides-container { max-width: 1200px; margin: 30px auto;  overflow: hidden;}

.interview-slides {display: flex; transition: transform 0.5s ease-in-out; transform: translateX(0);}
.interview-content-wrapper {display: flex; align-items: center; justify-content: center; flex-shrink: 0;gap: 0; position:relative;}
.video-embed-container { width: 800px;border-radius: 5px;overflow: hidden;}

.video-responsive { position: relative;  padding-bottom: 56.25%;  height: 0; background: #000;}
.video-responsive iframe { position: absolute; inset: 0; width: 100%;height: 100%;}
.interview-text-box { width: 400px; height:100%; padding: 40px 30px; box-sizing: border-box; background:#ffcc00; color: #1c1b1b;display: flex; flex-direction: column; justify-content: center;}
h3.store-owner-name { font-size: 38px;font-weight: 700;margin-bottom: 20px; text-align:left;}
p.interview-quote { font-size: 18px;  line-height: 1.6;  margin: 0; text-align:left;}
.navigation-area-wrapper { max-width: 1200px; margin: -120px auto 0 230px;  position:relative;  display: flex;  justify-content: flex-end;}
.navigation-buttons { display: flex;gap: 0;}
.nav-button { width: 60px;  height: 60px;border: 1px solid #404040;background: #2f2f2f;color: #ffffff; font-size: 1.5em;cursor: pointer; display: flex; justify-content: center;align-items: center;transition: 0.3s;}
.nav-button:hover {background: #333;}

@media (max-width: 1000px) {
    .background-overlay {padding: 50px 0; }
    .interview-content-wrapper {flex-direction: column; align-items: center;padding: 0 1%;}
    .video-embed-container, .interview-text-box {width: 100%;}
    .interview-text-box {padding: 20px 20px; height: auto;}
    .navigation-area-wrapper {margin: 30px auto 0; justify-content: center; }
}


@media (max-width: 550px) {
    .interview-section{min-height:auto;}
	.store-owner-name {font-size: 26px; margin-bottom: 5px;}
    .interview-quote {font-size: 14px;}
    .interview-text-box { min-height: 190px;justify-content:flex-start;}
    .nav-button {width: 40px; height: 40px; font-size: 1em;}
    .navigation-area-wrapper {margin: -56px auto 0;}
}

/*두바이*/
 .dubai_menu{ background-color: #fff; overflow-x: hidden;}
		.dubai_menu.pcver{display:block !important;}
		.dubai_menu.mbver{display:none !important; }

        /* 2. 상단 채팅 영역 */
        .dubai_menu .chat-section {
            position: relative;
            width: 100%;
            height: 650px;
            display: flex;
            flex-direction: column;
            align-items: center;
            margin-top: 170px;
            background: linear-gradient(360deg, #fffcf7, #ffffff);
        }

        .dubai_menu .vertical-line {
            position: absolute;
            bottom: 0;
            left: 50%;
            width: 1px;
            height: 130px;
            border-left: 1px solid #562020;
            transform: translateX(-50%);
        }

        .dubai_menu .chat-img {
            position: absolute;
            z-index: 2;
            opacity: 0; 
            transform: translateY(50px); /* 아래에 대기 */
            transition: opacity 0.3s, transform 0.3s; /* 사라질 때 부드럽게 초기화 */
            filter: drop-shadow(0 10px 15px rgba(0,0,0,0.1));
            height: auto;
        }
        
        .dubai_menu .chat-section.active .chat-img {
            animation-name: dubaiSlideUp, dubaiFloating;
            animation-duration: 0.8s, 4s;
            animation-timing-function: ease-out, ease-in-out;
            animation-iteration-count: 1, infinite;
            animation-fill-mode: forwards, none;
        }

        /* 개별 이미지 배치 (이미지 크기에 따라 조절하세요) */
        .dubai_menu .p1 {top: 0%;right: 19%;width: 317px;}
        .dubai_menu .p2 {top: 0%;right: 40%;width: 346px;}
        .dubai_menu .p3 {top: 17%;left: 29%;width: 323px;} /* p1과 살짝 겹침 */
        .dubai_menu .p4 {top: 24%;right: 25%;width: 323px;}
        .dubai_menu .p5 {top: 45%;left: 5%; width: 230px; }  /* 추가 이미지 */
        .dubai_menu .p6 {top: -10%;left: 16%;width: 290px;} /* 중앙 근처 배치 */
        .dubai_menu .p7 {top: 30%;left: 17%;width: 290px;}
        .dubai_menu .p8 {top: 14%;right: -1%;width: 290px;}
        .dubai_menu .p9 {top:34%;right:10%;width: 290px;}
        .dubai_menu .p10 {top: 57%;right:10%;width: 544px;}
        .dubai_menu .p11 {top:10%;left: 2%;width: 544px;}

        .dubai_menu .main-req-wrapper {
            margin-top: 550px;
            z-index: 10; 
            text-align: center;
        }
        .dubai_menu .main-req {
            position: relative;
            max-width: 672px;
            opacity: 0;
            filter: drop-shadow(0 10px 20px rgba(0,0,0,0.1));
            /*animation: dubaiSlideUp 1s ease-out 1.8s forwards;*/
            top: 360px;
        }
        .dubai_menu .chat-section.active .main-req {
            animation-name: dubaiSlideUp;
            animation-duration: 1s;
            animation-fill-mode: forwards;
        }

        /* 뒤쪽: 흐림 + 작음 */
        .dubai_menu .bg-blur {
            z-index: 2;
            filter: blur(1px) opacity(1.6);
            transform: scale(0.85);
        }
        /* 중간: 약간 흐림 */
        .dubai_menu .mid-layer {
            z-index: 3;
            filter: blur(0.5px) opacity(0.8);
        }

        /* 앞쪽: 선명함 + 그림자 강조 */
        .dubai_menu .front-layer {
            z-index: 4;
            filter: blur(0) opacity(1) drop-shadow(0 15px 30px rgba(0,0,0,0.15));
        }

        /* 3. 출시 알림 영역 (곡선 배경) */
        .dubai_menu .announcement {
            background: url('../images_2025/dubai_bg.webp') bottom;
            text-align: center;
            position: relative;
            /* padding-bottom: 80px; */
        }

        .dubai_menu .white-curve {
            background-color: #fffcf7;
            padding: 60px 20px 140px 20px;
            border-bottom-left-radius: 15% 200px;
            border-bottom-right-radius: 15% 200px;
        }

        .dubai_menu .sub-text {/* font-size: 1.4rem; */color: #682f04;margin-bottom: 10px;}
        .dubai_menu .main-title {font-size: 50px;font-weight: 800;color: #682f04;margin-bottom: 0; word-break: break-all;}
        .dubai_menu .main-title span {
            /* box-shadow: inset 0 -15px 0 var(--point-yellow); */ /* 형광펜 효과 */
			white-space: nowrap;
    display: inline-block;
        }
        
        .dubai_menu .release-tag {
            display: inline-block;
            border: 2px solid #682f04;
            border-radius: 50px;
            padding: 9px 15px;
            margin-top: 35px;
            font-size: 25px;
            font-weight: 700;
            background: #fff;
            color: #682f04;
        }
		
		.product-section img.pc{display:block;}
			.product-section img.mb{display:none;}


        /* 5. 키프레임 애니메이션 (이름 중복 방지를 위해 dubai 접두어 사용) */
        @keyframes dubaiSlideUp {
            from { opacity: 0; transform: translateY(50px); }
            to { opacity: 1; transform: translateY(0); }
        }

        @keyframes dubaiFloating {
            0%, 100% { transform: translateY(0); }
            50% { transform: translateY(-12px); }
        }

        /* 모바일 대응 */
		@media (max-width: 1300px) {
		.product-section img{width:100%;}
		}
		
        @media (max-width: 768px) {
            .dubai_menu .main-title { font-size:40px; }
            .dubai_menu .p2{top:-11%; right:30%;}
			.dubai_menu .p3{top:17%; left:9%;}
			.dubai_menu .p4{top:24%; right:5%;}
			.dubai_menu .chat-section{height:560px; margin-top:200px;}
			.dubai_menu .white-curve {padding: 30px 20px 60px 20px;  border-bottom-left-radius: 100px;  border-bottom-right-radius:100px;}
			.dubai_menu .announcement {background:url('../images_2025/dubai_bg_mb.png') bottom / contain;}
			
			.product-section img.pc{display:none;}
			.product-section img.mb{display:block;}
        }
		
		  @media (max-width: 530px) {
			.dubai_menu .p2{width:276px; right:8%; top:-31%;}
			.dubai_menu .p3{width:253px; top:-14%;}
			.dubai_menu .p4{width:283px;}
			.dubai_menu .p10{top:-30%; left:2%;}
			.dubai_menu .white-curve{padding:30px 26px 40px;}
			.dubai_menu .main-req{max-width:100%;}
			.dubai_menu .release-tag{font-size:16px;}
		  }
		  
		  @media (max-width: 520px) {
		  .dubai_menu.pcver{display:none !important;}
		   .dubai_menu.mbver{display:block !important; margin:0;}
		  }
		  
.bmd-omni-card{ display: flex; flex-direction: column;  gap: 20px;  align-items: center;}
	.bmd-omni-card > div > img{width:300px;}
	@media (max-width: 760px) {
	.bmd-omni-card > div > img.img3{display:none;}
	.bmd-omni-card > div > img{width:130px;}
	}

.aio-section{margin:300px auto;text-align:center;max-width:1200px;}
.aio-header{margin-bottom:60px;}
.aio-tabs{display:flex;justify-content:space-between; font-weight:700;color:#FFC107;}
.aio-tabs li{flex:1;cursor:pointer;padding-bottom:15px;}
.aio-tabs li.active{color:#ffb300;}
.aio-tab-line{height:4px;background:#FFF3CD;position:relative;}
.aio-tab-indicator{position:absolute;height:8px;width:20%;background:#FFC107;top:-2px;transition:0.3s;border-radius:20px;}
.aio-pane{position: absolute;  visibility: hidden;  opacity: 0;  width: 100%;  top: 0;  left: 0; z-index: -1; transition: opacity 0.4s ease-in-out;}
.aio-pane.active{position: relative;  visibility: visible;  opacity: 1;  z-index: 1;  margin-top: 60px;}
.aio-contents {position: relative;}
.aio-item{text-align:center; position:relative; transition:0.35s; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; height:380px; gap:10px;}
.aio-item:hover{transform:translateY(-12px);}
.aio-item::after{content:""; width:120px; height:60px; background:#FFC107; border-radius:50%;position:absolute; bottom:60px;z-index:-1;}
.aio-item img{width:240px;}
.aio-item img.coffee{height:300px; width:auto;}
.aio-item img.coldcoffee{height:300px; width:auto;}
.aio-item img.bottle{height:300px; width:auto;}
.aio-item img.popcorn{width:160px;}
.aio-item img.toast{width:350px;}
.aio-item img.cake_fat{width:180px;}
.aio-item img.fatcaron{width:120px;}
.aio-swiper-wrapper {  position: relative;  width: 100%;  height: 100%;  z-index: 1;  display: flex;  transition-property: transform;  box-sizing: content-box;}
.aio-swiper-wrapper.beverage .aio-item img{height:250px; width:auto;} 
.aio-swiper-wrapper.beverage .aio-item::after{content:""; width:108px; height:30px; background:#FFC107; border-radius:50%;position:absolute; bottom:55px;z-index:-1;}
.aio-swiper-slide {flex-shrink: 0; position: relative; transition-property: transform;}

.aio-item p{font-size:13px; color:#969696;}
.aio-item p.tit{font-size:20px; font-family:'PaperoziB'; color:#272727;}

.aio-swiper-container {
  max-width: 1200px;
  margin: auto;
  position: relative;
  overflow: hidden;
  list-style: none;
  padding: 0;
  z-index: 1;
}

.aio-button-prev,
.aio-button-next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 40px;
  height: 40px;
  z-index: 10;
  cursor: pointer;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 44'%3E%3Cpath d='M0,22L22,0l2.1,2.1L4.2,22l19.9,19.9L22,44L0,22z' fill='%23cccccc'/%3E%3C/svg%3E");
  background-size: 50% auto;
  background-position: center;
  background-repeat: no-repeat;
}

.aio-button-next {
  right: 0;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 44'%3E%3Cpath d='M27,22L5,44l-2.1-2.1L22.8,22L2.9,2.1L5,0L27,22z' fill='%23cccccc'/%3E%3C/svg%3E");
}

.aio-button-prev {
  left: 0;
}

@media (max-width:1024px){
  .aio-section{padding:0 20px;}
  .aio-tabs{font-size:20px;}
  .aio-item{height:280px;}
  .aio-item img{width:200px;}
  .aio-item img.toast{width:260px;}
}

@media (max-width:768px){
.aio-section{margin:70px auto;}
  .aio-header{margin-bottom:40px;}
  .aio-header h3{font-size:28px;}
  .aio-tabs{font-size:16px;}
  .aio-tabs li{padding-bottom:10px;}
  .aio-tab-indicator{height:6px;}
  .aio-pane{margin-top:40px;}
  .aio-item{height:240px;}
  .aio-item img{width:160px;}
  .aio-item img.toast{width:220px;}
  .aio-item img.popcorn{width:120px;}
  .aio-item img.cake_fat{width:140px;}
  .aio-item p.tit{font-size:12px;}
  .aio-item p{font-size:8px;}
  .aio-swiper-wrapper.beverage .aio-item img{height:150px;}
  .aio-swiper-wrapper.beverage .aio-item::after{ width:78px; height:30px; bottom:36px;}
}

@media (max-width:480px){
  .aio-tabs{font-size:12px;}
  .aio-item{height:200px;}
  .aio-item img{width:140px;}
  .aio-item img.toast{width:155px;}
  .aio-item img.coffee,.aio-item img.coldcoffee{height:140px;}
  .aio-item img.bottle{height:130px;}
.aio-item::after{display:none;}
}



.bmc5000-section { position: relative; overflow: hidden; padding: 110px 20px 100px; background: #fffdee; color: #171717; font-family: 'PaperoziB'; }
.bmc5000-container { position: relative; z-index: 1; margin: 0 auto; text-align: center; }
.bmc5000-label { display: inline-flex; align-items: center; justify-content: center; min-height: 38px; margin-bottom: 26px; padding: 8px 24px; border-radius: 100px; background: #111; color: #fff; font-size: 17px; font-weight: 700; line-height: 1; letter-spacing: -0.03em; }
.bmc5000-heading { margin: 0; color: #171717; font-size: clamp(34px, 3.2vw, 40px); font-weight: 800; line-height: 1.3; letter-spacing: -0.055em; word-break: keep-all; }
.bmc5000-heading strong, .bmc5000-heading em { color: #f7bd00; font-style: normal; font-weight: 900; }
.bmc5000-mobile-break { display: none; }
.bmc5000-comparison { position: relative; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));max-width: 1080px; margin: 55px auto 0; }
.bmc5000-box { display: flex; align-items: center; min-height: 180px; padding: 36px 52px; text-align: left; justify-content:space-evenly;}
.bmc5000-box-other { background:#b2b2b2; color: #fff; }
.bmc5000-box-brand { background: linear-gradient(135deg, #ffd823 0%, #ffbc00 100%); color: #111; }
.bmc5000-icon { display: flex; flex: 0 0 auto; align-items: center; justify-content: center; width: 94px; height: 94px; margin-right: 28px; border-radius: 50%; background: #fff; }
.bmc5000-icon img { display: block; width: 54px; height: 54px; object-fit: contain; }
.bmc5000-box-label { margin: 0 0 8px; font-size: clamp(20px, 1.8vw, 27px); font-weight: 600; line-height: 1.3; letter-spacing: -0.05em; }
.bmc5000-box-label strong { font-weight: 900; }
.bmc5000-box-other .bmc5000-box-label strong, .bmc5000-box-other .bmc5000-amount { color: #464646; }
.bmc5000-amount { display: flex; align-items: flex-end; margin: 0; font-size: clamp(48px, 5vw, 70px); font-weight: 900; line-height: 1; letter-spacing: -0.06em; white-space: nowrap; }
.bmc5000-amount span { margin: 0 0 6px 8px; font-size: 22px; font-weight: 800; letter-spacing: -0.05em; }
.bmc5000-vs { position: absolute; top: 50%; left: 50%; z-index: 3; display: flex; align-items: center; justify-content: center; width: 78px; height: 78px; font-size: 67px; font-weight: 900; transform: translate(-50%, -50%); color:#fff; }
.bmc5000-line { position: relative; width: 1px; height: 58px; margin: 12px auto 20px; background: #f7bd00; }
.bmc5000-line::after { content: ""; position: absolute; bottom: -4px; left: 50%; width: 9px; height: 9px; border-radius: 50%; background: #f7bd00; transform: translateX(-50%); }
.bmc5000-summary p { margin: 0; font-weight: 900; line-height: 1.35; letter-spacing: -0.055em; }
.bmc5000-summary span { display: block; margin-top: 10px; color: #666; font-size: 19px; line-height: 1.5; letter-spacing: -0.035em; }
.bmc5000-notice { margin: 26px 0 0; color: #999; font-size: 13px; line-height: 1.5; }

/* 태블릿 */
@media (max-width: 1024px) {
  .bmc5000-section { padding: 90px 24px 80px; }
  .bmc5000-comparison { max-width: 820px; }
  .bmc5000-box { min-height: 160px; padding: 30px 32px; }
  .bmc5000-icon { width: 76px; height: 76px; margin-right: 20px; }
  .bmc5000-icon img { width: 44px; height: 44px; }
  .bmc5000-amount span { font-size: 18px; }
}

/* 모바일 */
@media (max-width: 767px) {
  .bmc5000-section { padding: 70px 18px 65px; }
  .bmc5000-section::before, .bmc5000-section::after { width: 100px; height: 100px; }
  .bmc5000-section::before { top: -55px; left: -52px; }
  .bmc5000-section::after { right: -55px; bottom: -52px; }
  .bmc5000-label { min-height: 32px; margin-bottom: 18px; padding: 7px 18px; font-size: 14px; }
  .bmc5000-heading { font-size: clamp(29px, 7.5vw, 40px); line-height: 1.35; }
  .bmc5000-mobile-break { display: block; }
  .bmc5000-comparison { display: flex; flex-direction: column; margin-top: 38px; }
  .bmc5000-box { min-height: 128px; padding: 24px 22px; border-radius: 17px; }
  .bmc5000-icon { width: 64px; height: 64px; margin-right: 17px; }
  .bmc5000-icon img { width: 38px; height: 38px; }
  .bmc5000-box-label { margin-bottom: 6px; font-size: 18px; }
  .bmc5000-amount { font-size: clamp(40px, 12vw, 54px); }
  .bmc5000-amount span { margin-bottom: 1px; font-size: 23px; }
  .bmc5000-vs { top: 50%; width: 54px; height: 54px; font-size: 19px; }
  .bmc5000-line { height: 42px; margin-top: 10px; }
  .bmc5000-summary p { font-size: 24px; }
  .bmc5000-summary span { max-width: 290px; margin: 8px auto 0; font-size: 16px; }
  .bmc5000-notice { margin-top: 20px; font-size: 11px; }
}

@media (max-width: 430px) {
	.bmc5000-amount span{font-size:13px;}
}


 .promo-container { font-family:'PaperoziB'; background-color: #FFD400;  padding: 140px 20px;  text-align: center;  box-sizing: border-box;}

/* ìƒë‹¨ í—¤ë” ë° íƒ€ì´í‹€ */
.promo-container .promo-header {
  margin-bottom: 35px;
}

.promo-container .promo-header h2 {
  font-size: 52px;
  font-weight: 900;
  color: #111111;
  margin: 0 0 12px 0;
  letter-spacing: -1px;
}

.promo-container .promo-header h2 strong {
  font-weight: 900; color:#a52828; font-size: 80px;
}

.promo-container .promo-header p {
  font-size: 20px;
  font-weight: 500;
  color: #222222;
  margin: 0;
  letter-spacing: -0.5px;
}

/* ë©”ì¸ ì½˜í…ì¸  ê°ì‹¸ëŠ” ì˜ì—­ */
.promo-container .promo-content {
  max-width: 1150px;
  margin: 0 auto;
}

/* ê³µí†µ ì¹´ë“œ ë ˆì´ì•„ì›ƒ ì„¤ì • */
.promo-container .promo-content .card-white,
.promo-container .promo-content .card-black {
  border-radius: 12px;
  box-sizing: border-box;
}

/* í•˜ë‹¨ ë¸”ëž™ ì¹´ë“œ ìƒì„¸ */
.promo-container .promo-content .card-black {
  background-color: #1a1a1a;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='5' height='5' viewBox='0 0 4 4'%3E%3Ccircle cx='1' cy='1' r='0.6' fill='%23ffffff' fill-opacity='0.08'/%3E%3C/svg%3E");
  background-repeat: repeat;
  padding: 50px 20px 40px 20px;
  position: relative;
  z-index: 1;
}

/* ìƒë‹¨ í™”ì´íŠ¸ ì¹´ë“œ ìƒì„¸ */
.promo-container .promo-content .card-white {
  background-color: #FFFFFF;
  padding: 50px;
  box-shadow: 0 10px 20px rgba(0,0,0,0.05);
  margin-bottom: -15px;
  position: relative;
  z-index: 2;
}

.promo-container .card-white .loan-group {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 30px;
}

.promo-container .loan-group .loan-item {
  display: flex;
  align-items: center;
  gap: 20px;
  text-align: left;
}

.promo-container .loan-item .icon-wrap img {
  /* width: 65px; */
  height: auto;
  display: block;
}

.promo-container .loan-item .loan-info {
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
}

.promo-container .loan-info .bank-name {
  font-size: 29px;
  font-weight: 700;
  color: #8B6735;
  margin-bottom: 4px;
}

.promo-container .loan-info .bank-name.color-blue {
  color: #2B5783;
}

.promo-container .loan-info .amount {
  font-size: 40px;
  font-weight: 700;
  color: #111111;
  white-space: nowrap;
}

.promo-container .loan-info .amount strong {
  font-weight: 900;
}

.promo-container .loan-info .badge {
  font-size: 12px;
  color: #666666;
  position: absolute;
  bottom: -18px;
  left: 0;
  width: 100%;
}

.promo-container .loan-group .math-operator {
  font-size: 32px;
  font-weight: 500;
  color: #111111;
  padding: 0 10px;
}


.promo-container .card-black .benefit-title {
  font-size: 30px;
  font-weight: 700;
  color: #FFFFFF;
  margin: 0 0 12px 0;
  /* letter-spacing: -0.5px; */
}

.promo-container .card-black .benefit-desc {
  font-size: 30px;
  font-weight: 700;
  color: #FFFFFF;
  margin: 0;
  letter-spacing: -0.5px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
}

.promo-container .benefit-desc .highlight {
  background-color: #FFD400;
  color: #111111;
  padding: 4px 12px;
  border-radius: 4px;
  /* font-weight: 900; */
}

/* ë°˜ì‘í˜• ëª¨ë°”ì¼ ëŒ€ì‘ */
@media (max-width: 768px) {
  .promo-container .promo-header h2 { font-size: 28px; }
  .promo-container .promo-content .card-white { padding: 30px 20px; }
  .promo-container .card-white .loan-group { flex-direction: column;  gap: 20px;}
  .promo-container .loan-group .math-operator { transform: rotate(90deg); padding: 5px 0; }
  .promo-container .loan-group .loan-item { text-align: center; flex-direction: column; gap: 10px; }
  .promo-container .loan-info .badge { position: relative; bottom: 0; margin-top: 4px; }
  .promo-container .card-black .benefit-desc { flex-direction: column; gap: 8px; }
}  


.bmdnae-int-section { position: relative; overflow: hidden; padding: 100px 0 120px; color: #202020; background: #fffdee; word-break: keep-all; }
.bmdnae-int-heading { width: calc(100% - 40px); max-width: 1200px; margin: 0 auto 65px; text-align: center; }
.bmdnae-int-eyebrow { display: block; margin-bottom: 2px; font-size: 20px; font-weight: 900; letter-spacing: -0.03em; }
.bmdnae-int-title { margin: 0; font-weight: 900; line-height: 1; letter-spacing: -0.08em; }
.bmdnae-int-description { margin: 22px 0 0; line-height: 1.6; letter-spacing: -0.045em; }
.bmdnae-int-construction { margin-top: 32px; }
.bmdnae-int-construction-title { margin: 0 0 18px; font-size: clamp(24px, 2vw, 36px); font-weight: 900; letter-spacing: -0.055em; }
.bmdnae-int-construction-options { display: flex; justify-content: center; gap: 16px; }
.bmdnae-int-construction-option { display: flex; align-items: center; justify-content: center; gap: 13px; width: 250px; min-height: 58px; padding: 10px 25px; border-radius: 15px; font-size: clamp(19px, 1.5vw, 26px); font-weight: 900; letter-spacing: -0.04em; }
.bmdnae-int-construction-option--head { color: #fff; background: #202020; }
.bmdnae-int-construction-option--self { color: #202020; background: #ffd200; }
.bmdnae-int-construction-icon { font-size: 29px; font-weight: 400; line-height: 1; }
.bmdnae-int-slider { width: 100%; overflow: hidden; cursor: grab; user-select: none; touch-action: pan-y; }
.bmdnae-int-slider.bmdnae-int-slider--dragging { cursor: grabbing; }
.bmdnae-int-track { display: flex; gap: 30px; padding: 0 4.3vw; will-change: transform; }
.bmdnae-int-slide { flex: 0 0 min(50vw, 730px); aspect-ratio: 16 / 9; overflow: hidden; margin: 0; background: #e5e1d7; }
.bmdnae-int-slide img { display: block; width: 100%; height: 100%; object-fit: cover; pointer-events: none; }
.bmdnae-int-controls { display: flex; align-items: center; justify-content: center; gap: 16px; width: min(360px, calc(100% - 40px)); margin: 28px auto 0; }
.bmdnae-int-prev, .bmdnae-int-next { display: flex; align-items: center; justify-content: center; width: 42px; height: 42px; padding: 0; border: 1px solid rgba(32, 32, 32, 0.25); border-radius: 50%; color: #202020; background: rgba(255, 255, 255, 0.8); font-size: 19px; cursor: pointer; transition: color 0.2s, border-color 0.2s, background 0.2s; }
.bmdnae-int-prev:hover, .bmdnae-int-next:hover { border-color: #202020; color: #ffd200; background: #202020; }
.bmdnae-int-progress { position: relative; width: 170px; height: 3px; overflow: hidden; border-radius: 10px; background: rgba(32, 32, 32, 0.15); }
.bmdnae-int-progress-bar { position: absolute; inset: 0 auto 0 0; width: 25%; border-radius: inherit; background: #202020; transition: transform 0.35s ease; }

@media (max-width: 1204px) {
  .bmdnae-int-section { padding: 80px 0 100px; }
  .bmdnae-int-slide { flex-basis: 66vw; }
}

@media (max-width: 760px) {
  .bmdnae-int-section { padding: 58px 0 70px; }
  .bmdnae-int-heading { margin-bottom: 35px; }
  .bmdnae-int-eyebrow { font-size: 15px; }
  .bmdnae-int-title { font-size: 52px; }
  .bmdnae-int-description { max-width: 340px; margin: 18px auto 0; font-size: 16px; line-height: 1.55; }
  .bmdnae-int-description br { display: none; }
  .bmdnae-int-construction { margin-top: 26px; }
  .bmdnae-int-construction-title { max-width: 310px; margin: 0 auto 15px; font-size: 22px; line-height: 1.35; }
  .bmdnae-int-construction-options { gap: 8px; }
  .bmdnae-int-construction-option { gap: 7px; width: calc(50% - 4px); min-height: 50px; padding: 9px 10px; border-radius: 11px; font-size: 17px; }
  .bmdnae-int-construction-icon { font-size: 23px; }
  .bmdnae-int-track { gap: 12px; padding: 0 18px; }
  .bmdnae-int-slide { flex-basis: calc(100vw - 52px); aspect-ratio: 4 / 3; }
  .bmdnae-int-controls { margin-top: 20px; }
}



.bmd-sale { --bmd-yellow:#ffc900; --bmd-cream:#fffcf3; --bmd-black:#222218; --bmd-card-black:#202121; position:relative; width:100%; overflow:hidden; color:var(--bmd-black); background:var(--bmd-cream);}
.bmd-sale *, .bmd-sale *::before, .bmd-sale *::after { box-sizing:border-box; }

.bmd-sale__food { position:absolute; z-index:5; display:block; pointer-events:none; user-select:none; }
.bmd-sale__food--waffle { left:-45px; top:365px; width:clamp(190px,17vw,330px); transform:rotate(-5deg); transform-origin:center; }
.bmd-sale__food--tteok { top:65px; right:-135px; width:clamp(390px,29vw,570px); }

.bmd-sale__hero { position:relative; z-index:1; min-height:600px; padding:68px 24px; background:var(--bmd-cream); }
.bmd-sale__inner { width:min(1120px,100%); margin:0 auto; }
.bmd-sale__header { text-align:center; }
.bmd-sale__eyebrow { margin:0 0 18px; font-size:clamp(17px,1.35vw,26px); font-weight:800; letter-spacing:-0.04em; opacity:0; transform:translateY(15px); }

.bmd-sale__title { display:flex; flex-direction:column; gap:2px; margin:0; font-size:clamp(39px,3.7vw,70px); font-weight:900; line-height:1.2; }
.bmd-sale__title > span { opacity:0; transform:translateY(20px); }
.bmd-sale__title-main { display:block; font-weight:900; white-space:nowrap; opacity:0; transform:translateY(20px); }
.bmd-sale__title-main em { position:relative; display:inline-block; margin-right:4px; color:var(--bmd-yellow); font-size:1.36em; font-style:italic; font-weight:950;}
.bmd-sale__title-main em::after { content:""; position:absolute; right:1px; bottom:5px; left:7px; height:6px; border-radius:20px; background:var(--bmd-yellow); transform:scaleX(0); transform-origin:left; opacity:0.42; }

.bmd-sale__counter-area { width:min(1010px,100%); margin:62px auto 0; }
.bmd-sale__counter-label { margin:0 0 16px 8px; font-size:clamp(13px,1vw,18px); font-weight:800; letter-spacing:-0.04em; opacity:0; transform:translateY(12px); }
.bmd-sale__counter-row { display:flex; align-items:flex-end; justify-content:center; gap:13px; }
.bmd-sale__counter { display:flex; align-items:center; justify-content:center; gap:clamp(4px,0.42vw,8px); perspective:1000px; }

.bmd-flip { position:relative; display:grid; place-items:center; width:clamp(66px,6.1vw,112px); height:clamp(94px,8.8vw,158px); overflow:hidden; border:4px solid #0a0b0b; border-radius:15px; color:#fff; background:linear-gradient(180deg,rgba(255,255,255,.08),transparent 25%),linear-gradient(180deg,#242525 0%,#1d1e1e 49%,#161717 50%,#202121 100%); box-shadow:inset 0 0 0 2px rgba(255,255,255,.08),inset 0 -16px 24px rgba(0,0,0,.24),0 4px 7px rgba(0,0,0,.25); font-size:clamp(65px,7.2vw,132px); font-weight:950; line-height:1; letter-spacing:-0.07em; font-variant-numeric:tabular-nums; opacity:0; transform:translateY(25px) scale(.94); }
.bmd-flip::before { content:""; position:absolute; z-index:2; top:calc(50% - 1px); right:0; left:0; height:3px; background:#080909; box-shadow:0 1px rgba(255,255,255,.07); }
.bmd-flip::after { content:""; position:absolute; z-index:3; top:42%; left:-2px; width:calc(100% + 4px); height:16%; background:linear-gradient(90deg,#080909 0 5%,transparent 5% 95%,#080909 95%); pointer-events:none; }
.bmd-flip__value { display:block; text-shadow:0 3px 1px rgba(0,0,0,.38); transform-origin:center; }
.bmd-flip.is-changing .bmd-flip__value { animation:bmdFlipValue 90ms ease-in-out; }
.bmd-flip-comma { align-self:flex-end; margin:0 2px 10px; font-size:clamp(64px,7vw,126px); font-weight:950; line-height:.65; opacity:0; transform:translateY(15px); }

.bmd-sale__counter-unit { margin-bottom:17px; font-size:clamp(26px,3vw,54px); font-weight:900; line-height:1; opacity:0; transform:translateX(-12px); }

.bmd-sale__summary { position:relative; z-index:2; padding:31px 24px 45px; background:var(--bmd-yellow); }
.bmd-sale__summary-inner { width:min(1230px,100%); margin:0 auto; }
.bmd-sale__summary-title {font-family:'PaperoziR'; margin:0 0 34px; text-align:center; font-size:clamp(23px,2.15vw,32px); line-height:1.3; opacity:0; transform:translateY(20px); }
.bmd-sale__summary-title strong { font-weight:950; }
.bmd-sale__summary-content { display:grid; grid-template-columns:minmax(0,3fr) minmax(280px,1.15fr); align-items:center; gap:38px; }

.bmd-sale__cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.bmd-sale-card { overflow:hidden; border:1px solid rgba(23,24,24,.65); border-radius:15px; background:#fff; box-shadow:0 7px 18px rgba(50,39,0,.08); opacity:0; transform:translateY(28px); }
.bmd-sale-card__head { display:flex; align-items:center; justify-content:space-between; min-height:50px; padding:10px 18px; color:var(--bmd-yellow); background:var(--bmd-card-black); }
.bmd-sale-card__head strong { font-size:clamp(12px,1vw,16px); font-weight:850; letter-spacing:-0.04em; }
.bmd-sale-card__head span { font-size:10px; font-weight:800; }
.bmd-sale-card__body { display:flex; align-items:flex-end; justify-content:center; min-height:84px; padding:13px 10px 15px; line-height:1; }
.bmd-sale-card__number { font-size:clamp(29px,2.65vw,49px); font-weight:950; letter-spacing:-0.065em; font-variant-numeric:tabular-nums; }
.bmd-sale-card__body > span { margin:0 0 4px 3px; font-size:clamp(13px,1.2vw,21px); font-weight:850; }

.bmd-sale__ratio { display:grid; grid-template-columns:minmax(120px,1fr) 150px; align-items:center; gap:22px; }
.bmd-sale__ratio-list { display:grid; gap:13px; margin:0; padding:0; list-style:none; }
.bmd-sale__ratio-list li { display:flex; align-items:center; opacity:0; transform:translateX(15px); }
.bmd-sale__ratio-list span, .bmd-sale__ratio-list strong { font-size:clamp(14px,1.05vw,18px); font-weight:900; white-space:nowrap; }
.bmd-sale__ratio-list i { flex:1; min-width:25px; margin:0 7px; border-top:2px dotted rgba(34,34,24,.7); }

.bmd-sale__chart { position:relative; width:150px; aspect-ratio:1; border:1px solid var(--bmd-black); border-radius:50%; background:conic-gradient(from 180deg,#fff 0% 43.2%,#ffd845 43.2% 68.9%,#ff9d00 68.9% 100%); box-shadow:0 8px 18px rgba(73,51,0,.08); opacity:0; transform:rotate(-55deg) scale(.7); }
.bmd-sale__chart::after { content:""; position:absolute; z-index:2; top:50%; left:50%; width:45px; aspect-ratio:1; border:1px solid var(--bmd-black); border-radius:50%; background:var(--bmd-yellow); transform:translate(-50%,-50%); }
.bmd-sale__chart-label { position:absolute; z-index:3; font-size:12px; font-weight:900; line-height:1; white-space:nowrap; transform:translate(-50%,-50%); }
.bmd-sale__chart-label--coffee { top:57%; left:20%; }
.bmd-sale__chart-label--dessert { top:22%; left:64%; }
.bmd-sale__chart-label--meal { top:69%; left:75%; }

.bmd-sale.is-active .bmd-sale__eyebrow { animation:bmdFadeUp .5s ease-out forwards; }
.bmd-sale.is-active .bmd-sale__title > span { animation:bmdFadeUp .55s .12s ease-out forwards; }
.bmd-sale.is-active .bmd-sale__title-main { animation:bmdFadeUp .6s .24s ease-out forwards; }
.bmd-sale.is-active .bmd-sale__title-main em::after { animation:bmdDrawLine .55s .72s ease-out forwards; }
.bmd-sale.is-active .bmd-sale__counter-label { animation:bmdFadeUp .45s .55s ease-out forwards; }
.bmd-sale.is-active .bmd-flip { animation:bmdDigitEnter .48s ease-out forwards; animation-delay:var(--digit-delay); }
.bmd-sale.is-active .bmd-flip-comma { animation:bmdFadeUp .4s .85s ease-out forwards; }
.bmd-sale.is-active .bmd-sale__counter-unit { animation:bmdUnitIn .4s 1.6s ease-out forwards; }
.bmd-sale.is-active .bmd-sale__summary-title { animation:bmdFadeUp .55s 1.35s ease-out forwards; }
.bmd-sale.is-active .bmd-sale-card { animation:bmdCardIn .65s ease-out forwards; }
.bmd-sale.is-active .bmd-sale-card:nth-child(1) { animation-delay:1.55s; }
.bmd-sale.is-active .bmd-sale-card:nth-child(2) { animation-delay:1.72s; }
.bmd-sale.is-active .bmd-sale-card:nth-child(3) { animation-delay:1.89s; }
.bmd-sale.is-active .bmd-sale__ratio-list li { animation:bmdRatioIn .45s ease-out forwards; }
.bmd-sale.is-active .bmd-sale__ratio-list li:nth-child(1) { animation-delay:2.05s; }
.bmd-sale.is-active .bmd-sale__ratio-list li:nth-child(2) { animation-delay:2.17s; }
.bmd-sale.is-active .bmd-sale__ratio-list li:nth-child(3) { animation-delay:2.29s; }
.bmd-sale.is-active .bmd-sale__chart { animation:bmdChartIn .8s 2.08s cubic-bezier(.2,.9,.3,1.15) forwards; }

@keyframes bmdFadeUp { to { opacity:1; transform:translateY(0); } }
@keyframes bmdDrawLine { to { transform:scaleX(1); } }
@keyframes bmdDigitEnter { to { opacity:1; transform:translateY(0) scale(1); } }
@keyframes bmdFlipValue { 0% { transform:rotateX(0); } 45% { transform:rotateX(-75deg); filter:brightness(.65); } 55% { transform:rotateX(70deg); filter:brightness(.75); } 100% { transform:rotateX(0); } }
@keyframes bmdUnitIn { to { opacity:1; transform:translateX(0); } }
@keyframes bmdCardIn { 0% { opacity:0; transform:translateY(28px); } 70% { opacity:1; transform:translateY(-5px); } 100% { opacity:1; transform:translateY(0); } }
@keyframes bmdRatioIn { to { opacity:1; transform:translateX(0); } }
@keyframes bmdChartIn { 0% { opacity:0; transform:rotate(-55deg) scale(.7); } 100% { opacity:1; transform:rotate(0) scale(1); } }

@media (max-width:1180px) {
  .bmd-sale__food--tteok { right:-210px; opacity:.92; }
  .bmd-sale__food--waffle { left:-110px; }
  .bmd-sale__summary-content { grid-template-columns:1fr; }
  .bmd-sale__ratio { width:min(480px,100%); margin:0 auto; }
}

@media (max-width:850px) {
  .bmd-sale__hero { min-height:auto; padding:48px 18px 55px; }
  .bmd-sale__title-main { white-space:normal; }
  .bmd-sale__counter-area { margin-top:34px; }
  .bmd-sale__counter { gap:3px; }
  .bmd-flip { width:clamp(38px,10vw,68px); height:clamp(58px,15vw,102px); border-width:2px; border-radius:8px; font-size:clamp(38px,11vw,72px); }
  .bmd-flip-comma { margin:0 0 6px; font-size:clamp(38px,10vw,70px); }
  .bmd-sale__counter-unit { margin-bottom:8px; font-size:23px; }
  .bmd-sale__cards { grid-template-columns:1fr; width:min(440px,100%); margin:0 auto; }
  .bmd-sale-card__number { font-size:42px; }
  .bmd-sale__food--waffle { top:390px; left:-100px; width:130px; opacity:1; }
  .bmd-sale__food--tteok { top:-70px; right:-80px; width:160px; opacity:1; }
}

@media (max-width:540px) {
  .bmd-sale__hero { padding-top:40px; }
  .bmd-sale__eyebrow { margin-bottom:13px; font-size:14px; }
  .bmd-sale__title { font-size:34px; }
  .bmd-sale__title-main { font-size:31px; }
  .bmd-sale__counter-row { gap:5px; }
  .bmd-sale__counter { gap:2px; }
  .bmd-flip { width:38px; height:63px; font-size:43px; }
  .bmd-flip-comma { font-size:42px; }
  .bmd-sale__counter-unit { margin-left:-2px; font-size:18px; }
  .bmd-sale__summary { padding:27px 16px 55px; }
  .bmd-sale__summary-title { margin-bottom:25px; font-size:23px; }
  .bmd-sale__ratio { grid-template-columns:1fr 125px; gap:14px; }
  .bmd-sale__chart { width:125px; }
  .bmd-sale__chart::after { width:37px; }
  .bmd-sale__chart-label { font-size:10px; }
  .bmd-sale__chart-label--coffee { top:57%; left:20%; }
  .bmd-sale__chart-label--dessert { top:22%; left:64%; }
  .bmd-sale__chart-label--meal { top:69%; left:75%; }
}

@media (prefers-reduced-motion:reduce) {
  .bmd-sale *, .bmd-sale *::before, .bmd-sale *::after { animation-duration:.01ms !important; animation-delay:0ms !important; animation-iteration-count:1 !important; }
}  