/* reset */
* { box-sizing:border-box; margin:0; padding:0; }
body { font-family:"Pretendard",-apple-system,BlinkMacSystemFont,"Noto Sans KR",system-ui,sans-serif; /*background:#f5f5f5;*/ color:#151515; line-height:1.6; }


/* 레이아웃 */
main { max-width:900px; margin:0 auto; /*padding:20px 16px 40px;*/ letter-spacing:-0.03em; }


/* 메인 비주얼 */
.main { margin-bottom:2px; overflow:hidden; }
.main img { display:block; width:100%; height:100%; object-fit:cover; }


 /* 탭 */
/*.tabs { display:flex;  flex-wrap:wrap; gap:2px; margin-bottom:20px; align-items:stretch; }*/

.tabs { display:flex;  flex-wrap:wrap; gap:2px; margin-bottom:20px; align-items:stretch; 
        position: -webkit-sticky; position: sticky; top: 0; z-index: 100; background: #fff;}
 

.tab { flex:1 0 calc(100% / 4 - 2px); border:none; padding:8px 6px; font-size:18px; cursor:pointer; background:#eee; color:#151515; transition:background .18s ease,color .18s ease; display: flex;align-items: center;justify-content: center;height: 3.5rem; line-height: 1.3; }
.tab.is-active { background:#f2ebb6; color:#075946; }

 
/* 패널 */
.panel { display:none; }
.panel.is-active { display:block; }
 

/* 카드 그리드 */
.grid { display:grid; grid-template-columns:1fr; gap:10px; }

 
/* 카드 */
.card { background:#fff; padding:20px; border:1px solid #e5e5e5; display:flex; flex-direction:column; line-height:1.3;}


/* 카드 사이 설명 박스 */
.highlight-box { grid-column:1 / -1; background:#f2ebb6; padding:10px 12px; font-size:18px; color:#075946 }
.highlight-text { font-size:20px; line-height:1.5; font-weight: 600;}

.highlight-box2 { grid-column:1 / -1; background:#eee; padding:10px 12px; font-size:18px; color:#151515; }
.highlight-text2 { font-size:16px; line-height:1.5; }


/* 텍스트 */
.note { font-size:16px; color:#7a7a7a; }
.name { font-size:20px; font-weight:700; margin:5px 0 5px; }  
.sub { font-size:13px; color:#858585; }
.package-note { font-size:13px; color:#858585; margin-top:10px; }

/* 가격 */
.price { margin-top:6px; text-align:right; }
.price-original { display:block; font-size:15px; color:#858585; text-decoration:line-through; }
.price-sale { font-size:23px; font-weight:700; color:#075946; }
.price-unit { font-size:16px; margin-left:2px; color:#151515; }
.sub-right {font-size: 13px;color: #858585;margin-right: 5px;}


/* 퀵메뉴 */
.floating-box { position:fixed; right:16px; bottom:20px; display:flex; flex-direction:column; gap:6px; z-index:100; }
.floating-btn { border:none; display:inline-flex; align-items:center; justify-content:center; min-width:33.33px; padding:8px 20px; font-size:20px; border-radius:999px; cursor:pointer; box-shadow:0 10px 20px -16px rgba(15,23,42,.8); text-decoration:none; font-weight:500; gap:8px; }


/* 아이콘 */
.btn-icon { width:20px; height:20px; object-fit:contain; flex-shrink:0; display:block; }


/* 개별 색상 */
.naver { background:#00da0f; color:#fff; }
.kakao { background:#fee500; color:#151515; }
.call { background:#151515; color:#fff; }
.top { background:#000; color:#fff; }


/* 안내 문구 */
.notice-box { margin:20px 0; font-size:11px; color:#858585; /*background:#fff; border-radius:12px;*/ padding:12px 16px; text-align:center; }


/* 모바일 */
@media (max-width:640px) {
  main { /*padding:10px 10px 80px;*/ padding-bottom:80px; }

  .tabs { flex-wrap:wrap; gap:2px; margin-bottom:0px; }
  .tab { padding:8px 4px; font-size:13px;height: 3rem; }
  
  .panel { padding:10px; }

  /* 가격 */
  .price { margin-top:3px; }
  .price-original { font-size:16px; }
  .price-sale { font-size:25px; }

  .floating-box { position:fixed; left:0; right:0; bottom:0; transform:none; flex-direction:row; justify-content:space-between; gap:0px; display: flex; }
  .floating-btn { flex:1; min-width:0; font-size:16px; padding:15px 4px; text-align:center; box-shadow:none; border-radius:0px; }

  .naver, .kakao, .call { flex:2; }
  .top { flex:1; }

}