/* 오늘 운림산방 날씨 캡슐 */
.wx{position:relative;z-index:30}
.band .wx{position:absolute;top:50%;right:max(var(--g),calc((100% - var(--wrap)) / 2 + var(--g)));translate:0 -50%;animation:wxin .9s var(--ease) .5s both}
@keyframes wxin{from{opacity:0;transform:translateX(16px)}to{opacity:1;transform:none}}
.wx-cap{display:flex;align-items:stretch;border-radius:999px;background:#fff;box-shadow:0 12px 26px -12px rgba(0,0,0,.55);overflow:hidden;text-align:left;transition:transform .4s var(--ease),box-shadow .4s}
.wx-cap:hover{transform:translateY(-2px);box-shadow:0 18px 30px -14px rgba(0,0,0,.6)}
.wx-l{display:flex;align-items:center;justify-content:center;width:58px;background:var(--navy2);color:var(--ylw);border-right:4px solid rgba(255,255,255,.8);transition:background .4s}
.wx.wet .wx-l{background:var(--blue);color:#fff}
.wx-i{width:30px;height:30px;animation:wxbob 3s ease-in-out infinite}
@keyframes wxbob{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
.wx-r{display:flex;flex-direction:column;justify-content:center;padding:8px 18px 8px 12px;line-height:1.25;min-width:150px}
.wx-r small{font-size:11.5px;font-weight:800;color:var(--pink)}
.wx-r b{font-family:'BHS';font-weight:400;font-size:19px;color:var(--navy);margin:1px 0}
.wx-r em{font-style:normal;font-size:12px;font-weight:700;color:var(--mute)}
.wx.wet .wx-r em{color:#C8205C}
.wx-pop{position:absolute;right:0;top:calc(100% + 10px);width:300px;background:#fff;border-radius:20px;box-shadow:var(--sh);padding:18px;color:var(--ink);text-align:left;animation:wxpop .35s var(--ease)}
.wx-pop[hidden]{display:none}
@keyframes wxpop{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.wx-pop h3{font-weight:800;font-size:15px;color:var(--navy);margin-bottom:8px}
.wx-pop li{display:grid;grid-template-columns:38px 26px 1fr auto;gap:2px 8px;align-items:center;padding:9px 0;font-size:14px;border-top:1px dashed rgba(20,49,94,.18)}
.wx-pop li>span:first-child{font-weight:800;color:var(--navy)}
.wx-pop .wx-s{width:24px;height:24px;color:var(--navy)}
.wx-pop li.w .wx-s{color:var(--blue)}
.wx-pop .tp{font-weight:700;color:var(--navy)}
.wx-pop .pr{grid-column:3/-1;font-size:12.5px;color:var(--mute)}
.wx-pop li.w .pr{color:#C8205C;font-weight:700}
.wx-pop .nt{margin-top:10px;font-size:13px;color:#3B4152;background:var(--cream);border-radius:12px;padding:10px 12px}
.wx-pop .nt.w{background:rgba(44,116,201,.1);color:#1F4E8C}
.wx-pop .src{margin-top:8px;font-size:11.5px;color:var(--mute)}
.wx-pop .src a{color:var(--blue);font-weight:700;text-decoration:underline;text-underline-offset:3px}
.wx-m{display:none}
@media (max-width:900px){
  .band .wx{display:none}
  .wx-m{display:block;position:relative;height:0;z-index:30}
  .wx-m .wx{position:absolute;top:14px;right:var(--g)}
  .wx-m~main .hero,.wx-m~main .sub-hero{padding-top:78px}
  .wx-m~main .vtop{padding-top:92px!important}
  .wx-l{width:46px}.wx-i{width:24px;height:24px}
  .wx-r{min-width:0;padding:6px 14px 6px 10px}
  .wx-r b{font-size:16px}
  .wx-pop{width:min(300px,calc(100vw - 32px))}
}
@media (prefers-reduced-motion:reduce){.wx-i{animation:none}}