/* 英語版 案A（2026-10-05 運営者「案Aに直接移行してください」）。日本語版の部品の CSS（design.css・pages.css・wordpress.css・design-2610.css・home-v31.css）を
   そのまま使い、英語のために変えるのは書体の変数と、英語の長い題名・行の長さに要る所だけ。inc/en-a.php が body に kn-a を付けたページだけに効く。
   切り戻し：option kn_en_design_a=off（このファイルも読まれなくなる）。前の係の描画の CSS（tokens.css・A.css・article-body.css）をまとめたもの */
/* 全案共通：英語版の色の変数を日本語版の値に（墨 #192b30・紙 #fff・海 #006078・朱 #af3d22・罫 #d6e0e2・薄青 #eef5f6）。書体は Helvetica Neue／Arial、記事の題名だけ Georgia。Web フォントは読まない */
body.kn-en.kn-a{--kn-paper:#fff;--kn-white:#fff;--kn-ink:#192b30;--kn-muted:#56676b;--kn-green:#006078;--kn-red:#af3d22;--kn-blush:#fbe5e7;--kn-rose-line:#d6e0e2;--kn-line:#d6e0e2;--kn-sage:#eef5f6;--kn-sans:"Helvetica Neue",Arial,sans-serif;--kn-serif:Georgia,"Times New Roman",serif;background:#fff;color:#192b30}
.kn-a :where(a,button,input,summary,select):focus-visible{outline:3px solid #006078;outline-offset:4px}
/* 英字の大文字の小見出しは出さない（日本語版と同じ。2026-10 から日本語は出していない） */
.kn-a .kn-overline{display:none}
/* 英字の大文字の札もやめる（sentence case のまま） */
.kn-a .kn-area-count,.kn-a .kn-article-kicker span:first-child,.kn-a .kn-card-meta>a.kn-card-need,.kn-a .kn-card-meta>span:first-child,.kn-a .kn-en-label,.kn-a .kn-entity-item .kf-facts-title,.kn-a .kn-rank-type,.kn-a .kn-toc summary{text-transform:none!important;letter-spacing:0!important}

/* 案A：日本語版の部品の CSS（design.css・pages.css・wordpress.css・design-2610.css・home-v31.css）をそのまま使い、
   英語のために変えるのは「書体の変数」と、英語の長い題名・行の長さに要る所だけ。 */
body.kn-en.kn-a{--ll-font:"Helvetica Neue",Arial,sans-serif;--ll-serif:Georgia,"Times New Roman",serif;font:1rem/1.75 var(--ll-font);background:#fff;color:#192b30}
.kn-a main#main{width:min(calc(100% - 80px),1200px);margin-inline:auto}
@media(max-width:1100px){.kn-a main#main{width:calc(100% - 48px)}}
@media(max-width:560px){.kn-a main#main{width:calc(100% - 32px)}}
/* ヘッダー：日本語版と同じ。英字のロゴは日本語の「この街手帖」と同じ大きさ・太さ。言語の切り替えは「暮らし案内」の位置 */
.kn-a .site-header .brand-wordmark{letter-spacing:-1.2px}
.kn-a .utility-links a{font-weight:700}
.kn-a .category-nav a .ll-cat-icon,.kn-a .category-nav a svg{width:20px;height:20px;flex:none}
/* 分類の数に合わせて1行に並べる（2026-10-10 運営者「カテゴリバーはなるべく一行に」。前は3列で5つが2行） */
@media(min-width:801px){.kn-a .category-nav{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr)}}
.kn-a .ll-side-head .ja{font-size:.9375rem;font-weight:700;color:#192b30;line-height:1.4}
/* スマホ：英字のロゴは日本語の「この街手帖」と同じ並び（ロゴ＋版の札＋検索）に収める。日本語版への切り替えは日本語版の「暮らし案内」と同じくスマホのヘッダーには出さず、フッターと検索の欄に置く */
@media(max-width:800px){
 body.kn-a .site-header .brand-wordmark{font-size:1.25rem!important;letter-spacing:-.6px}
 body.kn-a .site-header .brand-edition{font-size:.75rem}
 body.kn-a .site-header .utility-links{display:none!important}
 body.kn-a[data-menu-open="true"] .site-header .utility-links{display:block!important;flex-basis:100%;order:5}
}
/* 地域トップの見出し（ページの H1 は地域名のまま。1行にまとめる） */
.kn-a .kn-a-region{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;padding:14px 0 0}
.kn-a .kn-a-region h1{margin:0;font:700 1.375rem/1.4 var(--ll-font)}
.kn-a .kn-a-region p{margin:0;font-size:.8125rem;color:var(--ll-muted)}
/* ヒーロー：依頼1。予定は4件（2列×2行）。PC は左右の列の高さをそろえ、右の行を伸ばして最後の行の下線を左のカードの下端に合わせる */
.kn-a .home-intro .hi-label h1>span{color:inherit}
.kn-a .home-intro .hi-pick-title{overflow-wrap:break-word}
@media(min-width:761px){
 .kn-a .home-intro .hi-grid{align-items:stretch}
 .kn-a .home-intro .hi-picks,.kn-a .home-intro .hi-agenda{display:flex;flex-direction:column}
 .kn-a .home-intro .hi-picks-grid{flex:1;grid-template-rows:1fr 1fr;align-items:stretch}
 .kn-a .home-intro .hi-pick{align-self:stretch}
 .kn-a .home-intro .hi-list{flex:1;grid-auto-rows:1fr;align-content:stretch}
 .kn-a .home-intro .hi-ev{display:flex;flex-direction:column}
 .kn-a .home-intro .hi-dots{display:none}
 .kn-a .home-intro .hi-ev-title,.kn-a .home-intro .hi-pick-title{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
}
@media(max-width:760px){.kn-a .home-intro .hi-ev-title{display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}}
/* カード：英語の題名は PC 3行・スマホ4行で切る（単語の途中で折らない） */
.kn-a #content-grid .content-card h3{overflow-wrap:break-word;word-break:normal}
@media(max-width:800px){.kn-a #content-grid .content-card h3{-webkit-line-clamp:4}}
.kn-a .ll-rank-thumb.is-empty{background:#eef5f6}
/* 一覧の下のページ送り：日本語版の色 */
.kn-a .kn-pagination{display:flex;gap:8px;justify-content:center;margin:32px 0 0}
.kn-a .kn-pagination .page-numbers{min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;border:1px solid #d6e0e2;color:#192b30;text-decoration:none;font-size:14px}
.kn-a .kn-pagination .current{background:#006078;border-color:#006078;color:#fff}
.kn-a .kn-pagination .dots{border:0;min-width:20px}
/* 記事：日本語版の article-layout。本文は日本語版と同じく左の列いっぱい（2026-10-05 運営者：本文が題名の列より狭かった。前の英語版の 68ch と 720px の上限を外す） */
.kn-a .kn-a-article .article-heading h1{font:700 clamp(1.625rem,2.6vw,2.125rem)/1.45 var(--ll-serif);letter-spacing:0}
.kn-a .kn-a-article .article-kicker>span:first-child{letter-spacing:0}
.kn-a .kn-a-article .article-byline time{font-weight:400}
.kn-a .kn-a-article .article-main .kn-prose,.kn-a .kn-a-article .article-main .kn-prose>p,.kn-a .kn-a-article .article-main .kn-prose>ul,.kn-a .kn-a-article .article-main .kn-prose>ol,.kn-a .kn-a-article .article-main .kn-prose>h2,.kn-a .kn-a-article .kn-introduction{max-width:none}
.kn-a .kn-a-article .article-main .kn-article-photo img{aspect-ratio:auto}
.kn-a .kn-a-summary{position:static;padding:0;background:transparent;border-top:0}
.kn-a .kn-a-summary .ll-share{display:block!important;margin:0 0 22px;padding:16px 12px;background:var(--ll-soft);border-top:3px solid var(--ll-ocean)}
.kn-a .kn-a-summary h2.ll-side-head{font-family:var(--ll-font);font-size:inherit;font-weight:700;margin:0 0 8px;line-height:1.4}
.kn-a .kn-a-summary .ll-sidebar{position:static}
.kn-a .kn-a-article .kn-post-topics,.kn-a .kn-a-article .kn-source-note{max-width:none}
@media(max-width:800px){.kn-a .kn-a-article .article-heading h1{font-size:1.25rem;line-height:1.5}.kn-a .kn-a-summary{order:3}}
.kn-a .kn-a-article .article-layout>.ll-sidebar{min-width:0} /* 2026-10-05 右欄を要約の外（article-layout の直下）へ。PC の位置と追従は日本語版の .detail-view の決まりのまま */
@media(max-width:800px){.kn-a .kn-a-article .article-layout>.ll-sidebar{order:4}}
/* フッター：日本語版の site-footer。英語の注記の段落 */
.kn-a .kn-a-footer .footer-disclosure{max-width:860px;font-size:.75rem;line-height:1.8;color:#d7e3e6}
.kn-a .kn-a-footer .footer-disclosure b{color:#fff;margin-right:6px}
/* 関連記事（日本語版の related-sp。日本語版は PC で出さないが、英語は内部リンクを残すため PC でも3列で出す） */
.kn-a .kn-a-related{display:block;margin:36px 0 8px;padding-top:24px;border-top:1px solid var(--ll-rule)}
.kn-a .kn-a-related .related-sp-thumb.is-empty{background:var(--ll-soft)}
@media(min-width:801px){.kn-a .kn-a-related .related-sp-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 24px}}

/* 全案共通：英語の記事の本文の部品（PR の注記・要約・注意・表・広告の枠・手順・FAQ・出典）を日本語版の値に。部品の中身と並びは変えない */
.kn-a .kn-prose{font-size:16px;line-height:1.85;color:#192b30}
.kn-a .kn-prose p,.kn-a .kn-introduction p,.kn-a .kn-prose li{color:#192b30}
.kn-a .kn-prose h2{font:700 22px/1.5 var(--kn-sans);letter-spacing:.01em;color:#192b30;border-bottom:2px solid #192b30;padding-bottom:8px}
.kn-a .kn-prose h3{font:700 18px/1.5 var(--kn-sans);color:#192b30}
.kn-a .kn-inline-toc{border:1px solid #d6e0e2;border-radius:0;background:#eef5f6;box-shadow:none}
.kn-a .kn-inline-toc summary{text-transform:none;letter-spacing:0;font-size:15px}
.kn-a .kn-pr-note{border-left:3px solid #af3d22;background:#fff;color:#192b30}
.kn-a .kn-en-summary{border:0;border-top:3px solid #006078;background:#eef5f6;border-radius:0}
.kn-a .kn-en-summary>*:first-child{text-transform:none;letter-spacing:0}
.kn-a .kn-en-callout{border-radius:0;border-left-color:#006078;background:#eef5f6}
.kn-a .kn-en-callout--warn{border-left-color:#af3d22;background:#fff7f4}
/* 広告の枠は日本語版の promo-block と同じ（薄青の地・上に海の線・ボタンは海）。「PR」「(Ad)」の表示はそのまま */
.kn-a .kn-cta{background:#eef5f6;border:1px solid #d6e0e2;border-top:3px solid #006078;border-radius:6px;padding:20px 22px 18px;box-shadow:none}
.kn-a .kn-cta .wp-element-button{background:#006078;border-radius:4px;color:#fff}
.kn-a .kn-cta .wp-element-button:hover,.kn-a .kn-cta .wp-element-button:focus-visible{background:#004556}
.kn-a .kn-cta-banner img{border-radius:0}
.kn-a .kn-en-faq summary{color:#192b30}
.kn-a .kn-source-note{border-radius:0;background:#eef5f6;border:0}
.kn-a .kn-source-note h2,.kn-a .kn-related h2{font:700 20px/1.5 var(--kn-sans);letter-spacing:0;color:#192b30}
.kn-a .kn-prose a{color:#006078}
.kn-a .kn-prose table th{background:#eef5f6}
@media(max-width:760px){.kn-a .kn-prose,.kn-a .kn-prose p,.kn-a .kn-prose li,.kn-a .kn-introduction p{font-size:15px;line-height:24px}}

/* ---- 実装で足した所（2026-10-05） ---- */
/* 予定：前の英語版と同じく、行ごとに「開催日の行」か「締切の行」のどちらかを出す（タブの切り替えは en-home.js が data-line を書き換える） */
.kn-a .home-intro .hi-agenda .hi-ev[data-line="ev"] .hi-ev-line.is-ev,.kn-a .home-intro .hi-agenda .hi-ev[data-line="dl"] .hi-ev-line.is-dl{display:flex}
.kn-a .home-intro .hi-agenda .hi-ev[data-line="ev"] .hi-ev-line.is-dl,.kn-a .home-intro .hi-agenda .hi-ev[data-line="dl"] .hi-ev-line.is-ev{display:none}
.kn-a .home-intro .hi-ev-date time{font:inherit;color:inherit}
.kn-a .home-intro .hi-empty{margin:12px 0 0;font-size:.75rem;color:#56676b}
/* 分類のトップのパンくず */
.kn-a #home-view>.breadcrumbs{margin:14px 0 0}
/* 記事の右欄：公式サイトのボタンと地図 */
.kn-a .kn-a-summary .kn-a-next{display:grid;gap:10px;margin:0 0 22px}
.kn-a .kn-a-summary .kn-a-next .primary-button{margin:0}
.kn-a .kn-a-summary .kn-a-next .kn-text-link{font-size:.875rem;color:#006078}
/* 記事の日本語名（施設・活動のページ） */
.kn-a .kn-a-article .kn-ja-name{margin:6px 0 0;font-size:.875rem;color:var(--ll-muted)}
/* 絞り込み中の条件 */
.kn-a .active-filters .filter-chip{text-transform:none}
/* 関連記事の PC（日本語版の related-sp はスマホだけの部品なので、PC の形をここで足す：3列、写真の下に題名と分類・日付） */
@media(min-width:801px){
 .kn-a .kn-a-related .related-sp-title{font-size:1.25rem;line-height:1.4;margin:0 0 14px}
 .kn-a .kn-a-related .related-sp-list{list-style:none;margin:0;padding:0}
 .kn-a .kn-a-related .related-sp-item{min-width:0;border:0}
 .kn-a .kn-a-related .related-sp-link{display:flex;flex-direction:column;gap:10px;padding:0 0 12px;color:inherit;text-decoration:none}
 .kn-a .kn-a-related .related-sp-link:hover .related-sp-name{text-decoration:underline;text-underline-offset:3px}
 .kn-a .kn-a-related .related-sp-thumb{display:block;width:100%;aspect-ratio:3/2;overflow:hidden;border-radius:6px;background:var(--ll-soft)}
 .kn-a .kn-a-related .related-sp-thumb img{display:block;width:100%;height:100%}
 .kn-a .kn-a-related .related-sp-body{display:flex;flex-direction:column;gap:6px;min-width:0}
 .kn-a .kn-a-related .related-sp-name{font-size:1rem;line-height:1.5;font-weight:700;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
 .kn-a .kn-a-related .related-sp-meta{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:.75rem;color:var(--ll-muted)}
 .kn-a .kn-a-related .related-sp-cat{color:var(--ll-ocean-dark);font-weight:700}
}

/* Klook の広告枠（PC の記事の下だけ。表示と読み込みは kn_ea_klook の小さなスクリプトが決める） */
.kn-a .kn-klook{margin:32px 0 0;max-width:100%;min-width:0}
.kn-a .kn-klook .ll-ad-label{margin:0 0 6px}
