/* PC 왼쪽 패널 정보 카드 (2026-10-28) — asset/css/ibm.left.css  · 디자인 시스템 토큰만 사용 */
.ibm-left{display:flex;flex-direction:column;gap:10px;font-family:var(--ibm-font-body,"Pretendard","Malgun Gothic",sans-serif);letter-spacing:-.3px;color:var(--ibm-ink,#111)}
.ibm-left:empty{display:none}
.ibm-left *{box-sizing:border-box}
.ibl-top{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.ibl-slot:empty{display:none}
.ibl-top .ibl-slot:only-child,.ibl-slot.ibl-wide{grid-column:1 / -1}
.ibl-card,a.ibl-card,a.ibl-card:link,a.ibl-card:visited{display:flex;flex-direction:column;gap:4px;height:100%;padding:14px 16px;border-radius:14px;background:var(--ibm-white,#fff);border:1px solid var(--ibm-gray-200,#ececec);box-shadow:0 1px 2px rgba(0,0,0,.04);color:var(--ibm-ink,#111);text-decoration:none;transition:border-color .15s,opacity .22s}
a.ibl-card:hover{border-color:var(--ibm-gray-300,#d4d4d4)}
.ibl-card.is-fade{opacity:0}
.ibl-k{font-size:12.5px;font-weight:700;color:var(--ibm-gray-700,#555)}
.ibl-cnt{font-style:normal;font-weight:600;color:var(--ibm-gray-500,#767676);margin-left:4px}
.ibl-sub{font-size:12px;line-height:1.45;color:var(--ibm-gray-500,#767676);word-break:keep-all}
.ibl-price{font-size:18px;font-weight:800;color:var(--ibm-brand-strong,#d93b33);letter-spacing:-.4px}
.ibl-name{font-size:14.5px;font-weight:800;line-height:1.35;word-break:keep-all;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.ibl-go{margin-top:auto;padding-top:4px;font-size:12.5px;font-weight:800;color:var(--ibm-ink,#111)}
/* 결항 예측 */
.ibl-wx__st{display:inline-flex;align-items:center;gap:6px;font-size:17px;font-weight:800}
.ibl-wx__st i{width:10px;height:10px;border-radius:50%;background:var(--ibm-gray-300,#d4d4d4);flex:0 0 auto}
.ibl-wx__st.lv-GOOD i{background:var(--ibm-ok,#177a4c)}
.ibl-wx__st.lv-CAUTION i{background:var(--ibm-warn,#b7791f)}
.ibl-wx__st.lv-RISK i,.ibl-wx__st.lv-HIGH i{background:var(--ibm-danger,#d32f2f)}
.ibl-wx__st.lv-HIGH{color:var(--ibm-danger,#d32f2f)}
/* 환율 */
.ibl-fx__v{font-size:18px;font-weight:800}
/* 사진 카드 (단톡특가 호텔 · 추천 투어) */
.ibl-deal,.ibl-tour{min-height:100%}
.ibl-ph{position:relative;display:block;width:100%;height:92px;border-radius:10px;overflow:hidden;background:var(--ibm-gray-100,#f6f6f6);margin:2px 0 4px}
.ibl-ph img{width:100%;height:100%;object-fit:cover;display:block}
.ibl-badge{position:absolute;left:8px;top:8px;padding:2px 7px;border-radius:6px;background:var(--ibm-brand-strong,#d93b33);color:#fff;font-size:12px;font-weight:800}
/* 최근 본 상품 */
.ibl-recent{display:flex;flex-direction:column;gap:8px;margin-top:2px}
.ibl-recent a,.ibl-recent a:link,.ibl-recent a:visited{display:flex;align-items:center;gap:10px;color:var(--ibm-ink,#111);text-decoration:none;font-size:13px;font-weight:700;line-height:1.35}
.ibl-recent a span:last-child{overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;word-break:keep-all}
.ibl-rph{flex:0 0 52px;width:52px;height:52px;border-radius:10px;overflow:hidden;background:var(--ibm-gray-100,#f6f6f6)}
.ibl-rph img{width:100%;height:100%;object-fit:cover;display:block}
/* QR */
.ibl-qr{flex-direction:row;gap:12px}
.ibl-qr figure{flex:1 1 0;min-width:0;margin:0;display:flex;align-items:center;gap:10px}
.ibl-qr__img{flex:0 0 76px;width:76px;height:76px;padding:4px;border-radius:10px;border:1px solid var(--ibm-gray-200,#ececec);background:#fff}
.ibl-qr__img svg{width:100%;height:100%;display:block}
.ibl-qr__img--k{border-color:#fee500;box-shadow:inset 0 0 0 2px #fee500}
.ibl-qr figcaption{display:flex;flex-direction:column;gap:2px;min-width:0}
.ibl-qr figcaption b{font-size:13px;font-weight:800;line-height:1.3;word-break:keep-all}
.ibl-qr figcaption small{font-size:12px;line-height:1.4;color:var(--ibm-gray-500,#767676);word-break:keep-all}
/* 배너가 패널 높이를 다 차지하지 않게 : 공간이 남으면 카드는 아래쪽, 모자라면 배너 바로 아래로 */
.wrapper-box .wrapper-left .left-body{flex:0 0 auto;height:auto}
.wrapper-box .wrapper-left .left-foot{margin-top:auto;padding-top:16px}
.ibl-card{padding:12px 14px}
@media (max-width:1023px){.ibm-left{display:none}}
/* 2026-10-28 카드가 하나만 있으면 한 줄 전체 사용 */
.ibl-top{display:flex!important;gap:10px}
.ibl-top>.ibl-slot{flex:1 1 0;min-width:0}
.ibl-top>.ibl-slot:empty{display:none}
/* 2026-10-29 호텔 탭 : 환율 카드가 옆 단톡특가 카드 높이만큼 늘어나 아래가 비던 것 → 환율은 위쪽 한 줄 띠, 단톡특가는 그 아래 전체 폭.
   선박 탭(결항 예측·최저가)은 두 카드 내용 높이가 비슷해 나란히 같은 높이 유지 */
.ibl-top:has(.ibl-fx){flex-wrap:wrap}
.ibl-top>.ibl-slot:has(>.ibl-fx){flex:1 1 100%}
.ibl-card.ibl-fx{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:10px;row-gap:2px;height:auto}
.ibl-card.ibl-fx .ibl-k{grid-column:1;grid-row:1}
.ibl-card.ibl-fx .ibl-sub{grid-column:1;grid-row:2}
.ibl-card.ibl-fx .ibl-fx__v{grid-column:2;grid-row:1 / span 2;white-space:nowrap}
.ibl-top:has(.ibl-fx) .ibl-deal .ibl-ph{height:120px}
/* 2026-10-29 PC 왼쪽 패널 : 화면 높이가 낮으면 아래 카드·QR 이 잘리던 것 → 배너가 남는 높이만큼만 정사각형으로 줄어듦 */
@media (min-width:1024px){
.wrapper-box .wrapper-left .left-head{flex:0 0 auto;margin:12px 0 0}
.wrapper-box .wrapper-left .left-body{flex:1 1 0!important;min-height:140px;height:auto;margin:16px 0 0;display:flex;justify-content:center;align-items:flex-start}
.wrapper-box .wrapper-left .left-body .swiper-container{height:100%;aspect-ratio:1 / 1;width:auto;max-width:100%;margin:0 auto}
.wrapper-box .wrapper-left .left-foot{flex:0 0 auto;margin:12px 0 16px;padding-top:0}
}