@charset "UTF-8";
/* -------------------------------------------------------------
   英語の一枚（/en/）

   読む人は来店の直後で、たいていはスマートフォン。
   飾りは足さず、上から下へ一本で読めるようにしてある。
   縦書きも、字間を広げた和文の組み方も、ここでは使わない。
   英字にあの詰め方をすると、単語のあいだが割れて読みにくくなる。
   ------------------------------------------------------------- */

/* 欧字を先に置いた書体。新しく読み込むものは足さない（速さを守る）。
   和文書体のラテン字形のままだと、行が間延びして英文に見えない。 */
.k20-en {
	--wa: -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue",
	      Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;
}

/* 上辺の「日本語」。目次の代わりに置く一本なので、細く小さく。 */
.top__go { margin: 0; }
.top__go a {
	font-size: 12.5px;
	letter-spacing: .12em;
	text-decoration: none;
	border-bottom: 1px solid currentColor;
	padding-bottom: 2px;
}

/* -------------------------------------------------------------
   節
   ------------------------------------------------------------- */

.en__midashi {
	margin: 0 0 clamp(14px, 2.2vh, 22px);
	font-size: clamp(21px, 2.8vw, 30px);
	font-weight: 600;
	line-height: 1.35;
	letter-spacing: .01em;
}
.en__honbun,
.en__lead {
	margin: 0 0 1.2em;
	font-size: clamp(15px, 1.5vw, 17px);
	line-height: 1.85;
	color: var(--ji-2);
}
.en__lead { margin-bottom: clamp(28px, 4vh, 44px); }
.en__shita {
	margin: clamp(36px, 5vh, 60px) 0 0;
	font-size: 13.5px;
	line-height: 1.8;
	color: var(--ji-3);
}

/* -------------------------------------------------------------
   四つの店

   一軒ずつ、名前・場所・何ができるか・行き先の順で置く。
   写真は出さない。今日そこにいた人には要らないし、
   店頭の電波で重い頁を開かせたくない。
   ------------------------------------------------------------- */

.en__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: clamp(24px, 3.4vw, 44px);
}
.en__item {
	padding: clamp(22px, 2.6vw, 32px);
	border-radius: 4px;
	background: var(--kami-2);
	box-shadow: 0 20px 44px -34px rgba(var(--sumi-rgb), .4);
	display: grid;
	align-content: start;
}
/* 店の写真。札の頭に置いて、その下に場所・名前・説明と続ける。
   札の内側の余白ぶん外へ広げて、写真だけは札の端まで届かせる
   （日本語の店舗紹介と同じ見え方にするため）。 */
.en__pic {
	margin: calc(clamp(22px, 2.6vw, 32px) * -1);
	margin-bottom: clamp(18px, 2.2vw, 26px);
	border-radius: 4px 4px 0 0;
	overflow: hidden;
}
.en__pic .pic__body { padding: 0; }

.en__chi {
	margin: 0 0 6px;
	font-size: 11.5px;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--ji-3);
}
.en__na {
	margin: 0 0 12px;
	font-size: clamp(15px, 1.5vw, 17px);
	font-weight: 700;
	line-height: 1.4;
}
.en__text {
	margin: 0 0 clamp(18px, 2.4vh, 26px);
	font-size: 14px;
	line-height: 1.8;
	color: var(--ji-2);
}
.en__btn { margin: auto 0 0; }

@media (max-width: 860px) {
	.en__list { grid-template-columns: 1fr; }
}

/* -------------------------------------------------------------
   字間

   和文の面は .08〜.14em ほど字を離して組んである。仮名と漢字は
   一字ずつが独立しているので、離すと呼吸が出る。
   英字は単語のかたまりで読むので、同じだけ離すと語の切れ目が消えて
   「S e n d  u s …」に見える（2026年9月14日、描画して確かめた）。
   この一枚のあいだだけ詰める。釦と注記まで含めて、面ごと揃える。
   ------------------------------------------------------------- */
/* 見せ場と道の側も同じ理由で詰める。数字と欧字は、和文のように
   一字ずつ離すと語のかたまりが崩れる。行の高さも少しだけ縮める。 */
.k20-en .hero__ba { letter-spacing: .02em; }
.k20-en .hero__hi { letter-spacing: .16em; }
.k20-en .hero__theme { letter-spacing: .01em; }
.k20-en .maegaki__txt { letter-spacing: .02em; line-height: 2; }
.k20-en .toshi__title { letter-spacing: .01em; }
.k20-en .toshi__lead,
.k20-en .deki__txt { letter-spacing: .01em; line-height: 1.85; }
.k20-en .michinori__shime { letter-spacing: .01em; line-height: 1.9; }
.k20-en .gal__machi { letter-spacing: .01em; }

.k20-en .oubo__midashi { letter-spacing: .005em; }
.k20-en .oubo__lead,
.k20-en .oubo__na,
.k20-en .oubo__chui,
.k20-en .oubo__doui label,
.k20-en .oubo__shirase { letter-spacing: .01em; }
.k20-en .oubo__hissu { letter-spacing: .04em; }
.k20-en .btn { letter-spacing: .05em; }
.k20-en .hd__lead { letter-spacing: .02em; }

/* 読ませる文は左から。英文は中央に寄せると、行ごとの頭が
   揃わないぶん目が迷う。見出しは中央のままでよい。 */
.k20-en .oubo__lead { text-align: left; }

/* -------------------------------------------------------------
   展示の節も、受付と同じ幅にそろえる

   この頁は「読み物 → 展示 → 依頼」と縦に一本で読ませる作りなので、
   途中で段の幅が変わると、そこだけ左に流れて見える
   （2026年9月14日、本人の指摘）。
   見出しは中央、説明は左だが、揃える先は同じ720pxの段。

   升目は四列のままだと一枚が165pxまで痩せるので、三列にする。
   狭い画面では、共通の指定（780px以下で二列）がそのまま効く。
   ------------------------------------------------------------- */
.k20-en .gal > .naka { width: min(720px, 100%); }

/* 三列にするのは広い画面だけ。狭い画面では共通の決まり（780px以下で二列、
   460px以下で一列）にそのまま任せる。囲いを付けずに書くと、
   こちらのほうが強くて、スマホでも三列のまま一枚117pxまで痩せた
   （2026年9月14日、実測して気づいた）。 */
@media (min-width: 781px) {
	.k20-en .gal__list { --retsu: 3; }
}