
.hl{
  --hl-ink:#2A2226;
  --hl-soft:#5E5258;
  --hl-rose:#963358;
  --hl-rose-soft:#F6E9EE;
  --hl-gold:#B8955A;
  --hl-gold-d:#7E6233;
  --hl-kinari:#F7F1E6;
  --hl-serif:"Shippori Mincho","Noto Serif JP","Hiragino Mincho ProN","Yu Mincho","YuMincho","Noto Serif CJK JP",serif;
  --hl-sans:"Noto Sans JP","Hiragino Sans","Hiragino Kaku Gothic ProN","Yu Gothic","YuGothic","Noto Sans CJK JP",sans-serif;

  margin:0 0 32px;padding:22px 16px 18px;border-radius:18px;
  background:var(--washi,none),var(--hl-kinari);color:var(--hl-ink);font-family:var(--hl-sans);
  box-shadow:inset 0 0 0 1px rgba(184,149,90,.45);
}
.hl *,.hl *::before,.hl *::after{box-sizing:border-box}
@media (min-width:768px){.hl{padding:30px 30px 24px}}


.hl__head{margin:0 0 16px}
.hl__kicker{display:inline-flex;align-items:center;gap:10px;margin:0;font-family:var(--hl-serif);font-size:12px;letter-spacing:.3em;color:var(--hl-gold-d)}
.hl__kicker::after{content:"";width:32px;height:1px;background:var(--hl-gold)}
.hl__title{margin:8px 0 0;font-family:var(--hl-serif);font-weight:600;font-size:clamp(19px,5vw,24px);line-height:1.55;letter-spacing:.08em;color:var(--hl-ink);word-break:auto-phrase;text-wrap:balance}
.hl__lead{margin:8px 0 0;font-size:14px;line-height:1.9;color:var(--hl-soft);word-break:auto-phrase}


.hl__list{display:grid;gap:10px;margin:0;padding:0;list-style:none}
@media (min-width:600px){.hl__list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1024px){.hl__list--4{grid-template-columns:repeat(4,minmax(0,1fr))}.hl__list--3{grid-template-columns:repeat(3,minmax(0,1fr))}}


.hl__card{position:relative;display:flex;flex-direction:column;height:100%;padding:16px 16px 14px;border-radius:14px;
  background:#fff;color:inherit;text-decoration:none;
  box-shadow:0 8px 20px -16px rgba(42,34,38,.25),inset 0 0 0 1px rgba(184,149,90,.35);transition:box-shadow .3s,transform .3s}
a.hl__card:hover{box-shadow:0 12px 26px -16px rgba(110,34,64,.28),inset 0 0 0 1px var(--hl-gold);transform:translateY(-1px)}
a.hl__card:focus-visible{outline:2px solid var(--hl-gold);outline-offset:3px}

.hl__card--public{box-shadow:0 8px 20px -16px rgba(42,34,38,.25),inset 0 0 0 1px rgba(184,149,90,.35),inset 3px 0 0 var(--hl-rose)}

.hl__badges{display:flex;flex-wrap:wrap;gap:5px;margin:0 0 8px;padding:0;list-style:none}
.hl__badge{display:inline-block;padding:2px 9px;border-radius:999px;font-size:11px;font-weight:600;letter-spacing:.08em;line-height:1.7;
  color:var(--hl-gold-d);background:#fff;box-shadow:inset 0 0 0 1px rgba(184,149,90,.7)}
.hl__badge--public{color:#fff;background:var(--hl-rose);box-shadow:none}
.hl__badge--shitei{color:var(--hl-rose);background:var(--hl-rose-soft);box-shadow:inset 0 0 0 1px rgba(150,51,88,.35)}

.hl__name{margin:0;font-family:var(--hl-serif);font-weight:600;font-size:17px;line-height:1.5;letter-spacing:.06em;color:var(--hl-ink)}
.hl__area{margin:2px 0 0;font-size:12px;letter-spacing:.04em;color:var(--hl-soft)}
.hl__note{margin:10px 0 0;padding-top:9px;border-top:1px dashed rgba(184,149,90,.45);font-size:13px;line-height:1.75;color:var(--hl-ink);word-break:auto-phrase}
.hl__note b{font-weight:600;color:var(--hl-rose)}
.hl__go{margin-top:auto;padding-top:10px;font-size:13px;font-weight:600;letter-spacing:.04em;color:var(--hl-rose)}
.hl__go--none{color:var(--hl-soft);font-weight:400}


.hl__foot{margin:14px 0 0;font-size:12px;line-height:1.8;color:var(--hl-soft)}

@media (prefers-reduced-motion:reduce){.hl__card{transition:none}a.hl__card:hover{transform:none}}


.prose .hl .hl__title{border-left:0;padding-left:0;margin:0}
