@charset "UTF-8";
/* ===================================================================
   ニュースページ
   共通トークンは style.css、見出し帯は page.css を継承
   =================================================================== */

.news-page [hidden]{display:none !important;}

/* ============ カテゴリのしぼり込み ============ */
.news-filter{
  display:flex;align-items:flex-start;gap:18px;flex-wrap:nowrap;
  margin:clamp(40px,5vw,56px) 0 0;padding-bottom:22px;
  border-bottom:1px solid var(--line);
}
.news-filter__label{
  /* ラベルの幅を固定して、ボタンが下に落ちないようにする */
  flex:0 0 62px;margin:0;padding-top:7px;
  font-family:var(--serif);font-weight:600;
  font-size:12.5px;letter-spacing:.14em;color:var(--ink-soft);white-space:nowrap;
}
.news-filter__list{
  flex:1 1 auto;min-width:0;
  display:flex;flex-wrap:wrap;gap:7px;margin:0;padding:0;list-style:none;
}
.news-filter__btn{
  display:inline-flex;align-items:center;gap:6px;
  padding:6px 15px;border:1px solid var(--gold-soft);border-radius:999px;
  background:#fff;cursor:pointer;
  font-family:var(--serif);font-size:13px;letter-spacing:.06em;color:var(--ink);
  transition:background .28s var(--ease),color .28s var(--ease),border-color .28s;
}
.news-filter__btn span{font-family:var(--sans);font-size:11px;color:var(--gold);transition:color .28s;}
.news-filter__btn:hover{background:var(--washi-deep);border-color:var(--gold);}
.news-filter__btn.is-active{background:var(--enji);border-color:var(--enji);color:#fff;}
.news-filter__btn.is-active span{color:rgba(255,255,255,.75);}

/* ============ 記事一覧 ============ */
.news-list{list-style:none;margin:0;padding:0;}
.news-item{border-bottom:1px solid var(--line);}
.news-item__link{
  display:flex;align-items:flex-start;gap:clamp(18px,3vw,40px);
  padding:26px 8px;transition:background .3s var(--ease);
}
.news-item__link:hover{background:rgba(239,231,216,.34);}
.news-item__meta{
  flex:0 0 clamp(120px,15%,160px);
  display:flex;flex-direction:column;align-items:flex-start;gap:9px;padding-top:2px;
}
.news-item__meta > time{width:100%;}
.news-item__meta time{
  font-family:var(--serif);font-size:13px;letter-spacing:.08em;color:var(--ink-soft);
}
.news-cat{
  display:inline-block;padding:3px 11px;border-radius:2px;
  font-size:11px;font-weight:700;letter-spacing:.06em;color:#fff;white-space:nowrap;
}
.news-cat--notice{background:var(--navy);}
.news-cat--shop{background:var(--enji);}
.news-cat--campaign{background:#c0562a;}
.news-cat--fair{background:#2f7a68;}
.news-cat--takeout{background:var(--gold);}

.news-item__text{flex:1 1 auto;min-width:0;}
.news-item__title{
  margin:0 0 10px;font-family:var(--serif);font-weight:700;
  font-size:clamp(16px,1.7vw,19px);line-height:1.7;letter-spacing:.04em;color:var(--ink);
}
.news-item__body{
  margin:0;font-size:13.5px;line-height:1.95;letter-spacing:.03em;color:#5a5348;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.news-item__more{
  flex:none;align-self:center;
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--serif);font-size:12.5px;letter-spacing:.08em;color:var(--enji);white-space:nowrap;
}

.news-empty{
  margin:40px 0 0;padding:26px;text-align:center;
  font-size:13.5px;color:var(--ink-soft);letter-spacing:.04em;
}

/* ============ ページ送り ============ */
.news-pager{
  display:flex;align-items:center;justify-content:center;gap:16px;
  margin:clamp(36px,5vw,50px) 0 0;
}
.news-pager__current{
  width:34px;height:34px;border-radius:50%;background:var(--enji);color:#fff;
  display:inline-flex;align-items:center;justify-content:center;
  font-size:13px;font-weight:700;
}
.news-pager__note{font-size:12px;color:var(--ink-soft);letter-spacing:.04em;}

/* ============ スマホ ============ */
@media (max-width:768px){
  .news-filter{flex-direction:column;align-items:flex-start;gap:10px;margin-top:32px;}
  .news-item__link{flex-direction:column;gap:10px;padding:20px 4px;}
  .news-item__meta{flex:none;flex-direction:row;align-items:flex-start;gap:10px;}
  .news-item__meta > time{width:auto;padding-top:2px;}
  .news-item__title{font-size:16px;}
  .news-item__body{-webkit-line-clamp:3;}
  .news-item__more{align-self:flex-start;}
}

/* ============ 2段目（業態）のしぼり込み ============ */
.news-filter--sub{
  margin-top:0;padding-top:16px;
  border-top:1px dashed rgba(221,211,194,.9);
}
.news-filter--sub .news-filter__btn.is-active{
  background:var(--navy);border-color:var(--navy);
}
.news-filter--sub .news-filter__btn.is-active span{color:rgba(255,255,255,.75);}

/* ============ 記事につく業態の札 ============ */
/* カテゴリと業態の札は縦に積む */
.news-item__badges{display:flex;flex-direction:column;align-items:flex-start;gap:6px;}
.news-brand{
  display:inline-block;padding:2px 10px;border-radius:2px;
  border:1px solid var(--gold-soft);background:#fff;
  font-size:11px;font-weight:700;letter-spacing:.06em;color:#8a7440;white-space:nowrap;
}
.news-brand--haresushi{border-color:#0E4C8A;color:#0E4C8A;}
.news-brand--kaito{border-color:var(--enji);color:var(--enji);}
.news-brand--seajack{border-color:#2f7a68;color:#2f7a68;}
.news-brand--sushibiyori{border-color:#c0562a;color:#c0562a;}
.news-brand--kanta{border-color:var(--navy);color:var(--navy);}
.news-brand--hyotan{border-color:#6b6b6b;color:#6b6b6b;}

/* ===================================================================
   ニュース記事ページ（news-01.html など）
   =================================================================== */

/* ============ パンくず ============ */
.crumbs{
  max-width:var(--maxw);margin:0 auto;
  /* ヘッダーは画面に貼り付いているので、その分を上にあける */
  padding:calc(var(--header-h) + 40px) 32px 0;
  font-size:12px;letter-spacing:.04em;color:var(--ink-soft);
}
.crumbs a{color:var(--ink-soft);border-bottom:1px solid transparent;transition:border-color .25s;}
.crumbs a:hover{border-color:var(--gold);}
.crumbs span{margin:0 8px;color:var(--gold-soft);}

/* ============ 記事の枠 ============ */
.article{max-width:820px;margin:0 auto;padding:0 32px 100px;}

.article__head{
  padding:clamp(30px,4vw,44px) 0 clamp(24px,3vw,32px);
  border-bottom:1px solid var(--line);
}
.article__meta{
  display:flex;align-items:center;flex-wrap:wrap;gap:10px 14px;margin:0 0 16px;
}
.article__meta time{
  font-family:var(--serif);font-size:14px;letter-spacing:.08em;color:var(--ink-soft);
}
.article__title{
  margin:0;font-family:var(--serif);font-weight:700;
  font-size:clamp(21px,2.9vw,33px);line-height:1.6;letter-spacing:.04em;color:var(--ink);
}

/* ============ 記事の中身 ============ */
.article__body{padding:clamp(28px,3.6vw,44px) 0 0;}
.article__body p{
  margin:0 0 22px;font-size:15px;line-height:2.15;letter-spacing:.03em;color:#2f2a22;
}
.article__body p:last-child{margin-bottom:0;}
.article__body b{font-weight:700;}
.article__body a{color:var(--enji);border-bottom:1px solid currentColor;word-break:break-all;}
.article__lead{
  font-family:var(--serif);font-weight:600;
  font-size:clamp(16px,1.8vw,19px) !important;line-height:2 !important;color:var(--ink) !important;
}

/* 見出し */
.article__h2{
  margin:clamp(38px,4.4vw,52px) 0 18px;padding-left:14px;
  border-left:4px solid var(--enji);
  font-family:var(--serif);font-weight:600;font-size:clamp(17px,2vw,21px);
  letter-spacing:.08em;color:var(--ink);
}

/* 箇条書き */
.article__list{list-style:none;margin:0 0 22px;padding:0;}
.article__list li{
  position:relative;padding:0 0 0 22px;margin:0 0 10px;
  font-size:14.5px;line-height:2;letter-spacing:.03em;color:#2f2a22;
}
.article__list li::before{
  content:"";position:absolute;left:4px;top:14px;
  width:6px;height:6px;border-radius:50%;background:var(--gold);
}

/* 写真 */
.article__fig{margin:clamp(26px,3vw,36px) 0;}
.article__fig img{
  width:100%;height:auto;display:block;background:var(--washi-deep);
  border:1px solid var(--line);
}
/* ロゴなど、大きく出したくない画像 */
.article__fig--logo{max-width:440px;margin-left:auto;margin-right:auto;}
.article__fig--logo img{border:0;background:none;}
.article__fig figcaption{
  margin:10px 0 0;font-size:12.5px;line-height:1.8;color:var(--ink-soft);letter-spacing:.03em;
}
.article__figs{
  display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(12px,1.6vw,18px);
  margin:clamp(26px,3vw,36px) 0;
}
.article__figs img{width:100%;height:auto;display:block;border:1px solid var(--line);}

/* 囲み（開催店舗・住所など） */
.article__box{
  margin:clamp(26px,3vw,36px) 0;padding:clamp(20px,2.4vw,28px);
  background:#fff;border:1px solid var(--line);
}
.article__box p{font-size:14px;line-height:2;margin-bottom:14px;}
.article__box p:last-child{margin-bottom:0;}
.article__boxhead{
  margin:0 0 14px !important;padding-bottom:12px;border-bottom:1px solid var(--line);
  font-family:var(--serif);font-weight:600;font-size:15px !important;letter-spacing:.08em;color:var(--enji);
}
/* 「県名：店名」のような組み。1行ずつ横並びにする */
.article__dl{margin:0;}
.article__dl > div{
  display:flex;gap:clamp(12px,2vw,20px);align-items:baseline;
  padding:10px 0;border-bottom:1px dashed rgba(221,211,194,.9);
}
.article__dl > div:first-child{padding-top:0;}
.article__dl > div:last-child{padding-bottom:0;border-bottom:0;}
.article__dl dt{
  flex:0 0 clamp(56px,16%,88px);
  font-size:12.5px;letter-spacing:.06em;color:var(--ink-soft);
}
.article__dl dd{flex:1 1 auto;min-width:0;margin:0;font-size:14.5px;line-height:1.9;color:var(--ink);}

/* 注意書き */
.article__note{
  margin:clamp(24px,3vw,32px) 0 0;padding:16px 18px;
  background:var(--washi-deep);
  font-size:12.5px !important;line-height:1.95 !important;color:#4a443b !important;letter-spacing:.03em;
}

/* ボタン */
.article__btn{margin:clamp(28px,3.4vw,38px) 0 0;text-align:center;}

/* ============ 前後の記事・一覧へ ============ */
.article__nav{
  display:flex;align-items:stretch;gap:12px;
  margin:clamp(48px,6vw,72px) 0 0;padding:clamp(24px,3vw,30px) 0 0;
  border-top:1px solid var(--line);
}
.article__nav a,.article__nav span{
  flex:1 1 0;min-width:0;display:flex;flex-direction:column;justify-content:center;gap:5px;
  padding:16px 18px;border:1px solid var(--line);background:#fff;
  font-size:13px;line-height:1.7;letter-spacing:.03em;color:var(--ink);
  transition:background .28s var(--ease),border-color .28s;
}
.article__nav a:hover{background:var(--washi-deep);border-color:var(--gold-soft);}
.article__nav span{color:#b5aea3;background:var(--washi);}
.article__nav em{
  font-style:normal;font-size:11px;letter-spacing:.1em;color:var(--gold);
}
.article__nav .is-next{text-align:right;}
.article__nav--center{justify-content:center;}
.article__back{
  flex:0 0 auto !important;text-align:center;
  background:var(--enji) !important;border-color:var(--enji) !important;color:#fff !important;
  font-family:var(--serif);letter-spacing:.1em;padding:16px 34px !important;
}
.article__back:hover{background:var(--enji-dark) !important;border-color:var(--enji-dark) !important;}

/* ============ スマホ ============ */
@media (max-width:768px){
  .crumbs{padding:calc(var(--header-h) + 28px) 18px 0;font-size:11.5px;}
  .article{padding:0 18px 70px;}
  .article__body p{font-size:14.5px;line-height:2.05;}
  .article__figs{grid-template-columns:1fr;}
  .article__dl > div{flex-direction:column;gap:4px;}
  .article__dl dt{flex:none;}
  .article__nav{flex-direction:column;}
  .article__nav .is-next{text-align:left;}
  .article__back{width:100%;}
}