*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}
body.jja-body{
background:var(--jc-bg);color:var(--jc-ink-primary);
font-family:var(--jc-serif),serif;
-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
font-size:16px;font-weight:400;letter-spacing:normal;line-height:1.8;
}
body.jja-body img{max-width:100%;height:auto;display:block}
body.jja-body a{color:inherit}
.jc-main{display:block}
.screen-reader-text{position:absolute;left:-9999px}
.jj-bar{
position:fixed;top:0;left:0;right:0;z-index:50;
background:rgba(23,26,21,.94);backdrop-filter:blur(6px);
transform:translateY(-100%);transition:transform .28s ease;
}
.jj-bar.is-on{transform:none}
.jj-bar__inner{
display:flex;align-items:center;justify-content:space-between;
max-width:1280px;margin:0 auto;padding:14px clamp(18px,3.4vw,48px);
}
.jj-bar__logo{
font-family:var(--jc-logo),sans-serif;font-weight:700;
font-size:1.1rem;letter-spacing:.02em;color:#f4f1e9;text-decoration:none;
}
.jj-trigger{
display:inline-flex;align-items:center;gap:10px;
background:none;border:0;color:#f4f1e9;cursor:pointer;padding:6px 8px;font:inherit;
}
.jj-trigger__label{font-family:var(--jc-font),sans-serif;font-weight:700;font-size:.62rem;letter-spacing:.26em}
.jj-trigger__mark{display:block;width:22px}
.jj-trigger__mark i{display:block;height:1px;background:#f4f1e9;margin:5px 0}
.jj-menu[hidden]{display:none!important}
.jj-menu{position:fixed;inset:0;z-index:60;display:flex;justify-content:flex-end;background:rgba(8,9,6,.58)}
.jj-menu__panel{
width:min(420px,100%);height:100%;background:#12130f;color:#f4f1e9;
padding:clamp(18px,3vh,30px) clamp(20px,3vw,34px);
display:flex;flex-direction:column;gap:26px;overflow-y:auto;
}
.jj-menu__head{display:flex;align-items:center;justify-content:space-between}
.jj-menu__nav{border-top:1px solid rgba(244,241,233,.26)}
.jj-menu__nav a{
display:flex;align-items:baseline;justify-content:space-between;gap:1.4rem;
padding:13px 8px;margin:0 -8px;text-decoration:none;
border-bottom:1px solid rgba(244,241,233,.26);
}
.jj-menu__nav a:hover{background:rgba(244,241,233,.1)}
.jj-menu__en{font-family:var(--jc-logo),sans-serif;font-weight:700;font-size:.92rem;letter-spacing:.16em}
.jj-menu__ja{font-size:.78rem;letter-spacing:.12em;opacity:.82}
:root {
--jc-accent: #a8760a;
--jc-accent-weak: rgba(168, 118, 10, 0.13);
--jc-green: #35452f;
--jc-ink-primary: #111111;
--jc-ink-secondary: #55554f;
--jc-ink-mark: #7c8474;
--jc-bg: #ffffff;
--jc-bg-2: #eff1ec;
--jc-bg-3: #e2e5dd;
--jc-ground: #e7e9e3;
--jc-line: #d9d9d9;
--jc-radius: 10px;
--jc-radius-sm: 6px;
--jc-shadow: 0 1px 2px rgba(16, 20, 24, .06), 0 8px 24px rgba(16, 20, 24, .06);
--jc-maxw: 1100px;
--jc-font: -apple-system, BlinkMacSystemFont, "Hiragino Sans", "Noto Sans JP", "Yu Gothic", Meiryo, sans-serif;
--jc-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
--jc-logo: "Anton", "Arial Narrow", "Helvetica Neue", sans-serif;
--jc-display: "Playfair Display", "Shippori Mincho", Georgia, serif;
--jc-serif: "Shippori Mincho", "Hiragino Mincho ProN", "Yu Mincho", "YuMincho", serif;
}
.jm-mag { position: relative; background: var(--jc-bg); }
.jm-page {
flex: 0 0 100%;
scroll-snap-align: start;
min-height: calc(100vh - 150px);
display: flex;
flex-direction: column;
padding: 40px 0 64px;
position: relative;
}
.jm-cover__img { position: absolute; inset: 0; background-size: cover; background-position: center; opacity: .9; }
@media (max-width: 900px) {
.jm-page { min-height: auto; padding: 28px 0 56px; }
}
body:not(.jc-cover-page) .jc-main { padding-top: 78px; }
.jm-opener__inner { max-width: 760px; margin: 0 auto; padding: 0 24px; }
.jm-opener__title {
font-family: var(--jc-serif), serif;
font-weight: 800;
font-size: var(--jjf-h1, clamp(1.5rem, 3.4vw, 2.35rem));
line-height: 1.62; letter-spacing: .045em;
margin: 0;
}
.jm-opener__meta {
display: flex; flex-wrap: wrap; align-items: center; gap: 18px;
margin: 22px 0 0; padding-top: 16px;
border-top: 1px solid var(--jc-line);
font-family: var(--jc-font), sans-serif;
font-size: .62rem; letter-spacing: .16em;
color: var(--jc-ink-mark);
}
.jm-opener__meta time { letter-spacing: .12em; }
.jm-read .entry-content h2 {
font-weight: 800;
border-bottom: 1px solid var(--jc-ink-primary);
padding-bottom: .55em;
}
.jm-read .entry-content h3::before { content: none; }
.jm-read .entry-content h3 {
padding-left: 0;
border-left: 0;
}
.jm-read .entry-content h3::after {
content: ""; display: block; width: 26px; height: 1px;
background: var(--jc-accent); margin-top: .7em;
}
.jm-read .entry-content > p:first-of-type::first-letter {
font-size: 2.9em; font-weight: 600; padding: .08em .14em 0 0;
}
.jm-opener {
position: static; background: none; margin: 0 0 40px;
}
.jm-opener::after, .jm-opener::before { content: none !important; display: none !important; }
.jm-opener__img {
position: static; inset: auto;
width: 100%; aspect-ratio: 16 / 7;
background-size: cover; background-position: center;
margin-bottom: 40px;
}
@media (max-width: 700px) { .jm-opener__img { aspect-ratio: 4 / 3; margin-bottom: 30px; } }
.jm-opener__inner {
position: static; max-width: 760px; margin: 0 auto; padding: 0 24px;
color: var(--jc-ink-primary); background: none; text-align: left;
}
.jm-opener--noimg .jm-opener__inner { padding: 0 24px; max-width: 760px; color: var(--jc-ink-primary); }
.jm-opener__title { color: var(--jc-ink-primary); }
.jm-opener--noimg .jm-opener__title,
.jm-opener--noimg .jm-opener__meta { text-align: left; justify-content: flex-start; }
.jm-read { margin-top: 44px; }
.jm-read .entry-content > p:first-of-type::first-letter {
font-size: inherit; font-weight: inherit; float: none;
padding: 0; color: inherit; line-height: inherit;
}
.jm-read .entry-content > p:first-of-type {
font-size: 1.12rem; line-height: 2.05; color: var(--jc-ink-primary);
}
.jm-fmt--interview .jm-opener__img { filter: grayscale(1) contrast(1.06); aspect-ratio: 3 / 2; }
.jm-fmt--interview .jm-opener__title { letter-spacing: .06em; }
.jm-fmt--interview .entry-content blockquote {
border: 0; padding: 0; margin: 2.8em 0;
border-top: 1px solid var(--jc-ink-primary); border-bottom: 1px solid var(--jc-ink-primary);
}
.jm-fmt--interview .entry-content blockquote p {
font-family: var(--jc-serif), serif; font-weight: 600;
font-size: clamp(1.05rem, 2.4vw, 1.4rem); line-height: 1.85; letter-spacing: .06em;
margin: 0; padding: 26px 0;
}
@media (max-width: 767px) {
.jj-copy { top: 27%; width: 50%; }
.jj-copy p { margin-top: 1rem; }
.jj-latest { top: 27%; bottom: auto; width: 38%; right: 4.3%; }
.jj-latest__heading { margin-bottom: .5rem; padding-bottom: 0; }
.jj-latest-item { padding: 0; }
.jj-latest-item a { padding: .4rem var(--jj-hov-pad, .9rem) .55rem; }
.jj-latest-item__meta { margin-bottom: .2rem; }
.jj-category-menu { top: 54%; bottom: auto; width: 36%; }
.jj-category-menu > a { gap: .4rem; }
.jj-category-menu > a { padding: .52rem var(--jj-hov-pad, .9rem); }
.jj-category-menu__about { margin-top: .8rem; }
}
@media (max-width: 767px) {
.jj-cover__overlay {
background:
linear-gradient(
to right,
rgba(6, 9, 12, .58) 0%,
rgba(6, 9, 12, .40) 26%,
rgba(6, 9, 12, .16) 44%,
rgba(6, 9, 12, 0) 54%,
rgba(6, 9, 12, .30) 70%,
rgba(6, 9, 12, .58) 100%
),
linear-gradient(
to bottom,
rgba(5, 25, 38, .28) 0%,
rgba(5, 25, 38, .04) 34%,
rgba(0, 0, 0, 0) 56%,
rgba(0, 0, 0, .55) 100%
);
}
}
@media (max-width: 767px) {
.jj-logo { font-size: var(--jjf-logo, min(17vw, (100vw - 122px) / 5.6)); }
.jj-logo--img img,
.jj-logo--img svg { width: min(62vw, 420px) !important; }
}
.jm-opener__img {
position: relative;
height: clamp(300px, 62vh, 620px);
background-size: cover; background-position: center;
background-color: var(--jc-bg-3);
}
.jm-opener--noimg .jm-opener__img { display: none; }
.jm-opener__credit {
position: absolute; right: 18px; bottom: 14px; margin: 0;
max-width: 60%;
font-family: var(--jc-font), sans-serif;
font-size: .6rem; letter-spacing: .1em; line-height: 1.7;
color: rgba(255,255,255,.86);
text-shadow: 0 1px 6px rgba(0,0,0,.55);
text-align: right;
}
.jm-opener__inner {
max-width: 940px; margin: 0 auto; padding: 0 24px;
}
.jm-opener__rail {
display: flex; align-items: center; flex-wrap: wrap; gap: 12px;
margin: 34px 0 26px; padding-bottom: 12px;
border-bottom: 1px solid var(--jc-line);
font-family: var(--jc-font), sans-serif; font-weight: 700;
font-size: .58rem; letter-spacing: .26em; color: var(--jc-ink-mark);
}
.jm-opener__rail i {
display: block; width: 16px; height: 1px; background: var(--jc-line);
}
.jm-opener__title {
max-width: 22em;
font-size: var(--jjf-h1, clamp(1.7rem, 4.2vw, 3rem));
line-height: 1.5; letter-spacing: .04em;
margin: 0;
}
.jm-opener__lede {
max-width: 34em; margin: 26px 0 0;
font-family: var(--jc-serif), serif;
font-size: clamp(.95rem, 1.35vw, 1.1rem);
line-height: 2.15; letter-spacing: .05em;
color: var(--jc-ink-secondary);
}
.jm-opener__meta {
margin-top: 30px; padding-top: 14px;
border-top: 1px solid var(--jc-line);
}
.jm-opener__by { margin-left: auto; letter-spacing: .2em; }
@media (min-width: 861px) {
.jm-fmt--interview .jm-opener {
display: grid; grid-template-columns: 44% 1fr; align-items: center;
gap: 0 clamp(30px, 4vw, 64px);
max-width: 1180px; margin: 0 auto; padding: 0 24px;
}
.jm-fmt--interview .jm-opener__img { height: min(78vh, 720px); }
.jm-fmt--interview .jm-opener__inner { max-width: none; padding: 0; }
.jm-fmt--interview .jm-opener__rail { margin-top: 0; }
.jm-fmt--interview .jm-opener__title { font-size: clamp(1.6rem, 3vw, 2.5rem); }
}
.jm-read .entry-content > p {
margin: 0; text-indent: 1em;
line-height: 2.1; letter-spacing: .045em;
text-align: justify; text-justify: inter-ideograph;
word-break: normal; overflow-wrap: anywhere; line-break: strict;
}
.jm-read .entry-content > p:first-of-type { text-indent: 0; font-size: 1.06rem; }
.jm-read .entry-content > p:first-of-type::first-letter {
float: left;
font-family: var(--jc-serif), serif; font-weight: 800;
font-size: 3.1em; line-height: .92;
margin: .08em .12em 0 0;
}
.jm-read .entry-content > h2 + p,
.jm-read .entry-content > h3 + p,
.jm-read .entry-content > aside + p,
.jm-read .entry-content > figure + p{ text-indent: 0; }
.jm-read .entry-content > ul,
.jm-read .entry-content > ol,
.jm-read .entry-content > table,
.jm-read .entry-content > aside{ margin-top: 1.7em; margin-bottom: 1.7em; }
.jm-read .entry-content h2 {
margin: 2.4em 0 1em; padding: .5em 0 .5em;
border-top: 2px solid var(--jc-ink-primary); border-bottom: 0;
font-size: clamp(1.15rem, 1.9vw, 1.42rem); line-height: 1.6;
}
.jm-read .entry-content h2::before { top: 1.15em; }
.jm-read .entry-content h3 {
margin: 2em 0 .7em; font-size: 1.02rem; letter-spacing: .06em;
}
.jm-read .entry-content { counter-reset: jc-h2 jc-fig; }
.jm-read .entry-content > figure,
.jm-read .entry-content > .wp-block-image { counter-increment: jc-fig; margin: 2.6em 0; }
.jm-read .entry-content figcaption {
position: relative; margin-top: 12px; padding-left: 0;
font-family: var(--jc-font), sans-serif;
font-size: .72rem; line-height: 1.85; letter-spacing: .04em;
color: var(--jc-ink-secondary);
}
.jm-read .entry-content figcaption::before {
content: counter(jc-fig, decimal-leading-zero) " ";
font-family: var(--jc-mono), monospace; font-weight: 700;
letter-spacing: .14em; color: var(--jc-accent); margin-right: .7em;
}
.jm-read .entry-content > blockquote {
border: 0; border-top: 1px solid var(--jc-line); border-bottom: 1px solid var(--jc-line);
padding: 22px 0; background: none;
}
.jm-read .entry-content > blockquote p { text-indent: 0; }
.jm-folio {
display: flex; align-items: center; justify-content: center; gap: 14px;
max-width: 600px; margin: 54px auto 0; padding-top: 18px;
border-top: 1px solid var(--jc-line);
font-family: var(--jc-font), sans-serif; font-weight: 700;
font-size: .56rem; letter-spacing: .28em; color: var(--jc-ink-mark);
}
.jm-folio i { display: block; width: 20px; height: 1px; background: var(--jc-line); }
@media (max-width: 860px) {
.jm-opener__inner { padding: 0 22px; }
.jm-opener__rail { margin: 24px 0 20px; }
.jm-opener__title { max-width: none; }
.jm-opener__lede { margin-top: 20px; font-size: .95rem; line-height: 2.05; }
.jm-opener__by { margin-left: 0; }
.jm-read .entry-content > p:first-of-type::first-letter { font-size: 2.7em; }
}
.jm-read .entry-content > h2 {
grid-column: wide;
display: grid; grid-template-columns: 80px 1fr; align-items: start;
column-gap: 0;
}
.jm-read .entry-content > h2::before {
content: counter( jc-h2, decimal-leading-zero );
position: static; left: auto; top: auto;
font-family: var(--jc-mono), monospace; font-weight: 700;
font-size: .74rem; letter-spacing: .16em; color: var(--jc-accent);
padding-top: .55em;
}
@media (max-width: 900px) {
.jm-read .entry-content > h2 { display: block; }
.jm-read .entry-content > h2::before { display: block; margin-bottom: .5em; padding-top: 0; }
}
@media (min-width: 900px) {
.jm-read {
--jc-pad: clamp(24px, 3.4vw, 60px);
--jc-bleed: calc((100vw - min(100vw, 1280px)) / 2 + var(--jc-pad));
max-width: 1280px;
padding: 0 var(--jc-pad);
}
.jm-read .entry-content {
--jc-gap: clamp(14px, 1.6vw, 26px);
grid-template-columns: repeat(12, minmax(0, 1fr));
column-gap: var(--jc-gap);
}
.jm-read .entry-content > * { grid-column: 4 / 11; }
.jm-read .entry-content > h2 {
grid-column: 2 / 12;
display: block; position: relative;
padding-left: calc((100% - 9 * var(--jc-gap)) / 5 + 2 * var(--jc-gap));
}
.jm-read .entry-content > h2::before {
content: counter( jc-h2, decimal-leading-zero );
position: absolute; left: 0; top: 0;
font-family: var(--jc-mono), monospace; font-weight: 700;
font-size: .74rem; letter-spacing: .16em; color: var(--jc-accent);
padding-top: 1.15em;
}
.jm-read .entry-content > figure,
.jm-read .entry-content > .wp-block-image {
grid-column: 2 / 12;
display: grid;
grid-template-columns: repeat(10, minmax(0, 1fr));
column-gap: var(--jc-gap);
align-items: start;
}
@supports (grid-template-columns: subgrid) {
.jm-read .entry-content > figure,
.jm-read .entry-content > .wp-block-image { grid-template-columns: subgrid; }
}
.jm-read .entry-content > figure > img,
.jm-read .entry-content > figure > a,
.jm-read .entry-content > .wp-block-image > img,
.jm-read .entry-content > .wp-block-image > a { grid-column: span 7; width: 100%; }
.jm-read .entry-content > figure > figcaption,
.jm-read .entry-content > .wp-block-image > figcaption {
grid-column: span 3; margin-top: 0; padding-top: .3em;
border-top: 1px solid var(--jc-line);
}
.jm-read .entry-content > figure > figcaption::before,
.jm-read .entry-content > .wp-block-image > figcaption::before {
display: block; margin: 0 0 .5em;
}
.jm-read .entry-content > blockquote { grid-column: 2 / 12; }
.jm-folio { max-width: none; }
}
@media (min-width: 900px) and (max-width: 1180px) {
.jm-read .entry-content { grid-template-columns: repeat(8, minmax(0, 1fr)); }
.jm-read .entry-content > * { grid-column: 2 / 8; }
.jm-read .entry-content > h2 {
grid-column: 1 / 9;
padding-left: calc((100% - 7 * var(--jc-gap)) / 8 + var(--jc-gap));
}
.jm-read .entry-content > figure,
.jm-read .entry-content > .wp-block-image { grid-column: 1 / 9; grid-template-columns: repeat(8, minmax(0, 1fr)); }
@supports (grid-template-columns: subgrid) {
.jm-read .entry-content > figure,
.jm-read .entry-content > .wp-block-image { grid-template-columns: subgrid; }
}
.jm-read .entry-content > figure > img,
.jm-read .entry-content > .wp-block-image > img { grid-column: span 6; }
.jm-read .entry-content > figure > figcaption,
.jm-read .entry-content > .wp-block-image > figcaption { grid-column: span 2; }
.jm-read .entry-content > blockquote { grid-column: 1 / 9; }
}
@media (min-width: 900px) {
.jm-opener__inner {
max-width: 1280px;
padding: 0 clamp(24px, 3.4vw, 60px);
display: grid;
--jc-gap: clamp(14px, 1.6vw, 26px);
grid-template-columns: repeat(12, minmax(0, 1fr));
column-gap: var(--jc-gap);
}
.jm-opener__rail { grid-column: 2 / 12; }
.jm-opener__title { grid-column: 2 / 9; max-width: none; }
.jm-opener__lede {
grid-column: 9 / 12; max-width: none; margin-top: 0;
align-self: end; font-size: .92rem; line-height: 2.1;
padding-left: clamp(14px, 1.6vw, 26px);
border-left: 1px solid var(--jc-line);
}
.jm-opener__meta { grid-column: 2 / 12; }
}
@media (min-width: 900px) and (max-width: 1180px) {
.jm-opener__inner { grid-template-columns: repeat(8, minmax(0, 1fr)); }
.jm-opener__rail, .jm-opener__meta { grid-column: 1 / 9; }
.jm-opener__title { grid-column: 1 / 6; }
.jm-opener__lede { grid-column: 6 / 9; }
}
.jm-article, .jm-read { overflow-x: clip; }
.jm-opener__rail {
border-bottom: 0;
position: relative;
padding-bottom: 14px;
}
.jm-opener__rail::after {
content: ""; position: absolute; left: 0; right: 0; bottom: 0;
height: 4px;
border-top: 2px solid var(--jc-ink-primary);
border-bottom: 1px solid var(--jc-ink-primary);
}
.jm-folio {
position: relative;
border-top: 0; padding-top: 20px;
}
.jm-folio::before {
content: ""; position: absolute; left: 0; right: 0; top: 0;
height: 4px;
border-top: 1px solid var(--jc-ink-primary);
border-bottom: 2px solid var(--jc-ink-primary);
}
@media (min-width: 900px) {
.jm-folio {
max-width: 1280px; margin-left: auto; margin-right: auto;
padding-left: clamp(24px, 3.4vw, 60px); padding-right: clamp(24px, 3.4vw, 60px);
justify-content: flex-end;
}
}
.jc-points {
--jc-pad: clamp(24px, 3.4vw, 60px);
max-width: 1280px; margin: clamp(48px, 7vh, 96px) auto;
padding: 0 var(--jc-pad);
}
.jc-points__head {
margin: 0 0 clamp(26px, 3.4vh, 42px);
text-align: center;
font-family: var(--jc-serif), serif; font-weight: 800;
font-size: clamp(1.05rem, 1.7vw, 1.3rem); letter-spacing: .08em; line-height: 1.6;
border: 0; padding: 0;
}
.jc-points__head span {
background: linear-gradient(transparent 62%, var(--jc-accent-weak) 62%);
padding: 0 .3em .1em;
}
.jc-points__head::before { content: none; }
.jc-points__grid {
display: grid;
grid-template-columns: repeat(var(--jc-points-cols, 3), minmax(0, 1fr));
gap: clamp(20px, 2.6vw, 40px);
}
.jc-point__no {
margin: 0 0 12px;
text-align: center;
font-family: var(--jc-mono), monospace; font-weight: 700;
font-size: .82rem; letter-spacing: .2em; color: var(--jc-ink-primary);
}
.jc-point__img {
aspect-ratio: 4 / 3; overflow: hidden; background: var(--jc-bg-3);
margin-bottom: 14px;
}
.jc-point__img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.jc-point__title {
margin: 0 0 8px; padding: 0; border: 0;
font-family: var(--jc-font), sans-serif; font-weight: 700;
font-size: .8rem; letter-spacing: .08em; line-height: 1.7;
}
.jc-point__title::before, .jc-point__title::after { content: none; }
@media (max-width: 700px) {
.jc-points__grid { grid-template-columns: 1fr; gap: 26px; }
.jc-point { display: grid; grid-template-columns: 96px 1fr; gap: 14px; align-items: start; }
.jc-point__no { grid-column: 1 / 3; text-align: left; margin-bottom: 6px; }
.jc-point__img { margin-bottom: 0; }
.jc-point__title{ grid-column: 2; }
}
.jm-read .entry-content .jc-points__head { counter-increment: none; border: 0; padding: 0; }
.jm-read .entry-content .jc-points__head::before,
.jm-read .entry-content .jc-points__head::after { content: none; }
.jm-read .entry-content .jc-point__title::before,
.jm-read .entry-content .jc-point__title::after { content: none; }
@media (min-width: 900px) {
.jm-fmt--interview .jm-opener {
background: var(--jc-accent-weak);
padding: clamp(20px, 3vh, 40px) 0;
}
.jm-fmt--interview .jm-opener__inner {
background: var(--jc-bg);
padding-top: clamp(22px, 3vh, 38px);
padding-bottom: clamp(22px, 3vh, 38px);
}
.jm-fmt--interview .jm-opener__title {
grid-column: 2 / 10;
font-size: clamp(1.7rem, 3.2vw, 2.7rem);
}
.jm-fmt--interview .jm-opener__title strong {
font-weight: inherit;
background: linear-gradient(transparent 58%, var(--jc-accent-weak) 58%);
padding: 0 .12em;
}
.jm-fmt--interview .jm-opener__lede { grid-column: 10 / 12; }
.jm-fmt--interview .jm-read {
max-width: none; padding: 0;
}
.jm-fmt--interview .jm-read .entry-content {
display: block;
writing-mode: vertical-rl;
text-orientation: mixed;
height: clamp(460px, 76vh, 880px);
overflow-x: auto; overflow-y: hidden;
padding: clamp(18px, 3vh, 34px) clamp(24px, 3.4vw, 60px);
border-top: 1px solid var(--jc-ink-primary);
border-bottom: 1px solid var(--jc-ink-primary);
scrollbar-width: thin;
}
.jm-fmt--interview .jm-read .entry-content > p {
margin: 0 0 0 clamp(16px, 1.8vw, 30px);
text-indent: 1em; text-align: start;
font-size: clamp(.92rem, 1.1vw, 1.02rem);
line-height: 2; letter-spacing: .06em;
height: 100%; overflow-wrap: normal; word-break: normal;
}
.jm-fmt--interview .jm-read .entry-content ::first-letter {
float: none; font-size: inherit; font-weight: inherit; margin: 0; padding: 0;
}
.jm-fmt--interview .jm-read .entry-content > p:first-of-type::first-letter {
float: none; font-size: 1em; margin: 0; font-weight: inherit;
}
.jm-fmt--interview .jm-read .entry-content h2,
.jm-fmt--interview .jm-read .entry-content h3 {
margin: 0 0 0 clamp(20px, 2.2vw, 34px);
padding: 0; border: 0;
font-family: var(--jc-serif), serif; font-weight: 800;
font-size: clamp(1rem, 1.25vw, 1.15rem); letter-spacing: .12em; line-height: 1.7;
color: var(--jc-ink-primary);
height: 100%;
}
.jm-fmt--interview .jm-read .entry-content h2::before,
.jm-fmt--interview .jm-read .entry-content h3::before {
content: ""; display: block;
width: 2px; height: 34px; margin: 0 auto .9em;
background: var(--jc-accent);
}
.jm-fmt--interview .jm-read .entry-content h2::after,
.jm-fmt--interview .jm-read .entry-content h3::after { content: none; }
.jm-fmt--interview .jm-read .entry-content figure,
.jm-fmt--interview .jm-read .entry-content .wp-block-image {
display: block; margin: 0 0 0 clamp(20px, 2.2vw, 34px);
width: auto; max-width: none;
}
.jm-fmt--interview .jm-read .entry-content figure img {
height: clamp(200px, 34vh, 340px); width: auto; max-width: none;
object-fit: cover;
}
.jm-fmt--interview .jm-read .entry-content figcaption {
margin: 10px 0 0; padding: 0; border: 0;
font-size: .68rem; line-height: 1.9; letter-spacing: .04em;
color: var(--jc-ink-secondary);
}
.jm-fmt--interview .jm-read .entry-content figcaption::before { content: none; }
.jm-fmt--interview .jm-read::after {
content: "← 横に送って読む";
display: block; text-align: right;
max-width: 1280px; margin: 12px auto 0; padding: 0 clamp(24px, 3.4vw, 60px);
font-family: var(--jc-font), sans-serif; font-weight: 700;
font-size: .56rem; letter-spacing: .24em; color: var(--jc-ink-mark);
}
}
@media (max-width: 899px) {
.jm-fmt--interview .jm-read .entry-content {
writing-mode: horizontal-tb; height: auto; overflow: visible;
}
}
@media (min-width: 900px) {
.jm-read .entry-content .alignleft {
float: left; width: 44%; max-width: 44%;
margin: .35em clamp(24px, 2.4vw, 40px) 1.2em 0;
}
.jm-read .entry-content .alignright {
float: right; width: 44%; max-width: 44%;
margin: .35em 0 1.2em clamp(24px, 2.4vw, 40px);
}
.jm-read .entry-content .alignleft img,
.jm-read .entry-content .alignright img { width: 100%; height: auto; display: block; }
.jm-read .entry-content .alignleft figcaption,
.jm-read .entry-content .alignright figcaption {
margin-top: 9px; padding: 0; border: 0;
font-family: var(--jc-font), sans-serif;
font-size: .68rem; line-height: 1.85; color: var(--jc-ink-secondary);
}
}
@media (max-width: 899px) {
.jm-read .entry-content .alignleft,
.jm-read .entry-content .alignright{
float: none; width: auto; max-width: none; margin: 1.6em 0;
}
}
.jm-read .entry-content { counter-reset: jc-h2 jc-fig; }
.jm-read .entry-content .alignleft,
.jm-read .entry-content .alignright { counter-increment: jc-fig; }
.jm-read .entry-content .alignleft figcaption::before,
.jm-read .entry-content .alignright figcaption::before {
content: counter(jc-fig, decimal-leading-zero) " ";
font-family: var(--jc-mono), monospace; font-weight: 700;
letter-spacing: .14em; color: var(--jc-accent); margin-right: .7em;
}
.jc-points { clear: both; }
.jm-mag { overflow: hidden; }
.jm-page {
min-height: 100svh;
padding: 0;
overflow: hidden;
}
@keyframes jc-hint {
0%, 100% { opacity: .35; transform: translateX(0); }
50%      { opacity: 1;   transform: translateX(8px); }
}
@media (max-width: 900px) {
.jm-page { min-height: 100svh; }
}
.jm-mag, .jm-read .entry-content { counter-reset: jc-h2 jc-fig jc-step; }
.jm-mag { --jj-barh: 78px; }
.jm-page { min-height: calc(100svh - var(--jj-barh)); }
@media (max-width: 900px) {
.jm-mag { --jj-barh: 56px; }
}
.jm-mag {
--jj-barh: 78px;
--jj-navh: 64px;
--jj-adminh: 0px;
height: calc(100svh - var(--jj-barh) - var(--jj-navh) - var(--jj-adminh));
display: flex;
flex-direction: column;
overflow: hidden;
}
body.admin-bar .jm-mag { --jj-adminh: 32px; }
@media screen and (max-width: 782px) {
body.admin-bar .jm-mag { --jj-adminh: 46px; }
}
.jm-page {
height: 100%;
min-height: 0;
overflow: hidden;
}
body.jja-body:has(.jm-mag) { overflow: hidden; }
@media (max-width: 900px) {
.jm-mag { --jj-barh: 56px; --jj-navh: 56px; }
}
@media (max-width: 600px) {
.jm-mag {
height: auto; min-height: 0;
display: block; overflow: visible;
}
.jm-page {
height: auto; min-height: 0;
overflow: visible;
scroll-snap-align: none;
border-bottom: 1px solid var(--jc-line);
}
.jm-page:last-child { border-bottom: 0; }
body.jja-body:has(.jm-mag) { overflow: visible; }
}
body.jja-body .jc-main { padding-top: 0 !important; }
.jj-bar {
position: fixed; top: 0; left: 0; right: 0; z-index: 50;
background: none;
backdrop-filter: none;
transform: none;
transition: background-color .3s ease, backdrop-filter .3s ease;
}
.jj-bar__inner { padding-top: clamp(16px, 2.4vh, 26px); padding-bottom: clamp(16px, 2.4vh, 26px); }
.jj-bar::before {
content: ""; position: absolute; inset: 0; z-index: -1;
background: linear-gradient(180deg, rgba(8,9,6,.55) 0%, rgba(8,9,6,0) 100%);
transition: opacity .3s ease;
}
.jj-bar.is-solid {
background: rgba(23,26,21,.94);
backdrop-filter: blur(6px);
}
.jj-bar.is-solid::before { opacity: 0; }
.jm-opener__img { margin-top: 0; }
.jm-opener__credit { bottom: 14px; }
.jm-read .entry-content > figure,
.jm-read .entry-content .alignleft,
.jm-read .entry-content .alignright{
background: #fdfcf9;
padding: 13px 13px 0;
border: 1px solid rgba(23,26,21,.08);
box-shadow:
0 1px 2px rgba(23,26,21,.10),
0 10px 26px rgba(23,26,21,.13);
transform: rotate(-.7deg);
transition: transform .3s ease;
}
.jm-read .entry-content .alignright{ transform: rotate(.7deg); }
.jm-read .entry-content > figure img,
.jm-read .entry-content .alignleft img,
.jm-read .entry-content .alignright img { display: block; width: 100%; height: auto; }
.jm-read .entry-content > figure figcaption,
.jm-read .entry-content .alignleft figcaption,
.jm-read .entry-content .alignright figcaption {
margin: 0; padding: 14px 4px 18px;
border: 0; text-align: left;
font-family: var(--jc-font), sans-serif;
font-size: .68rem; line-height: 1.8; letter-spacing: .04em;
color: var(--jc-ink-secondary);
}
.jm-read .entry-content > figure:not(:has(figcaption)) { padding-bottom: 34px; }
.jm-read .entry-content > figure figcaption::before {
content: counter(jc-fig, decimal-leading-zero) " ";
font-family: var(--jc-mono), monospace; font-weight: 700;
letter-spacing: .14em; color: var(--jc-accent); margin-right: .7em;
}
@media (prefers-reduced-motion: reduce) {
.jm-read .entry-content > figure { transform: none; }
}
.jc-point__img {
background: #fdfcf9;
padding: 11px 11px 30px;
border: 1px solid rgba(23,26,21,.08);
box-shadow: 0 1px 2px rgba(23,26,21,.10), 0 8px 20px rgba(23,26,21,.12);
aspect-ratio: auto;
margin-bottom: 18px;
}
.jc-point__img img { aspect-ratio: 4 / 3; object-fit: cover; }
.jc-point:nth-child(3n+1) .jc-point__img { transform: rotate(-1.1deg); }
.jc-point:nth-child(3n+2) .jc-point__img { transform: rotate(.6deg); }
.jc-point:nth-child(3n+3) .jc-point__img { transform: rotate(-.4deg); }
.jc-point__no {
position: static;
text-align: left;
margin: 0 0 10px 4px;
font-size: .78rem; letter-spacing: .22em; color: var(--jc-accent);
}
@media (prefers-reduced-motion: reduce) {
.jc-point__img { transform: none !important; }
}
.jm-read .entry-content > figure,
.jm-read .entry-content .alignleft,
.jm-read .entry-content .alignright,
.jc-point__img{
position: relative;
background: #f3efe4;
padding: 16px 16px 14px 42px;
border: 1px solid rgba(23,26,21,.13);
border-radius: 2px;
box-shadow:
0 1px 2px rgba(23,26,21,.07),
0 12px 28px rgba(23,26,21,.13);
}
.jm-read .entry-content > figure::before,
.jm-read .entry-content .alignleft::before,
.jm-read .entry-content .alignright::before,
.jc-point__img::before{
content: ""; position: absolute; inset: 0; pointer-events: none;
background-image:
repeating-linear-gradient(0deg, rgba(23,26,21,.05) 0 1px, transparent 1px 21px),
repeating-linear-gradient(90deg, rgba(23,26,21,.05) 0 1px, transparent 1px 21px);
border-radius: 2px;
}
.jm-read .entry-content > figure::after,
.jm-read .entry-content .alignleft::after,
.jm-read .entry-content .alignright::after,
.jc-point__img::after{
content: ""; position: absolute;
left: 13px; top: 20px; bottom: 20px; width: 15px;
background-image: radial-gradient(circle at 50% 9px,
var(--jc-bg) 0 5.4px, rgba(23,26,21,.34) 5.4px 6.4px, transparent 6.5px);
background-size: 15px 30px;
background-repeat: repeat-y;
pointer-events: none;
}
.jm-read .entry-content > figure img,
.jc-point__img img{ position: relative; z-index: 1; }
.jm-read .entry-content > figure figcaption,
.jm-read .entry-content .alignleft figcaption,
.jm-read .entry-content .alignright figcaption{
position: relative; z-index: 1;
margin: 12px 0 0; padding: 0;
border: 0; background: none; text-shadow: none; text-align: left;
font-family: var(--jc-font), sans-serif;
font-size: .68rem; line-height: 1.75; letter-spacing: .04em;
color: var(--jc-ink-secondary);
}
.jm-read .entry-content > figure:not(:has(figcaption)),
.jc-point__img{ padding-bottom: 22px; }
.jc-point:nth-child(3n+1) .jc-point__img { transform: rotate(-.7deg); }
.jc-point:nth-child(3n+2) .jc-point__img { transform: rotate(.4deg); }
.jc-point:nth-child(3n+3) .jc-point__img { transform: rotate(-.3deg); }
@media (max-width: 700px) {
.jm-read .entry-content > figure,
.jc-point__img { padding-left: 34px; }
}
@media (max-width: 700px) {
.jc-point {
display: grid;
grid-template-columns: 54px 1fr;
column-gap: 12px;
row-gap: 0;
align-items: start;
margin-bottom: clamp(34px, 6vh, 56px);
}
.jc-point__no {
grid-column: 1;
grid-row: 1 / 3;
margin: 0;
text-align: left;
font-size: 1.9rem;
line-height: 1;
letter-spacing: .04em;
color: var(--jc-accent);
}
.jc-point__title { grid-column: 2; grid-row: 1; }
.jc-point__img {
grid-column: 1 / -1;
width: 100%;
aspect-ratio: 3 / 2;
margin: 18px 0 0;
}
.jc-points__grid { gap: 0; }
.jc-point:last-child { margin-bottom: 0; }
}
.jm-opener__read {
font-family: var(--jc-mono), monospace;
font-size: .6rem; letter-spacing: .12em;
opacity: .72;
}
.jm-opener__read::before {
content: ""; display: inline-block;
width: 1.6em; height: 1px; margin: 0 .8em .28em 0;
background: currentColor; opacity: .5;
}
@media (max-width: 700px) {
.jm-opener__read::before { width: 1em; margin-right: .5em; }
}
.jm-read .entry-content h2 span {
display: block;
margin-top: .5em;
font-family: var(--jc-font), sans-serif;
font-size: .68rem;
font-weight: 500;
letter-spacing: .09em;
line-height: 1.7;
color: var(--jc-ink-secondary);
}
.jm-read .entry-content figure figcaption{
font-family: var(--jc-font), sans-serif;
font-size: .74rem;
line-height: 1.9;
letter-spacing: .03em;
color: var(--jc-ink-secondary);
padding-top: .7em;
border-top: 1px solid rgba(23,26,21,.24);
margin-top: .8em;
}
.jm-read .entry-content > p:first-of-type::first-letter{
float: none;
font-size: inherit;
font-family: inherit;
font-weight: inherit;
line-height: inherit;
margin: 0;
padding: 0;
color: inherit;
}
.jm-read .entry-content > p.drop::first-letter {
float: left;
font-family: var(--jc-serif), serif;
font-size: 3.2em;
line-height: .84;
font-weight: 800;
margin: .06em .16em 0 0;
color: var(--jc-accent);
}
.jm-read .entry-content > h2 { counter-increment: jc-h2; }
.jm-read .entry-content > h2.jc-points__head{ counter-increment: none; }
.jm-read .entry-content h2 span { text-align: left; }
.jj-pg {
--jj-ph: min(80vh, 760px);
height: var(--jj-ph);
width: calc(var(--jj-ph) * 390 / 620);
flex: 0 0 auto;
container-type: inline-size;
background: var(--jc-bg, #f4efe2);
position: relative;
overflow: hidden;
display: flex; flex-direction: column;
box-shadow: 0 1px 0 rgba(255,255,255,.14), 0 18px 40px rgba(0,0,0,.34);
}
@media (max-width: 820px) {
.jj-pg {
width: 100%; height: auto; aspect-ratio: 390 / 620;
box-shadow: none; border-bottom: 1px solid rgba(23,26,21,.18);
}
}
body.jja-body .jm-opener__title,
body.jja-body .jm-read .entry-content h2,
body.jja-body .jm-read .entry-content h3,
body.jja-body .jc-point__title,
body.jja-body .jc-points__head {
color: var(--jc-ink-primary);
}
body.jja-body .jm-read .entry-content h2 span { color: var(--jc-ink-secondary); }
.jj-pg {
--jj-by-h: min(80vh, 760px);
--jj-by-w: calc( (100vw - (2 * clamp(16px, 2vw, 40px)) - (2 * var(--jj-gap))) / 3 * 620 / 390 );
--jj-ph: min(var(--jj-by-h), var(--jj-by-w));
}
.jm-read .entry-content > h2{
position:relative;margin-top:4em;padding:1em 0 0;
border-top:1px solid var(--jc-ink-primary);
font-size:clamp(1.55rem,2.8vw,2.25rem);line-height:1.45;letter-spacing:.025em;
}
.jm-read .entry-content > h2::before{top:-1.8em}
.jm-read .entry-content h2 span{
margin-top:.55em;font-family:var(--jc-mono),monospace;font-size:.62rem;
font-weight:500;line-height:1.6;letter-spacing:.15em;color:var(--jc-ink-mark);
}
.jm-read .entry-content{container-type:inline-size}
.jm-mag {
--jj-fit: calc(100svh - var(--jj-barh, 0px) - var(--jj-navh, 0px) - var(--jj-adminh, 0px));
}
.jm-mag .jm-page{
height: max(320px, var(--jj-fit));
min-height: 0;
max-height: none;
}
.jm-mag .jm-page { overflow: hidden; }
@media (max-height: 860px) {
.jm-mag .jm-opener__lede { font-size: .84rem; line-height: 1.95; }
}
@media (max-height: 700px) {
.jm-mag .jm-opener__lede { font-size: .78rem; line-height: 1.8; max-width: 30em; }
}
@media (max-height: 580px) {
.jm-mag .jm-opener__lede { display: none; }
}
.jm-mag figure img{ cursor: zoom-in; }
.jj-zoom {
position: fixed; inset: 0; z-index: 99999;
display: flex; align-items: center; justify-content: center;
padding: clamp(16px, 3vw, 48px);
background: rgba(10, 12, 9, .92);
opacity: 0; visibility: hidden;
transition: opacity .22s ease, visibility .22s;
cursor: zoom-out;
}
.jj-zoom.is-on { opacity: 1; visibility: visible; }
.jj-zoom img {
max-width: 100%; max-height: 100%;
width: auto; height: auto;
object-fit: contain;
background: #fff;
box-shadow: 0 20px 60px rgba(0, 0, 0, .45);
}
.jj-zoom__cap {
position: absolute; left: 0; right: 0; bottom: 0;
padding: 14px clamp(16px, 3vw, 48px);
font-size: .74rem; line-height: 1.8; text-align: center;
color: rgba(244, 241, 233, .82);
background: linear-gradient(180deg, rgba(10,12,9,0), rgba(10,12,9,.75));
}
.jj-zoom__close {
position: absolute; top: 12px; right: 16px;
width: 40px; height: 40px; border: 0; border-radius: 50%;
background: rgba(255, 255, 255, .12); color: #f4f1e9;
font-size: 1.2rem; line-height: 1; cursor: pointer;
}
.jj-zoom__close:hover { background: rgba(255, 255, 255, .22); }
body.jj-zoom-open { overflow: hidden; }
body.jja-body:has(.jm-mag) { overflow: visible; }
.jm-mag { height: auto; }
.jm-related { padding-bottom: clamp(48px, 8vh, 120px); }
.jj-bar::before { display: none; }
.jj-bar {
background: transparent;
border-bottom: 1px solid transparent;
transition: background .25s ease, border-color .25s ease;
}
.jj-bar__inner {
padding-top: clamp(12px, 1.8vh, 20px);
padding-bottom: clamp(12px, 1.8vh, 20px);
}
.jj-bar.is-solid {
background: rgba(253, 252, 249, .94);
backdrop-filter: saturate(1.1) blur(8px);
border-bottom-color: var(--jc-line);
box-shadow: none;
}
.jj-bar__logo { letter-spacing: .16em; }
body.jja-body .jj-bar:not(.is-solid) .jj-bar__logo { color: inherit; }
.jj-cover, .jj-category-menu, .jj-latest { --jj-hov-pad: .9rem; }
.jc-point__cat {
display: flex; align-items: center;
gap: .6em;
margin: 0 0 .5em;
font-family: var(--jc-mono), monospace;
font-size: .62rem; letter-spacing: .2em; line-height: 1.4;
color: var(--jc-accent, #a8760a);
}
.jc-point__cat i {
flex: 0 0 auto;
width: 12px; height: 1px;
background: currentColor; opacity: .55;
}
.jc-point__cat span:last-child {
font-family: var(--jc-font), sans-serif;
letter-spacing: .12em;
color: var(--jc-ink-mark, #7c8474);
}
@media (max-width: 700px) {
.jc-point__cat { grid-column: 2; grid-row: 1; margin-bottom: .3em; }
.jc-point__title { grid-row: 2; }
.jc-point__no { grid-row: 1 / 4; }
.jc-point__img { aspect-ratio: auto; }
}
@media (max-width: 600px) {
.jm-mag .jm-page:not(.jm-page--cover) {
height: auto;
min-height: 0;
max-height: none;
overflow: visible;
}
}
.jj-bar__inner { justify-content: space-between; }
.jj-trigger,
.jj-trigger:hover,
.jj-trigger:focus,
.jj-trigger:focus-visible { background: none; }
.jj-trigger:hover { opacity: .68; }
.jj-trigger { transition: opacity .18s ease; }
.jj-bar:not(.is-solid)::before {
content: "";
display: block;
position: absolute; inset: 0; z-index: -1;
background: linear-gradient(180deg, rgba(8, 9, 6, .58) 0%, rgba(8, 9, 6, 0) 100%);
}
body.jja-body .jj-bar:not(.is-solid) .jj-bar__logo,
body.jja-body .jj-bar:not(.is-solid) .jj-trigger { color: #f4f1e9; }
body.jja-body .jj-bar:not(.is-solid) .jj-trigger__mark i { background: #f4f1e9; }
body.jja-body .jj-bar.is-solid .jj-bar__logo,
body.jja-body .jj-bar.is-solid .jj-trigger { color: var(--jc-ink-primary, #111111); }
body.jja-body .jj-bar.is-solid .jj-trigger__mark i { background: var(--jc-ink-primary, #111111); }
@media (max-width: 600px) {
.jj-bar__inner { gap: 12px; }
.jj-bar__logo { display: inline-flex; align-items: center; min-height: 40px; }
.jj-trigger { min-height: 40px; }
}
body.admin-bar { --jj-abh: 32px; }
@media screen and (max-width: 782px) {
body.admin-bar { --jj-abh: 46px; }
}
.jj-bar,
.jj-menu { top: var(--jj-abh, 0px); }
.jj-cat {
max-width: 1280px;
margin: 0 auto;
padding: 0 clamp(18px, 3.4vw, 48px);
}
.jj-cathead {
padding: calc(var(--jj-abh, 0px) + clamp(78px, 11vh, 130px)) 0 clamp(18px, 3.4vh, 34px);
border-bottom: 1px solid var(--jc-line, #d9d9d9);
}
.jj-cathead__inner {
display: grid;
grid-template-columns: 1fr auto;
align-items: end;
column-gap: 20px;
}
.jj-cathead__en {
grid-column: 1; grid-row: 1;
margin: 0;
font-family: var(--jc-logo, sans-serif), sans-serif;
font-size: clamp(2.6rem, 8vw, 5.2rem);
line-height: .94; letter-spacing: .02em;
color: var(--jc-ink-primary, #111111);
}
.jj-cathead__ja {
grid-column: 1; grid-row: 2;
margin: 12px 0 0;
font-family: var(--jc-serif, serif), serif;
font-weight: 500;
font-size: clamp(1rem, 2.1vw, 1.42rem);
letter-spacing: .34em;
color: var(--jc-ink-secondary, #55554f);
}
.jj-cathead__lede {
grid-column: 1 / -1; grid-row: 3;
max-width: 40em;
margin: 16px 0 0;
font-family: var(--jc-font, sans-serif), sans-serif;
font-size: .88rem; line-height: 1.9;
color: var(--jc-ink-secondary, #55554f);
}
.jj-cathead__count {
grid-column: 2; grid-row: 1;
margin: 0;
font-family: var(--jc-font, sans-serif), sans-serif;
font-size: .68rem; letter-spacing: .16em;
color: var(--jc-ink-mark, #7c8474);
white-space: nowrap;
}
.jj-cathead__num {
font-family: var(--jc-logo, sans-serif), sans-serif;
font-size: 1.5rem; letter-spacing: .04em;
color: var(--jc-ink-primary, #111111);
margin-right: 6px;
}
.jj-models {
display: flex; flex-wrap: wrap; align-items: center;
gap: 8px;
padding: clamp(14px, 2.4vh, 22px) 0 0;
}
.jj-models__label {
margin-right: 4px;
font-family: var(--jc-font, sans-serif), sans-serif;
font-size: .56rem; letter-spacing: .26em;
color: var(--jc-ink-mark, #7c8474);
}
.jj-model {
display: inline-flex; align-items: center;
min-height: 32px; padding: 4px 13px;
border: 1px solid var(--jc-line, #d9d9d9);
border-radius: 999px;
font-family: var(--jc-mono, monospace), monospace;
font-size: .64rem; letter-spacing: .1em; line-height: 1;
color: var(--jc-ink-secondary, #55554f);
text-decoration: none;
transition: border-color .18s ease, color .18s ease, background .18s ease;
}
.jj-model:hover { border-color: var(--jc-accent, #a8760a); color: var(--jc-accent, #a8760a); }
.jj-model.is-on {
background: var(--jc-ink-primary, #111111);
border-color: var(--jc-ink-primary, #111111);
color: #f4f1e9;
}
.jj-issues {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: clamp(14px, 2.1vw, 28px);
padding: clamp(20px, 4vh, 38px) 0 0;
}
.jj-issue { margin: 0; }
.jj-issue__link { display: block; text-decoration: none; color: inherit; }
.jj-issue__sheet {
position: relative;
aspect-ratio: 3 / 4;
overflow: hidden;
display: flex; flex-direction: column; justify-content: space-between;
padding: clamp(13px, 1.5vw, 22px);
background: var(--jc-ink-primary, #111111);
}
body.jja-body .jj-issue__img {
position: absolute; inset: 0; z-index: 0;
width: 100%; height: 100%;
object-fit: cover;
transition: transform .5s ease;
}
.jj-issue__veil {
position: absolute; inset: 0; z-index: 1;
background: linear-gradient(180deg,
rgba(8, 9, 6, .58) 0%,
rgba(8, 9, 6, .06) 26%,
rgba(8, 9, 6, .34) 52%,
rgba(8, 9, 6, .78) 76%,
rgba(8, 9, 6, .92) 100%);
}
.jj-issue__band,
.jj-issue__body { position: relative; z-index: 2; }
.jj-issue__link:hover .jj-issue__img { transform: scale(1.045); }
.jj-issue__band {
display: flex; align-items: flex-start; justify-content: space-between;
gap: 10px;
color: rgba(244, 241, 233, .92);
text-shadow: 0 1px 3px rgba(8, 9, 6, .5);
}
.jj-issue__models { display: flex; flex-wrap: wrap; gap: 6px; }
.jj-issue__model {
border: 1px solid rgba(244, 241, 233, .4);
border-radius: 999px;
padding: 2px 8px;
font-family: var(--jc-mono, monospace), monospace;
font-size: .54rem; letter-spacing: .1em; line-height: 1.7;
}
.jj-issue__date {
margin-left: auto;
font-family: var(--jc-mono, monospace), monospace;
font-size: .58rem; letter-spacing: .12em;
opacity: .82;
}
.jj-issue__body { color: #f4f1e9; text-shadow: 0 1px 4px rgba(8, 9, 6, .45); }
.jj-issue__cat {
display: flex; align-items: center; gap: 8px;
margin: 0 0 8px;
font-family: var(--jc-font, sans-serif), sans-serif;
font-size: .56rem; letter-spacing: .24em;
}
.jj-issue__cat span:first-child {
font-family: var(--jc-logo, sans-serif), sans-serif;
font-size: .7rem; letter-spacing: .18em;
}
.jj-issue__cat i { display: block; width: 14px; height: 1px; background: currentColor; opacity: .6; }
.jj-issue__title {
margin: 0;
font-family: var(--jc-serif, serif), serif;
font-weight: 600;
font-size: clamp(1rem, 1.32vw, 1.3rem);
line-height: 1.5;
display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3;
overflow: hidden;
}
.jj-issue__lede {
margin: 8px 0 0;
font-family: var(--jc-font, sans-serif), sans-serif;
font-size: .72rem; line-height: 1.75;
color: rgba(244, 241, 233, .8);
display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;
overflow: hidden;
}
.jj-issue--noimg .jj-issue__sheet {
background: var(--jc-bg-2, #eff1ec);
border: 1px solid var(--jc-line, #d9d9d9);
}
.jj-issue--noimg .jj-issue__band { color: var(--jc-ink-mark, #7c8474); }
.jj-issue--noimg .jj-issue__model { border-color: var(--jc-line, #d9d9d9); }
.jj-issue--noimg .jj-issue__body { color: var(--jc-ink-primary, #111111); text-shadow: none; }
.jj-issue--noimg .jj-issue__band { text-shadow: none; }
.jj-issue--noimg .jj-issue__cat { color: var(--jc-accent, #a8760a); }
.jj-issue--noimg .jj-issue__lede { color: var(--jc-ink-secondary, #55554f); }
.jj-issues__none {
padding: 16vh 0; text-align: center;
color: var(--jc-ink-secondary, #55554f);
}
.jj-cat .pagination { padding: clamp(26px, 5vh, 48px) 0 0; }
.jj-cat .nav-links { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 8px; }
.jj-cat .page-numbers {
display: inline-flex; align-items: center; justify-content: center;
min-width: 40px; min-height: 40px; padding: 0 13px;
border: 1px solid var(--jc-line, #d9d9d9);
font-family: var(--jc-font, sans-serif), sans-serif;
font-size: .7rem; letter-spacing: .1em;
color: var(--jc-ink-secondary, #55554f);
text-decoration: none;
}
.jj-cat .page-numbers:hover { border-color: var(--jc-ink-primary, #111111); color: var(--jc-ink-primary, #111111); }
.jj-cat .page-numbers.current {
background: var(--jc-ink-primary, #111111);
border-color: var(--jc-ink-primary, #111111);
color: #f4f1e9;
}
.jj-cat .page-numbers.dots { border-color: transparent; }
.jj-catfoot {
margin-top: clamp(26px, 5vh, 56px);
padding: clamp(22px, 4vh, 40px) 0 clamp(40px, 8vh, 80px);
border-top: 1px solid var(--jc-line, #d9d9d9);
}
.jj-catfoot__head {
margin: 0 0 16px;
font-family: var(--jc-font, sans-serif), sans-serif;
font-size: .56rem; letter-spacing: .26em;
color: var(--jc-ink-mark, #7c8474);
}
.jj-catfoot__grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
border-top: 1px solid var(--jc-line, #d9d9d9);
}
.jj-catfoot__item {
display: flex; align-items: baseline; gap: 12px;
padding: 16px 18px 16px 0;
border-bottom: 1px solid var(--jc-line, #d9d9d9);
text-decoration: none; color: inherit;
transition: background .18s ease;
}
.jj-catfoot__item:hover { background: var(--jc-bg-2, #eff1ec); }
.jj-catfoot__item:hover .jj-catfoot__en { color: var(--jc-accent, #a8760a); }
.jj-catfoot__en {
font-family: var(--jc-logo, sans-serif), sans-serif;
font-size: 1rem; letter-spacing: .14em;
}
.jj-catfoot__ja {
font-family: var(--jc-serif, serif), serif;
font-size: .8rem; letter-spacing: .2em;
color: var(--jc-ink-secondary, #55554f);
}
@media (max-width: 900px) {
.jj-issues { grid-template-columns: repeat(2, 1fr); }
.jj-catfoot__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
.jj-cathead__inner { display: block; }
.jj-cathead__count { margin-top: 14px; }
.jj-cathead__num { font-size: 1.25rem; }
.jj-issues { gap: 12px; }
.jj-issue__sheet { padding: 12px; }
.jj-issue__title { font-size: .95rem; line-height: 1.45; }
.jj-issue__lede { display: none; }
.jj-issue__cat { font-size: .5rem; letter-spacing: .18em; gap: 6px; }
.jj-issue__cat span:first-child { font-size: .62rem; }
.jj-catfoot__grid { grid-template-columns: 1fr; }
}
.jj-cat {
--jj-pad: clamp(18px, 3.4vw, 48px);
padding-left: var(--jj-pad);
padding-right: var(--jj-pad);
}
.jj-issues {
--jj-gap: clamp(14px, 2.1vw, 28px);
--jj-shelf: 9px;
--jj-shelf-a: #6d5537;
--jj-shelf-b: #4e3b26;
--jj-shelf-c: #2a1e14;
gap: var(--jj-gap);
row-gap: calc(var(--jj-gap) + 24px);
align-items: end;
}
.jj-issue {
position: relative;
padding-bottom: var(--jj-shelf);
}
.jj-issue::after {
content: "";
position: absolute; z-index: 0;
left: calc(-1 * var(--jj-gap) / 2 - 1px);
right: calc(-1 * var(--jj-gap) / 2 - 1px);
bottom: 0;
height: var(--jj-shelf);
background: linear-gradient(180deg,
var(--jj-shelf-a, #d5cdbb) 0%,
var(--jj-shelf-b, #bab09a) 46%,
var(--jj-shelf-c, #8f8673) 100%);
box-shadow:
inset 0 1px 0 rgba(232, 214, 184, .34),
0 1px 0 rgba(0, 0, 0, .5),
0 8px 14px -7px rgba(0, 0, 0, .6);
}
@media (min-width: 901px) {
.jj-issue:nth-child(3n + 1)::after { left: calc(-1 * var(--jj-pad, 24px)); }
.jj-issue:nth-child(3n)::after,
.jj-issue:last-child::after { right: calc(-1 * var(--jj-pad, 24px)); }
}
@media (max-width: 900px) {
.jj-issue:nth-child(2n + 1)::after { left: calc(-1 * var(--jj-pad, 24px)); }
.jj-issue:nth-child(2n)::after,
.jj-issue:last-child::after { right: calc(-1 * var(--jj-pad, 24px)); }
}
.jj-issue__sheet {
z-index: 1;
box-shadow: 0 9px 14px -9px rgba(8, 9, 6, .55), 0 1px 0 rgba(8, 9, 6, .3);
}
.jj-issue__sheet::after {
content: "";
position: absolute; z-index: 3;
top: 3px; bottom: 0; right: 0; width: 3px;
background: linear-gradient(90deg,
rgba(255, 255, 255, 0) 0%,
rgba(255, 255, 255, .5) 55%,
rgba(120, 116, 104, .7) 100%);
}
.jj-issue__link { transition: transform .22s ease; }
.jj-issue__link:hover { transform: translateY(-6px); }
.jj-issue__link:hover .jj-issue__sheet {
box-shadow: 0 18px 24px -13px rgba(8, 9, 6, .55), 0 1px 0 rgba(8, 9, 6, .3);
}
@media (prefers-reduced-motion: reduce) {
.jj-issue__link { transition: none; }
.jj-issue__link:hover { transform: none; }
}
@media (max-width: 600px) {
.jj-issues { --jj-shelf: 7px; row-gap: calc(var(--jj-gap) + 16px); }
}
.jj-issues {
position: relative;
isolation: isolate;
--jj-side: 11px;
padding-bottom: 30px;
}
.jj-issues::before {
content: "";
position: absolute; z-index: 0;
left: calc(-1 * var(--jj-pad, 24px));
right: calc(-1 * var(--jj-pad, 24px));
top: 0; bottom: 0;
background-color: #3a2e20;
background-image:
linear-gradient(180deg, rgba(26, 19, 11, .3) 0%, rgba(16, 12, 7, .5) 100%),
linear-gradient(0deg, #d9ba8b 0%, #d9ba8b 100%),
url(shelf.jpg);
background-size: auto, auto, cover;
background-position: center, center, center;
background-repeat: no-repeat, no-repeat, no-repeat;
background-blend-mode: normal, multiply, normal;
box-shadow:
inset 0 12px 18px -10px rgba(0, 0, 0, .55),
inset 12px 0 16px -12px rgba(0, 0, 0, .5),
inset -12px 0 16px -12px rgba(0, 0, 0, .5);
}
.jj-issues::after {
content: "";
position: absolute; z-index: 0; pointer-events: none;
left: calc(-1 * var(--jj-pad, 24px));
right: calc(-1 * var(--jj-pad, 24px));
top: 0; bottom: 0;
background:
linear-gradient(180deg,
var(--jj-shelf-a, #d5cdbb) 0%,
var(--jj-shelf-b, #bab09a) 55%,
var(--jj-shelf-c, #8f8673) 100%) top / 100% var(--jj-side, 11px) no-repeat,
linear-gradient(90deg,
var(--jj-shelf-b, #bab09a) 0%,
var(--jj-shelf-a, #d5cdbb) 70%,
var(--jj-shelf-c, #8f8673) 100%) left / var(--jj-side, 11px) 100% no-repeat,
linear-gradient(90deg,
var(--jj-shelf-c, #8f8673) 0%,
var(--jj-shelf-a, #d5cdbb) 30%,
var(--jj-shelf-b, #bab09a) 100%) right / var(--jj-side, 11px) 100% no-repeat,
linear-gradient(180deg,
var(--jj-shelf-a, #d5cdbb) 0%,
var(--jj-shelf-b, #bab09a) 50%,
var(--jj-shelf-c, #8f8673) 100%) bottom / 100% var(--jj-side, 11px) no-repeat;
}
.jj-issue { z-index: 1; }
@media (min-width: 901px) {
.jj-issue:nth-child(3n + 1)::after { left: calc(-1 * var(--jj-pad, 24px) + var(--jj-side, 11px)); }
.jj-issue:nth-child(3n)::after,
.jj-issue:last-child::after { right: calc(-1 * var(--jj-pad, 24px) + var(--jj-side, 11px)); }
}
@media (max-width: 900px) {
.jj-issue:nth-child(2n + 1)::after { left: calc(-1 * var(--jj-pad, 24px) + var(--jj-side, 11px)); }
.jj-issue:nth-child(2n)::after,
.jj-issue:last-child::after { right: calc(-1 * var(--jj-pad, 24px) + var(--jj-side, 11px)); }
}
.jj-issue--noimg .jj-issue__sheet {
background: var(--jj-cover-paper, #f2ece0);
border-color: rgba(244, 241, 233, .18);
}
.jj-issues { padding-top: clamp(26px, 4.4vh, 44px); }
@media (max-width: 600px) {
.jj-issues { --jj-side: 8px; padding-bottom: 22px; }
}
body.jj-cat-page { background: #1a150f; }
body.jj-cat-page::before {
content: "";
position: fixed; inset: 0; z-index: -1;
background-color: #3a2e20;
background-image:
linear-gradient(180deg, rgba(26, 19, 11, .2) 0%, rgba(16, 12, 7, .44) 100%),
linear-gradient(0deg, #d9ba8b 0%, #d9ba8b 100%),
url(shelf.jpg);
background-size: auto, auto, cover;
background-position: center, center, center;
background-blend-mode: normal, multiply, normal;
}
body.jj-cat-page .jj-bar.is-solid {
background: rgba(18, 13, 8, .92);
border-bottom-color: rgba(244, 241, 233, .14);
}
body.jja-body.jj-cat-page .jj-bar.is-solid .jj-bar__logo,
body.jja-body.jj-cat-page .jj-bar.is-solid .jj-trigger { color: #f4f1e9; }
body.jja-body.jj-cat-page .jj-bar.is-solid .jj-trigger__mark i { background: #f4f1e9; }
.jj-cat-page .jj-cathead { border-bottom-color: rgba(244, 241, 233, .2); }
.jj-cat-page .jj-cathead__en { color: #f4f1e9; }
.jj-cat-page .jj-cathead__ja { color: rgba(244, 241, 233, .82); }
.jj-cat-page .jj-cathead__lede { color: rgba(244, 241, 233, .74); }
.jj-cat-page .jj-cathead__count { color: rgba(244, 241, 233, .6); }
.jj-cat-page .jj-cathead__num { color: #f4f1e9; }
.jj-cat-page .jj-models__label { color: rgba(244, 241, 233, .55); }
.jj-cat-page .jj-model {
border-color: rgba(244, 241, 233, .3);
color: rgba(244, 241, 233, .86);
}
.jj-cat-page .jj-model:hover { border-color: #e5cf9d; color: #e5cf9d; }
.jj-cat-page .jj-model.is-on {
background: #f4f1e9; border-color: #f4f1e9; color: #111111;
}
.jj-cat-page .jj-cat .page-numbers {
border-color: rgba(244, 241, 233, .28);
color: rgba(244, 241, 233, .82);
}
.jj-cat-page .jj-cat .page-numbers:hover { border-color: #f4f1e9; color: #f4f1e9; }
.jj-cat-page .jj-cat .page-numbers.current {
background: #f4f1e9; border-color: #f4f1e9; color: #111111;
}
.jj-cat-page .jj-cat .page-numbers.dots { border-color: transparent; }
.jj-cat-page .jj-catfoot { border-top-color: rgba(244, 241, 233, .2); }
.jj-cat-page .jj-catfoot__head { color: rgba(244, 241, 233, .5); }
.jj-cat-page .jj-catfoot__grid { border-top-color: rgba(244, 241, 233, .2); }
.jj-cat-page .jj-catfoot__item {
border-bottom-color: rgba(244, 241, 233, .16);
color: #f4f1e9;
}
.jj-cat-page .jj-catfoot__item:hover { background: rgba(244, 241, 233, .07); }
.jj-cat-page .jj-catfoot__item:hover .jj-catfoot__en { color: #e5cf9d; }
.jj-cat-page .jj-catfoot__ja { color: rgba(244, 241, 233, .72); }
.jj-cat-page .jj-issues__none { color: rgba(244, 241, 233, .78); }
.jj-issues {
--jj-gap: 10px;
--jj-shelf: 14px;
--jj-side: 18px;
row-gap: 14px;
padding-top: 14px;
padding-bottom: 14px;
}
.jj-issue::after {
background: linear-gradient(180deg,
#7d6342 0%,
#6b5537 34%,
#4a3927 62%,
#2c2016 100%);
box-shadow:
inset 0 1px 0 rgba(240, 222, 188, .42),
0 2px 0 rgba(0, 0, 0, .55),
0 13px 16px -8px rgba(0, 0, 0, .72);
}
.jj-issues::before {
background-image:
repeating-linear-gradient(90deg,
rgba(0, 0, 0, .34) 0 1px,
rgba(233, 214, 178, .05) 1px 2px,
transparent 2px 168px),
linear-gradient(180deg, rgba(26, 19, 11, .3) 0%, rgba(16, 12, 7, .5) 100%),
linear-gradient(0deg, #d9ba8b 0%, #d9ba8b 100%),
url(shelf.jpg);
background-size: auto, auto, auto, cover;
background-position: center, center, center, center;
background-repeat: repeat, no-repeat, no-repeat, no-repeat;
background-blend-mode: normal, normal, multiply, normal;
}
body.jj-cat-page::before {
background-image:
repeating-linear-gradient(90deg,
rgba(0, 0, 0, .3) 0 1px,
rgba(233, 214, 178, .045) 1px 2px,
transparent 2px 236px),
linear-gradient(180deg, rgba(26, 19, 11, .2) 0%, rgba(16, 12, 7, .44) 100%),
linear-gradient(0deg, #d9ba8b 0%, #d9ba8b 100%),
url(shelf.jpg);
background-size: auto, auto, auto, cover;
background-position: center, center, center, center;
background-repeat: repeat, no-repeat, no-repeat, no-repeat;
background-blend-mode: normal, normal, multiply, normal;
}
.jj-issue__sheet {
box-shadow:
0 2px 0 rgba(0, 0, 0, .5),
0 11px 14px -9px rgba(0, 0, 0, .8);
}
.jj-issue__link:hover .jj-issue__sheet {
box-shadow:
0 2px 0 rgba(0, 0, 0, .5),
0 20px 24px -12px rgba(0, 0, 0, .75);
}
@media (max-width: 600px) {
.jj-issues {
--jj-gap: 8px;
--jj-shelf: 11px;
--jj-side: 12px;
row-gap: 10px;
padding-top: 10px; padding-bottom: 10px;
}
}
@media (min-width: 901px) {
.jj-issue:last-child:not(:nth-child(3n))::before { content: ""; }
}
@media (max-width: 900px) {
.jj-issue:last-child:not(:nth-child(2n))::before { content: ""; }
}
.jj-issue:last-child::before {
position: absolute; z-index: 2;
right: calc(-1 * var(--jj-gap, 10px) - 15px);
bottom: var(--jj-shelf, 14px);
width: 15px; height: 64%;
background: linear-gradient(90deg, #7d6342 0%, #5b4830 55%, #33261a 100%);
box-shadow:
inset 0 1px 0 rgba(240, 222, 188, .35),
3px 0 8px rgba(0, 0, 0, .5);
}
.jj-issue__link { position: relative; }
.jj-issue__link::after {
content: "";
position: absolute; z-index: 3;
left: calc(-1 * var(--jj-gap, 10px) / 2 - 1px);
right: calc(-1 * var(--jj-gap, 10px) / 2 - 1px);
top: 58%;
height: 5px;
border-radius: 3px;
background: linear-gradient(180deg,
#5a5854 0%,
#23221f 42%,
#121110 72%,
#35332f 100%);
box-shadow:
0 1px 0 rgba(255, 255, 255, .08),
0 4px 7px rgba(0, 0, 0, .55);
}
@media (min-width: 901px) {
.jj-issue:nth-child(3n + 1) .jj-issue__link::after { left: calc(-1 * var(--jj-pad, 24px) + var(--jj-side, 18px)); }
.jj-issue:nth-child(3n) .jj-issue__link::after,
.jj-issue:last-child .jj-issue__link::after { right: calc(-1 * var(--jj-pad, 24px) + var(--jj-side, 18px)); }
}
@media (max-width: 900px) {
.jj-issue:nth-child(2n + 1) .jj-issue__link::after { left: calc(-1 * var(--jj-pad, 24px) + var(--jj-side, 12px)); }
.jj-issue:nth-child(2n) .jj-issue__link::after,
.jj-issue:last-child .jj-issue__link::after { right: calc(-1 * var(--jj-pad, 24px) + var(--jj-side, 12px)); }
}
.jj-issue__link:hover::after { box-shadow: 0 1px 0 rgba(255, 255, 255, .08), 0 8px 12px rgba(0, 0, 0, .6); }
.jj-issues::before {
background-image:
repeating-linear-gradient(0deg,
rgba(0, 0, 0, .34) 0 1px,
rgba(233, 214, 178, .06) 1px 2px,
transparent 2px 132px),
linear-gradient(180deg, rgba(26, 19, 11, .24) 0%, rgba(16, 12, 7, .42) 100%),
linear-gradient(0deg, #d9ba8b 0%, #d9ba8b 100%),
url(shelf.jpg);
}
body.jj-cat-page::before {
background-image:
repeating-linear-gradient(0deg,
rgba(0, 0, 0, .3) 0 1px,
rgba(233, 214, 178, .05) 1px 2px,
transparent 2px 188px),
linear-gradient(180deg, rgba(26, 19, 11, .14) 0%, rgba(16, 12, 7, .34) 100%),
linear-gradient(0deg, #d9ba8b 0%, #d9ba8b 100%),
url(shelf.jpg);
}
@media (max-width: 600px) {
.jj-issue__link::after { height: 4px; top: 60%; }
}
body.jj-cat-page::before {
transform: scale(1.14);
filter: blur(2.5px) brightness(.9) saturate(.92);
}
.jj-issues::before {
box-shadow:
inset 0 14px 20px -10px rgba(0, 0, 0, .6),
inset 14px 0 18px -14px rgba(0, 0, 0, .5),
inset -14px 0 18px -14px rgba(0, 0, 0, .55),
14px 30px 54px -22px rgba(0, 0, 0, .82),
4px 8px 16px -8px rgba(0, 0, 0, .5);
}
.jj-issues::before {
background-image:
radial-gradient(118% 88% at 20% -12%,
rgba(255, 228, 176, .19) 0%,
rgba(255, 228, 176, .06) 38%,
rgba(255, 228, 176, 0) 62%),
radial-gradient(130% 115% at 78% 118%,
rgba(0, 0, 0, .5) 0%,
rgba(0, 0, 0, .18) 45%,
rgba(0, 0, 0, 0) 72%),
repeating-linear-gradient(0deg,
rgba(0, 0, 0, .34) 0 1px,
rgba(233, 214, 178, .06) 1px 2px,
transparent 2px 132px),
linear-gradient(180deg, rgba(26, 19, 11, .24) 0%, rgba(16, 12, 7, .42) 100%),
linear-gradient(0deg, #d9ba8b 0%, #d9ba8b 100%),
url(shelf.jpg);
background-size: auto, auto, auto, auto, auto, cover;
background-position: center, center, center, center, center, center;
background-repeat: no-repeat, no-repeat, repeat, no-repeat, no-repeat, no-repeat;
background-blend-mode: normal, normal, normal, normal, multiply, normal;
}
.jj-issue::after {
background:
linear-gradient(90deg, rgba(255, 235, 200, .16) 0%, rgba(255, 235, 200, .02) 45%, rgba(0, 0, 0, .14) 100%),
linear-gradient(180deg,
#a08157 0%,
#8a6d48 22%,
#6b5537 42%,
#4a3927 70%,
#2a1e14 100%);
box-shadow:
inset 0 1px 0 rgba(255, 240, 210, .5),
0 2px 0 rgba(0, 0, 0, .5),
4px 15px 18px -8px rgba(0, 0, 0, .74);
}
.jj-issues::after {
background:
linear-gradient(180deg,
#a68757 0%, #8a6d48 30%, #5c4830 70%, #33261a 100%)
top / 100% var(--jj-side, 18px) no-repeat,
linear-gradient(90deg,
#8d7049 0%, #6b5537 55%, #33261a 100%)
left / var(--jj-side, 18px) 100% no-repeat,
linear-gradient(90deg,
#241a12 0%, #4a3927 45%, #63502f 100%)
right / var(--jj-side, 18px) 100% no-repeat,
linear-gradient(180deg,
#6b5537 0%, #4a3927 40%, #241a12 100%)
bottom / 100% var(--jj-side, 18px) no-repeat;
}
.jj-issue__sheet::before {
content: "";
position: absolute; inset: 0; z-index: 4;
pointer-events: none;
background: linear-gradient(118deg,
rgba(255, 246, 226, .17) 0%,
rgba(255, 246, 226, .05) 24%,
rgba(255, 246, 226, 0) 46%);
}
.jj-issue__sheet {
box-shadow:
0 2px 0 rgba(0, 0, 0, .5),
5px 12px 16px -9px rgba(0, 0, 0, .8);
}
.jj-issue__link:hover .jj-issue__sheet {
box-shadow:
0 2px 0 rgba(0, 0, 0, .5),
9px 22px 26px -12px rgba(0, 0, 0, .75);
}
.jj-issue__link::after {
background: linear-gradient(180deg,
#6e6b64 0%, #33312d 34%, #121110 66%, #3d3a35 100%);
box-shadow:
0 1px 0 rgba(255, 246, 226, .14),
3px 5px 8px rgba(0, 0, 0, .6);
}
body.jj-cat-page::before {
transform: scale(1.06);
filter: blur(1.2px) brightness(1.02) saturate(.98);
background-image:
repeating-linear-gradient(0deg,
rgba(62, 43, 26, .22) 0 1px,
rgba(240, 224, 194, .04) 1px 2px,
transparent 2px 188px),
linear-gradient(180deg, rgba(46, 34, 20, .06) 0%, rgba(34, 25, 15, .2) 100%),
linear-gradient(0deg, #e6cda2 0%, #e6cda2 100%),
url(shelf.jpg);
}
.jj-issues::before {
background-image:
radial-gradient(118% 88% at 20% -12%,
rgba(255, 236, 198, .13) 0%,
rgba(255, 236, 198, .04) 40%,
rgba(255, 236, 198, 0) 64%),
radial-gradient(130% 115% at 78% 118%,
rgba(46, 32, 19, .3) 0%,
rgba(46, 32, 19, .1) 48%,
rgba(46, 32, 19, 0) 74%),
repeating-linear-gradient(0deg,
rgba(58, 40, 24, .24) 0 1px,
rgba(240, 224, 194, .045) 1px 2px,
transparent 2px 132px),
linear-gradient(180deg, rgba(46, 34, 20, .12) 0%, rgba(34, 25, 15, .26) 100%),
linear-gradient(0deg, #e0c398 0%, #e0c398 100%),
url(shelf.jpg);
box-shadow:
inset 0 12px 20px -12px rgba(40, 28, 16, .42),
inset 12px 0 18px -16px rgba(40, 28, 16, .34),
inset -12px 0 18px -16px rgba(40, 28, 16, .38),
12px 26px 46px -24px rgba(38, 27, 16, .55),
3px 6px 14px -10px rgba(38, 27, 16, .35);
}
.jj-issue::after {
background:
linear-gradient(90deg, rgba(255, 240, 214, .08) 0%, rgba(255, 240, 214, .01) 50%, rgba(58, 40, 24, .1) 100%),
linear-gradient(180deg,
#a3855c 0%,
#90754f 26%,
#7a6242 52%,
#63503a 78%,
#4e3f2b 100%);
box-shadow:
inset 0 1px 0 rgba(255, 244, 220, .2),
0 1px 0 rgba(52, 37, 22, .34),
3px 11px 16px -10px rgba(40, 28, 16, .5);
}
.jj-issues::after {
background:
linear-gradient(180deg, #a98a5e 0%, #93784f 34%, #7a6242 72%, #5d4a33 100%)
top / 100% var(--jj-side, 18px) no-repeat,
linear-gradient(90deg, #9b7f55 0%, #856c47 55%, #635035 100%)
left / var(--jj-side, 18px) 100% no-repeat,
linear-gradient(90deg, #5b4931 0%, #7a6242 45%, #8f7550 100%)
right / var(--jj-side, 18px) 100% no-repeat,
linear-gradient(180deg, #8b7149 0%, #6f5a3c 45%, #503f2b 100%)
bottom / 100% var(--jj-side, 18px) no-repeat;
}
.jj-issue__sheet::before {
background: linear-gradient(118deg,
rgba(255, 248, 232, .07) 0%,
rgba(255, 248, 232, .02) 26%,
rgba(255, 248, 232, 0) 48%);
}
.jj-issue__sheet {
box-shadow:
0 1px 0 rgba(52, 37, 22, .3),
5px 13px 20px -11px rgba(40, 28, 16, .58);
}
.jj-issue__link:hover .jj-issue__sheet {
box-shadow:
0 1px 0 rgba(52, 37, 22, .3),
8px 22px 28px -14px rgba(40, 28, 16, .55);
}
.jj-issue__link::after {
background: linear-gradient(180deg,
#5f5b53 0%, #46433c 38%, #322f2a 70%, #4a4740 100%);
box-shadow:
0 1px 0 rgba(255, 248, 232, .1),
2px 4px 7px rgba(40, 28, 16, .42);
}
.jj-issue__link:hover::after {
box-shadow:
0 1px 0 rgba(255, 248, 232, .1),
4px 8px 11px rgba(40, 28, 16, .45);
}
.jj-issue:last-child::before {
background: linear-gradient(90deg, #9b7f55 0%, #7a6242 55%, #5b4931 100%);
box-shadow:
inset 0 1px 0 rgba(255, 244, 220, .18),
3px 0 7px rgba(40, 28, 16, .38);
}
.jj-issues {
--jj-shelf: 30px;
--jj-side: min(32px, calc(var(--jj-pad, 24px) - 8px));
row-gap: 48px;
padding-bottom: 44px;
}
.jj-issue::after {
bottom: -38px;
height: 68px;
background: url(rack-shelf.png) center top / 100% 100% no-repeat;
filter: drop-shadow(0 9px 11px rgba(10, 8, 6, .5));
box-shadow: none;
}
.jj-issue__link::after {
height: 14px;
border-radius: 0;
background: url(rack-rail.png) center / 100% 100% no-repeat;
box-shadow: 0 7px 11px -5px rgba(20, 14, 8, .5);
}
.jj-issue__link:hover::after {
box-shadow: 0 10px 14px -5px rgba(20, 14, 8, .5);
}
.jj-issues::after {
background:
url(rack-shelf.png) top / 100% 34px no-repeat,
url(rack-post.png) left top / var(--jj-side, 32px) auto no-repeat,
url(rack-post.png) right top / var(--jj-side, 32px) auto no-repeat,
url(rack-shelf.png) bottom / 100% 34px no-repeat;
}
@media (min-width: 901px) {
.jj-issue:nth-child(3n + 1)::after { left: calc(-1 * var(--jj-pad, 24px) + var(--jj-side, 32px)); }
.jj-issue:nth-child(3n)::after,
.jj-issue:last-child::after { right: calc(-1 * var(--jj-pad, 24px) + var(--jj-side, 32px)); }
}
@media (max-width: 900px) {
.jj-issue:nth-child(2n + 1)::after { left: calc(-1 * var(--jj-pad, 24px) + var(--jj-side, 32px)); }
.jj-issue:nth-child(2n)::after,
.jj-issue:last-child::after { right: calc(-1 * var(--jj-pad, 24px) + var(--jj-side, 32px)); }
}
@media (max-width: 600px) {
.jj-issues {
--jj-shelf: 20px;
row-gap: 34px;
padding-bottom: 30px;
}
.jj-issue::after { bottom: -26px; height: 46px; }
.jj-issue__link::after { height: 10px; }
}
body.jj-cat-page {
background: #22221f;
--jj-wall-dim: rgba(16, 16, 15, .76);
--jj-wall-dim-in: rgba(16, 16, 15, .82);
}
body.jj-cat-page::before {
transform: scale(1.06);
filter: blur(1.2px) brightness(1) saturate(1);
background-color: #22221f;
background-image:
radial-gradient(92% 62% at 50% 4%,
rgba(255, 226, 176, .1) 0%,
rgba(255, 226, 176, .03) 44%,
rgba(255, 226, 176, 0) 68%),
radial-gradient(120% 100% at 50% 108%,
rgba(18, 13, 9, .5) 0%,
rgba(18, 13, 9, .16) 46%,
rgba(18, 13, 9, 0) 74%),
linear-gradient(var(--jj-wall-dim), var(--jj-wall-dim)),
url(rack-wall.jpg);
background-size: auto, auto, auto, cover;
background-position: center, center, center, center;
background-repeat: no-repeat, no-repeat, no-repeat, no-repeat;
background-blend-mode: normal, normal, normal, normal;
}
.jj-issues::before {
background-color: #1b1b19;
background-image:
radial-gradient(116% 86% at 20% -10%,
rgba(255, 236, 198, .09) 0%,
rgba(255, 236, 198, .03) 42%,
rgba(255, 236, 198, 0) 66%),
radial-gradient(130% 112% at 78% 116%,
rgba(14, 10, 7, .42) 0%,
rgba(14, 10, 7, .14) 48%,
rgba(14, 10, 7, 0) 74%),
linear-gradient(180deg, rgba(20, 14, 10, .2) 0%, rgba(14, 10, 7, .34) 100%),
linear-gradient(var(--jj-wall-dim-in), var(--jj-wall-dim-in)),
url(rack-wall.jpg);
background-size: auto, auto, auto, auto, cover;
background-position: center, center, center, center, center;
background-repeat: no-repeat, no-repeat, no-repeat, no-repeat, no-repeat;
background-blend-mode: normal, normal, normal, normal, normal;
}
.jj-issues::before,
.jj-issues::after { display: none; }
.jj-issue:last-child::before { display: none; }
.jj-issue__link::after { display: none; }
.jj-issues {
--jj-unit-h: 92px;
--jj-shelf: 29px;
--jj-unit-drop: calc(var(--jj-unit-h) * .378 - var(--jj-shelf) - 2px);
--jj-brk-gap: calc(var(--jj-unit-h) * .08);
--jj-brk-l: calc(var(--jj-unit-h) * .304 + var(--jj-brk-gap));
--jj-brk-r: calc(var(--jj-unit-h) * .297 + var(--jj-brk-gap));
row-gap: 30px;
padding-top: 26px;
padding-bottom: 16px;
}
.jj-issue::after {
bottom: calc(-1 * var(--jj-unit-drop));
height: var(--jj-unit-h);
z-index: 3;
background:
url(front-m.png) center top / auto 100% repeat-x;
box-shadow: none;
filter: drop-shadow(3px 6px 7px rgba(20, 14, 8, .5));
}
@media (min-width: 901px) {
.jj-issues { padding-left: var(--jj-brk-l); padding-right: var(--jj-brk-r); }
.jj-issue:nth-child(3n + 1)::after { left: calc(-1 * var(--jj-brk-l)); }
.jj-issue:nth-child(3n)::after,
.jj-issue:last-child::after { right: calc(-1 * var(--jj-brk-r)); }
.jj-issue:nth-child(3n + 1)::after {
background:
url(front-l.png) left top / auto 100% no-repeat,
url(front-m.png) center top / auto 100% repeat-x;
}
.jj-issue:nth-child(3n)::after,
.jj-issue:last-child::after {
background:
url(front-r.png) right top / auto 100% no-repeat,
url(front-m.png) center top / auto 100% repeat-x;
}
.jj-issue:nth-child(3n + 1):last-child::after {
background:
url(front-l.png) left top / auto 100% no-repeat,
url(front-r.png) right top / auto 100% no-repeat,
url(front-m.png) center top / auto 100% repeat-x;
}
}
@media (max-width: 900px) {
.jj-issues { padding-left: var(--jj-brk-l); padding-right: var(--jj-brk-r); }
.jj-issue:nth-child(2n + 1)::after { left: calc(-1 * var(--jj-brk-l)); }
.jj-issue:nth-child(2n)::after,
.jj-issue:last-child::after { right: calc(-1 * var(--jj-brk-r)); }
.jj-issue:nth-child(2n + 1)::after {
background:
url(front-l.png) left top / auto 100% no-repeat,
url(front-m.png) center top / auto 100% repeat-x;
}
.jj-issue:nth-child(2n)::after,
.jj-issue:last-child::after {
background:
url(front-r.png) right top / auto 100% no-repeat,
url(front-m.png) center top / auto 100% repeat-x;
}
}
@media (max-width: 600px) {
.jj-issues { --jj-unit-h: 62px; --jj-shelf: 14px; row-gap: 18px; padding-top: 18px; }
}
.jj-issue__sheet { padding-bottom: 46px; }
@media (max-width: 600px) { .jj-issue__sheet { padding-bottom: 32px; } }
.jj-issue__body { order: 0; }
.jj-issue__band { order: 1; }
.jj-issue__veil {
background: linear-gradient(180deg,
rgba(8, 9, 6, .82) 0%,
rgba(8, 9, 6, .66) 26%,
rgba(8, 9, 6, .28) 48%,
rgba(8, 9, 6, .1) 66%,
rgba(8, 9, 6, .5) 100%);
}
.jj-issue__band { align-items: flex-end; }
.jj-issues {
--jj-gap: 26px;
row-gap: 56px;
padding-top: 44px;
padding-bottom: 18px;
}
@media (min-width: 901px) {
.jj-issue:last-child:nth-child(3n + 2)::after {
right: calc(-100% - var(--jj-gap) - var(--jj-pad, 24px) + var(--jj-side, 32px));
}
.jj-issue:last-child:nth-child(3n + 1)::after {
right: calc(-200% - 2 * var(--jj-gap) - var(--jj-pad, 24px) + var(--jj-side, 32px));
}
}
@media (max-width: 900px) {
.jj-issue:last-child:nth-child(2n + 1)::after {
right: calc(-100% - var(--jj-gap) - var(--jj-pad, 24px) + var(--jj-side, 32px));
}
}
@media (max-width: 600px) {
.jj-issues {
--jj-gap: 14px;
row-gap: 36px;
padding-top: 28px;
padding-bottom: 12px;
}
}
.jj-issues {
--jj-gap: 34px;
row-gap: 72px;
padding-top: 56px;
padding-bottom: 22px;
}
.jj-issue__sheet {
box-shadow:
inset 7px 0 12px -7px rgba(0, 0, 0, .6),
inset -1px 0 0 rgba(255, 248, 232, .07),
0 1px 0 rgba(52, 37, 22, .3),
6px 15px 22px -12px rgba(20, 14, 8, .7);
}
.jj-issue__sheet::after {
content: "";
position: absolute; z-index: 5;
top: 3px; bottom: 0; right: 0; width: 6px;
background:
repeating-linear-gradient(180deg,
rgba(255, 250, 238, .5) 0 1px,
rgba(105, 96, 82, .45) 1px 2px),
linear-gradient(90deg, rgba(0, 0, 0, .3) 0%, rgba(255, 250, 238, .45) 100%);
}
.jj-issue__sheet::before {
content: "";
position: absolute; inset: 0; z-index: 4;
pointer-events: none;
background:
linear-gradient(180deg,
rgba(255, 250, 238, .38) 0 1px,
rgba(120, 110, 95, .3) 1px 3px,
rgba(255, 250, 238, 0) 3px),
linear-gradient(118deg,
rgba(255, 248, 232, .08) 0%,
rgba(255, 248, 232, .02) 26%,
rgba(255, 248, 232, 0) 48%);
}
.jj-issue__sheet { transform-origin: 50% 100%; }
.jj-issue:nth-child(3n + 1) .jj-issue__sheet { transform: rotate(-.45deg); }
.jj-issue:nth-child(3n + 2) .jj-issue__sheet { transform: rotate(.3deg); }
.jj-issue:nth-child(3n)     .jj-issue__sheet { transform: rotate(-.15deg); }
@media (prefers-reduced-motion: reduce) {
.jj-issue__sheet { transform: none; }
}
@media (max-width: 600px) {
.jj-issues { --jj-gap: 18px; row-gap: 44px; padding-top: 32px; }
.jj-issue__sheet::after { width: 4px; }
}
.jj-issue__sheet { justify-content: flex-start; }
.jj-issue__mast {
position: relative; z-index: 2;
display: flex; align-items: baseline; justify-content: space-between;
gap: 10px;
padding-bottom: 9px;
margin-bottom: 13px;
border-bottom: 1px solid rgba(244, 241, 233, .34);
text-shadow: 0 1px 3px rgba(8, 9, 6, .5);
}
.jj-issue__logo {
font-family: var(--jc-logo, sans-serif), sans-serif;
font-size: clamp(.86rem, 1.15vw, 1.1rem);
letter-spacing: .1em;
color: #f4f1e9;
line-height: 1;
}
.jj-issue__date {
margin-left: 0;
font-family: var(--jc-mono, monospace), monospace;
font-size: .58rem; letter-spacing: .12em;
color: rgba(244, 241, 233, .72);
}
.jj-issue__cat { margin-bottom: 10px; }
.jj-issue__title {
font-size: clamp(1.12rem, 1.55vw, 1.52rem);
line-height: 1.42;
letter-spacing: .01em;
-webkit-line-clamp: 4;
}
.jj-issue__lede {
position: relative;
margin-top: 11px;
padding-left: 13px;
font-size: .73rem;
line-height: 1.7;
color: rgba(244, 241, 233, .84);
}
.jj-issue__lede::before {
content: "";
position: absolute; left: 0; top: .55em;
width: 5px; height: 5px;
background: var(--jc-accent, #a8760a);
}
.jj-issue__band { margin-top: auto; }
.jj-issue--noimg .jj-issue__mast {
border-bottom-color: rgba(23, 26, 21, .22);
text-shadow: none;
}
.jj-issue--noimg .jj-issue__logo { color: var(--jc-ink-primary, #111111); }
.jj-issue--noimg .jj-issue__date { color: var(--jc-ink-mark, #7c8474); }
.jj-issue--noimg .jj-issue__lede { color: var(--jc-ink-secondary, #55554f); }
@media (max-width: 600px) {
.jj-issue__mast { padding-bottom: 6px; margin-bottom: 9px; }
.jj-issue__logo { font-size: .72rem; }
.jj-issue__date { font-size: .5rem; }
.jj-issue__title { font-size: 1rem; -webkit-line-clamp: 4; }
.jj-issue__lede { display: none; }
}
.jj-issue__logo--img { display: block; line-height: 0; }
body.jja-body .jj-issue__logo--img img {
height: clamp(13px, 1.45vw, 19px);
width: auto;
max-width: 62%;
display: block;
}
body.jja-body .jj-issue--noimg .jj-issue__logo--img img {
filter: brightness(0) saturate(0);
opacity: .82;
}
@media (max-width: 600px) {
body.jja-body .jj-issue__logo--img img { height: 11px; max-width: 58%; }
}
.jj-issue__mast {
display: block;
padding-bottom: 0;
margin-bottom: clamp(14px, 1.6vw, 22px);
border-bottom: 0;
}
body.jja-body .jj-issue__logo--img img {
width: 74%;
max-width: 74%;
height: auto;
}
.jj-issue__logo {
font-size: clamp(1.5rem, 2.5vw, 2.3rem);
letter-spacing: .04em;
line-height: .96;
}
.jj-cat-page { --jc-accent-light: #d9a92a; }
.jj-issue__cat { color: var(--jc-accent-light, #d9a92a); margin-bottom: 12px; }
.jj-issue__cat i { opacity: .5; }
.jj-issue--noimg .jj-issue__cat { color: var(--jc-accent, #a8760a); }
.jj-issue__title {
font-size: clamp(1.24rem, 1.85vw, 1.78rem);
line-height: 1.36;
-webkit-line-clamp: 3;
}
.jj-issue__lede { margin-top: 13px; -webkit-line-clamp: 2; }
.jj-issue__band {
display: flex; align-items: flex-end; justify-content: space-between;
gap: 10px;
padding-top: 10px;
border-top: 1px solid rgba(244, 241, 233, .22);
}
.jj-issue--noimg .jj-issue__band { border-top-color: rgba(23, 26, 21, .16); }
.jj-issue__date { margin-left: auto; }
@media (max-width: 600px) {
body.jja-body .jj-issue__logo--img img { width: 72%; max-width: 72%; }
.jj-issue__logo { font-size: .95rem; }
.jj-issue__mast { margin-bottom: 8px; }
.jj-issue__cat { margin-bottom: 6px; }
.jj-issue__title { font-size: .94rem; line-height: 1.4; -webkit-line-clamp: 2; }
.jj-issue__band { padding-top: 7px; }
}
.jj-issue__date {
font-family: var(--jc-font, sans-serif), sans-serif;
font-size: .62rem;
letter-spacing: .1em;
white-space: nowrap;
}
@media (max-width: 600px) {
.jj-issue__date { font-size: .54rem; letter-spacing: .04em; }
}
@media (max-width: 600px) {
.jj-issues {
grid-template-columns: 1fr;
--jj-unit-h: 78px;
--jj-shelf: 18px;
row-gap: 44px;
}
.jj-issue::after,
.jj-issue:nth-child(2n + 1)::after,
.jj-issue:nth-child(2n)::after,
.jj-issue:last-child::after {
left: calc(-1 * var(--jj-brk-l));
right: calc(-1 * var(--jj-brk-r));
background:
url(front-l.png) left top / auto 100% no-repeat,
url(front-r.png) right top / auto 100% no-repeat,
url(front-m.png) center top / auto 100% repeat-x;
}
body.jja-body .jj-issue__logo--img img { width: 64%; max-width: 64%; }
.jj-issue__logo { font-size: 1.5rem; }
.jj-issue__mast { margin-bottom: 14px; }
.jj-issue__cat { margin-bottom: 10px; font-size: .56rem; letter-spacing: .22em; }
.jj-issue__cat span:first-child { font-size: .7rem; }
.jj-issue__title {
font-size: 1.24rem;
line-height: 1.44;
-webkit-line-clamp: 3;
}
.jj-issue__lede { display: block; font-size: .76rem; -webkit-line-clamp: 2; }
.jj-issue__date { font-size: .6rem; letter-spacing: .08em; }
.jj-issue__sheet { padding: 16px; padding-bottom: 40px; }
.jj-issue__band { padding-top: 9px; }
}
.jj-catfoot__grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: clamp(10px, 1.2vw, 18px);
border-top: 0;
}
.jj-cat-page .jj-catfoot__grid { border-top: 0; }
.jj-catfoot__item {
--jj-plate-h: 58px;
position: relative;
display: flex; align-items: center; justify-content: center;
gap: 10px;
min-height: var(--jj-plate-h);
padding: 0 calc(var(--jj-plate-h) * .43 + 12px);
border-bottom: 0;
filter: drop-shadow(2px 3px 4px rgba(20, 14, 8, .5));
transition: filter .18s ease, transform .18s ease;
}
.jj-cat-page .jj-catfoot__item { border-bottom: 0; }
.jj-catfoot__item:hover {
filter: drop-shadow(2px 5px 7px rgba(20, 14, 8, .6)) brightness(1.08);
transform: translateY(-1px);
}
.jj-catfoot__en {
font-size: clamp(.78rem, .95vw, .92rem);
letter-spacing: .12em;
line-height: 1;
}
.jj-cat-page .jj-catfoot__ja,
.jj-catfoot__ja {
font-size: .72rem;
letter-spacing: .14em;
line-height: 1;
}
@media (max-width: 900px) {
.jj-catfoot__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
.jj-catfoot__grid { grid-template-columns: 1fr; gap: 12px; }
.jj-catfoot__item { --jj-plate-h: 52px; }
}
.jj-cathead {
border-bottom: 0;
padding-bottom: calc(clamp(18px, 3.4vh, 34px) + 18px);
background: url(line.png) bottom center / 100% 16px no-repeat;
}
.jj-cat-page .jj-cathead { border-bottom-color: transparent; }
@media (max-width: 600px) {
.jj-cathead {
padding-bottom: 30px;
background-size: 100% 12px;
}
}
.jj-catfoot__head {
font-family: var(--jc-logo, sans-serif), sans-serif;
font-size: .74rem;
letter-spacing: .26em;
margin-bottom: 18px;
}
.jj-catfoot__item { padding: 0 calc(var(--jj-plate-h) * .275 + 6px); }
.jj-cat-page .jj-catfoot__item,
.jj-catfoot__item { color: #f0ece1; }
.jj-cat-page .jj-catfoot__ja,
.jj-catfoot__ja { color: rgba(240, 236, 225, .74); }
.jj-cat-page .jj-catfoot__item:hover .jj-catfoot__en,
.jj-catfoot__item:hover .jj-catfoot__en { color: var(--jc-accent, #a8760a); }
.jj-cat .page-numbers.prev,
.jj-cat .page-numbers.next {
font-family: var(--jc-logo, sans-serif), sans-serif;
font-size: .72rem;
letter-spacing: .18em;
padding: 0 18px;
}
body.jj-cat-page { position: relative; }
body.jj-cat-page::before {
position: absolute;
inset: 0;
transform: none;
filter: blur(1.1px) brightness(1) saturate(1);
}
body.jj-cat-page::before { display: none; }
.jj-wall {
position: fixed;
top: 0; left: 0; right: 0;
z-index: -1;
will-change: transform;
height: 115vh;
background-color: #241d17;
background-image:
radial-gradient(92% 62% at 50% 4%,
rgba(255, 226, 176, .1) 0%,
rgba(255, 226, 176, .03) 44%,
rgba(255, 226, 176, 0) 68%),
radial-gradient(120% 100% at 50% 108%,
rgba(18, 13, 9, .5) 0%,
rgba(18, 13, 9, .16) 46%,
rgba(18, 13, 9, 0) 74%),
url(rack-wall.jpg);
background-size: auto, auto, cover;
background-position: center, center, center;
background-repeat: no-repeat, no-repeat, no-repeat;
filter: blur(1.1px);
}
body.jja-body.jc-article-page .jj-bar.is-solid{
background-color: #1d1712;
background-image:
linear-gradient(180deg, rgba(14, 10, 7, .58) 0%, rgba(14, 10, 7, .72) 100%),
url(rack-wall.jpg);
background-size: auto, cover;
background-position: center, center;
background-repeat: no-repeat, no-repeat;
border-color: rgba(244, 241, 233, .16);
box-shadow: none;
}
body.jja-body.jc-article-page .jj-bar.is-solid .jj-bar__logo,
body.jja-body.jc-article-page .jj-bar.is-solid .jj-trigger { color: #f4f1e9; }
body.jja-body.jc-article-page .jj-bar.is-solid .jj-trigger__mark i { background: #f4f1e9; }
body.jja-body .jj-foot {
display: flex; align-items: center; flex-wrap: wrap;
gap: clamp(16px, 2.4vw, 34px);
padding: clamp(20px, 3vh, 34px) clamp(18px, 3.4vw, 48px);
background-color: #1d1712;
background-image:
linear-gradient(180deg, rgba(14, 10, 7, .6) 0%, rgba(14, 10, 7, .78) 100%),
url(rack-wall.jpg);
background-size: auto, cover;
background-position: center, center;
background-repeat: no-repeat, no-repeat;
color: #f4f1e9;
border-top: 1px solid rgba(244, 241, 233, .14);
}
body.jja-body .jj-foot__sns { display: flex; gap: 18px; }
body.jja-body .jj-foot__sns a {
font-family: var(--jc-logo, sans-serif), sans-serif;
font-weight: 700; font-size: .62rem; letter-spacing: .16em;
color: #f4f1e9; text-decoration: none;
padding: 6px 2px;
opacity: .82;
}
body.jja-body .jj-foot__sns a:hover { opacity: 1; color: #e5cf9d; }
body.jja-body .jj-foot__note {
margin: 0; max-width: 42em;
font-family: var(--jc-font, sans-serif), sans-serif;
font-size: .66rem; line-height: 1.9; letter-spacing: .03em;
color: rgba(244, 241, 233, .62);
}
body.jja-body .jj-foot__cr {
margin: 0 0 0 auto;
font-family: var(--jc-mono, monospace), monospace;
font-size: .58rem; letter-spacing: .14em;
color: rgba(244, 241, 233, .5);
}
@media (max-width: 600px) {
body.jja-body .jj-foot { flex-direction: column; align-items: flex-start; gap: 14px; }
body.jja-body .jj-foot__cr { margin: 0; }
body.jja-body .jj-foot__sns a {
display: inline-flex; align-items: center;
min-height: 32px; padding: 6px 4px;
}
}
.jj-catfoot__item,
.jj-catfoot__item:hover,
.jj-cat-page .jj-catfoot__item:hover {
background: none;
border-style: solid;
border-color: transparent;
border-width: calc(var(--jj-plate-h) * .275);
border-image-source: url(plate.png);
border-image-slice: 42 fill;
border-image-repeat: stretch;
padding: 0 8px;
}
body.jja-body .jj-foot__sns { gap: 20px; }
body.jja-body .jj-foot__sns .jj-sns {
display: inline-block;
width: 19px; height: 19px;
padding: 0;
background-position: center;
background-repeat: no-repeat;
background-size: contain;
opacity: .82;
transition: opacity .18s ease, transform .18s ease;
}
body.jja-body .jj-foot__sns .jj-sns:hover { opacity: 1; transform: translateY(-1px); }
body.jja-body .jj-foot__sns .jj-sns span { position: absolute; left: -9999px; }
body.jja-body .jj-sns--x { background-image: url("data:image/webp;base64,UklGRgILAABXRUJQVlA4WAoAAAAwAAAAXwAAXwAASUNDUMgBAAAAAAHIAAAAAAQwAABtbnRyUkdCIFhZWiAH4AABAAEAAAAAAABhY3NwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAQAA9tYAAQAAAADTLQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAlkZXNjAAAA8AAAACRyWFlaAAABFAAAABRnWFlaAAABKAAAABRiWFlaAAABPAAAABR3dHB0AAABUAAAABRyVFJDAAABZAAAAChnVFJDAAABZAAAAChiVFJDAAABZAAAAChjcHJ0AAABjAAAADxtbHVjAAAAAAAAAAEAAAAMZW5VUwAAAAgAAAAcAHMAUgBHAEJYWVogAAAAAAAAb6IAADj1AAADkFhZWiAAAAAAAABimQAAt4UAABjaWFlaIAAAAAAAACSgAAAPhAAAts9YWVogAAAAAAAA9tYAAQAAAADTLXBhcmEAAAAAAAQAAAACZmYAAPKnAAANWQAAE9AAAApbAAAAAAAAAABtbHVjAAAAAAAAAAEAAAAMZW5VUwAAACAAAAAcAEcAbwBvAGcAbABlACAASQBuAGMALgAgADIAMAAxADZBTFBI5wUAAAGgv23b2Uhf05Oknaad6Rhr27Zt27bt3c+2bdu217ZmvtWYZfD8MGme930zETEBIKQnpWbrOQ988t/FgqBuRAov/vPRvbNa1UiOg6rR33nBk39cM5BsXPvlkbntfY5TWt5x6FoYmYdyDuxoLDtI9g7/00Du0W/6qZIz5MYrjxgopP7PgrqSA6rvOxlFYcOHN6YLNybHQKGN832FcrX9zEThjdeaKsKo6y+a6EDj1EKXILW/D6FDA++kiSB1OY7ONf9qxc89MxsdfWakzMmzuQwdXrjAxcW9IYiOL1ugcIjbEMAqsGiei5l7YxCrxNIFMiNpVhlWkQUjGHXJxsqBg3+Q/wyxKvmDfjRUCU+3YlLnBFoWTfN5qfF3m2yiy7zkhFUVFvhXGgPfTxjzZCqQvb+weScOyLX/R2vzXRfJtTkcC1/1kKDbdRZnWwI5/nuMHVikUNpfRpv6Ipnk2aHRIvMVknsX2j3VlPKVaQezO5PA/zvtDRXIA3NtGa8TJiPxk2QSVMujXPACOesXtG/0tlX7BiW8lgYzSu3lDgCydJdOwLPpNpR7DAoWdqP5X9HtRO9TaSPLkapvlGI1O4P0SykkqJ9j51QqkGveQvqRujHk9RoD7TEfCcYFYhV1A7L/VYNBeL5kFX8KWeaPoCn3GVaRVUCfVoIs/1KtJhlM8KJKgvTfrD7w05JvIFO9h4XrADJ+30uCgbcqXe4I5ISfkPFXcqUOJitzuUKK24eI5iKZ5N6KrKMNKz2MzC93JEHCH4hveoDc8xoz3AIAqcfY4ScJJKhx86wfyEnfI/t/vQC9bnLQNkokedIQiSTvMzhktwVpRZQDlvUlgcsF5GEB5BiYBd4XkevJLBLD2ueQ6wPutP18og96efme1Pj8kFy7gA8WDuM1rhj5Xq7ezeSE15L4pOUi52ijlcj90wQe/m+Q+/hn+IVWuNi514X47fmWH15uxa5tNvJ//YQA+GUcK893KOBPuSIY2xU2ym5ThOMREbB8EJshFShiDoq5vyaLWgdQyEJBonsUmrJXEyNsiBHexGJzWAw9JMZv6cAw43cxQgVCFHcDpt1LhMi/KIK2VGIjrdBEOP+PCG+6gLH7PRH+/ECAU42BedOzArx7D7+KWQo7ZX6A3x3T+b3oBY6+N/lNbq7zOqcC1/grvLQmNXI43eoBnPvncbpSPeVXPuG9Hl7q3RE+PybHPcrnQDJwzzjG5wE3zA3xKOwAZJeLBD1LeQRmAnT8n0NoAZDlSUMkEqyNcshuAxC/n8OrXlrNm+cSafEfcvhHBYCd7E63BHLC34jvqSTocIndegCAJhorfYZM8tyBiOZyhaQsM1lF6lWSv2X1tAfIQ3IREa92IYH3fVYfS5Wgn87mmALkjD/R8tMkEqiX2GgdwFL9l8mNvkBWHjatopskEozMZ/KLx0peFGYQvUOlTQ1hzJK+NN8TGoPADMkK6h1lcNwH5CbX0eaFLBKkXWWwvybElLYZpFstgJz0lmFHe8xHgl7FJH052My8QKmYB/SF5Wi7YCQNNkcoR1PswADTnvlGAq1uMRKzE2mpXxK0DmD/HcPWhVZATjmE5M98JOh+zZb+FBCbn7ETmSKR1Ds1WnS1m6SsNuwcaUhRlgZtPOwGcr9cZHilPQnU921UTFco4P7ItDL/SwJywgFk+qVKgswLMYwXZKBn/GtVND0jnZr5NLI1tqWTM1eWW5jf+4Flm3MWwRMHyIeijLDiAP102OJIY2A7rqhSVZg7EBgryyqqhqJpEitwLy+tCnIny8DetazceYWTZeDpXlHstNwpMvBVxp93lHm4vwTc2+43nWP80BhEzPoi6JTyFxNBzLiV5wwn6IenyiCqq+UHpnja4w1kEHnYZUMs/WgHED1r1/GIOIH9y5JBfLnhsoOGGNqvM2qCM2V10E86v9CHHT0SOFduftuha2F2gey/19WTwOn+Lgue+OOaQdOv/vjgrLYqVI2e1JotZ9730X8XC4J6NFJw/q/375jSrHqyG4QEAFZQOCAkAwAAkBMAnQEqYABgAD4xFIdCv6EMd8pA/AGCWdsMmFQDoA9DuIAF/qccx1PXnsdMA3kO/RvoAzwDUQ7Q3YnLbhgmbfJP6vPoAfsAPpAKuySg5Ld90KtPUcEiVr1ecugR5BSQfthM5II4N7EHo4QEeL8l2aupELHSlp6JASkBspYPD9XtlYGGVrQ2OgZZeq4mAq5HffFyufKGGjowk/Nc+00gswWy8rkAAP7rd3/4kNw42KvdaHoxzw0a9jkKIPRxTWBrMzfKYGepbA7EljvvmPVDwDKNvdymqN24c0QpdUdtYCPEtqbxgW+WqbTw8AQ+G29fN3p4O88r69/rdpSMP7zT4b5541rBi370MeY6GnvJRfCWzZsXVYpy7aUSDVe/ukkDz+UAMf1pMWT2AuOK5hhDlHbq66XBxKl201F94AdSX5ksh6M+hAhyJDf8P5t62448WpE50qdwRAQZnvwXR2t6gYz4oAcH51d9Is8RtQxmTdwcy15BW6PXH/rhprqsz3RH5WlVewedRa/JNWGVb9iNsAJNENoUOIYoRAJrgbWchjjnbDCe4/8QodG+vm8nYwBDlgHgyAx0s8NE7SMh0uephXVlH+xEH7GLaoobiM59YiXLijIhncCnwbT2AbglSmhw/xYYXEWKtEHDz8NcAQcgJddIwF76mGI9UJ71bh5MS7uW/M+Rgvqj8JJSdXzWhG5CMsKoX8Op2l0cGjruBTPm+FoFwlciwRZQATpNx0J73MueTkZfUGkwzbsRX5cYa+eOnKiLsUHSs2C88pmBm6DTBuP5MZihwqqjb9ezee35b/96no5Er5d/v/roCDdDsfb8/dxXK4r8z1ugBuGkJ8Ph+hQ3oiO6/MmcDIfWscvRn2vFGTOZubV4UxsAhYxYBx8cnq05i2TPqTu2rNqVhuPkyUl8KPmQzDlgZ58Nb/LGJiwYGNIEKlE7uQRf9O6wYzq9zG3D8Iugk3LUQ+Y5ttJY/s1fuQzvlpCrjT8hR6IMw5cbs/i6mFYZG/aQPE5T/CUKNwT9hS8IGh+otTxZHUG+Ro//9iK//2Gu//+wie1Kv8103AAA"); }
body.jja-body .jj-sns--instagram { background-image: url("data:image/webp;base64,UklGRigNAABXRUJQVlA4WAoAAAAwAAAAXwAAXwAASUNDUMgBAAAAAAHIAAAAAAQwAABtbnRyUkdCIFhZWiAH4AABAAEAAAAAAABhY3NwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAQAA9tYAAQAAAADTLQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAlkZXNjAAAA8AAAACRyWFlaAAABFAAAABRnWFlaAAABKAAAABRiWFlaAAABPAAAABR3dHB0AAABUAAAABRyVFJDAAABZAAAAChnVFJDAAABZAAAAChiVFJDAAABZAAAAChjcHJ0AAABjAAAADxtbHVjAAAAAAAAAAEAAAAMZW5VUwAAAAgAAAAcAHMAUgBHAEJYWVogAAAAAAAAb6IAADj1AAADkFhZWiAAAAAAAABimQAAt4UAABjaWFlaIAAAAAAAACSgAAAPhAAAts9YWVogAAAAAAAA9tYAAQAAAADTLXBhcmEAAAAAAAQAAAACZmYAAPKnAAANWQAAE9AAAApbAAAAAAAAAABtbHVjAAAAAAAAAAEAAAAMZW5VUwAAACAAAAAcAEcAbwBvAGcAbABlACAASQBuAGMALgAgADIAMAAxADZBTFBIpQcAAAGgtm3bGUke1ZPUzHa5bffY9szatm3btr07tm1bx26PbVXbKM1MV3dVng9dd943UxURE0BSLYmZnW59/ceJ89f9f+BkUWWt2+trCQQCGuvXAoGLnrrys0cKNywc+8Xj/XOSbQpdkrFDXp64oyLIl37jgZlvXZlgXOa7eyqaOWKD1fu/yDNEjf/JwxHv+yNBlaVkvFnGUbH89TRFTs+NTRwlm9Z1l3KzT+OoqXmuEjM/5+Oo6n44RuS5GhYONpQc2/PfxhWL5s6aPmXy+PHjx40aKTh65NiJ0+YuXbt97/EyvybClQ8J3Opj/f7NX97WPj01KT7O6bDbrFaLxWw2m2PEzRaLze6ITUhKzRryxrIGfewerkfp52edwdoN98dRRNpuX10T1MENnXVkbWOd7jFD2lDEmgaP9erQVqUA0wcBHYcGWSmibcOPI77wnBoutZahtj2XIr7dTg3wGWcYZSLjre0oCnbZhfijMJ0uoP05FBXbn0Z1ya1+ZNjQnyLYfsuLt9jC0dXnAb9KRMmHQPAvS+Qkfl3DzO7fspRWjqkhUGgnurYWVPWhiE1cEeTWwRUZrejqelDWn9T3Q2ChKWKU7zQOH/wszGX/g6ZnyD6f4bUUsTkHGZeYWtETgP+NSTkMqsyRM7xSh1YQJqUJbInP8YA5FLnX1OrgQWGoELjShzJ83ijVmtDhoa/GTps+/ptHOsdbVV39inUEk8L9CprynwFaH2Pihr21vERjqJWsfGd4nI6ETToKKfwDgEd8BzwZRrR5aGNFiAVDlRsfMAHl1hBovA30QE9MAa4UA4afYcknBoUjejEYJvBZW5B5Hny8FBxKlJY/0s/Svb/nhKOrlh93HV93h4lgWhX4cyPYGS9JvXFPkA0M7rhSCUP2jr07WEln8lkwdSfYFivH9FQdG1zzgBpGOOkoWHAErHNKMT3uZsPr7lalJOwFa1xgqV2G+pSbBf2lJ0+W+AW49n5FRlwh2FYF5tpk3FzPuivH3tE5Nyszt9Ndk2t1cfUVMmK3gl2NYLpVQrt9rDNw4kkz6bQ8d7pZBxdmS3BuAAfPg0kWCWNCSDvzXhIJpn7i0tHyowTHanA8AMaZxa70M945QCVhddg+xO5eEpaDMyEwOkaobTHjY0kkNe0c4oOqkH0JcGlgpNjjDLUdiSQ5/QDi28QWgRKG/wglbEGn+5P0EcVopV3EtgCUob+FrqgGgbdVeaavWkBJf6H5oAL9JWL6QANHE8jAjHOg5QVFZB6o1HGZgG0tw4fJ0DcBz7GIzAVV6O8YgYRKUBpjjMMDTsSJzAHVaKRID4YjyeD5IJAhYJ0NaqQ9BbQbjHoC8LWyaqX9CNwdjOreDF651CaDs9lGFdSCb0VmgToNjBKZDY5lGJVTDP4VmQ7cITBaZCY4kWmYC4wWsEwFXh1mgbGgJNeo/Crwi8gU4AvK+hL4OhnVLQDeNGyMyIOA7zTqMYY3SWuR1UkDE4yaC5qzZPmbwViRhFJQbTHG4QGn4mT50DgR60rAzxjzNsN5FmkBWeo7IXAq2YgsF2h5UZXlvQgmiNCwCtD8kSqvzbctoLgfiUwFngtgokUkdgPgc0PkXVnKcLlNxDoduP1gshA9gLS9qbJyDzO+mYRmgAYPmCrW9jRgPpUiJ6eM8R5FbBaorQczrEI0xId471CTWJurjjBu7E7CtrmgshrMsYnR30GkuT5JFcn+roxx8zckYSEoLQULZeTtRszNp1+y6nG8W9TCOrdnSLAvA2fPgOV2CXRNjQ5mrpv+YLf8nOz8bk8s8LDuyqEk0bEWHD0M1jllKA/V62LmQJXLVdnEglV3KDJit4A9O8G2WBmk3lcvILXqFoVkxhWCbZvAzngppD5ca1TFbQpJTdgHVi8GRxLlkHLtzqARzduGkOTEw2DRJOBKkUSU+7tXXuO3GSQ7+QyY8TOoS5dGNOiYrL09SH5aNfjrddBSYACZ7llbFhRpKV52s0oG5jWD924FfKMRRM5Bry0+F0SBE3Ne6GclQ69leHenIPjcGCLVGp9zy5s/jxnz29s3ZsZZFDL4E6B1zawAG4y61NeD6qzEHcAXF03ivGBXomUi4Puiyf0MJ1mUl5vB5rbRo81m0PKKQkMrQN2I6DGiDlQMIYrdA0IT7dHCPjkEdjuJ6B3A/sujxdXnGb5HRJTuBnyifXTofIahO6MVfY94Z6do0GM/428pbGwx0grzI6/LAQ0VxYZTX70ImI8Os0WW80YX4wsvqOEobb2G2Dt2sClyzNfPamKsrUwhqHT36OBgzdo77BGhZDyzuyHEOhs6k95rvDpau1e+MyInLTkxPtbpsNusVot+q9VqtdlsNrvd4XDGxicmpaRldn/wz51NrL9xCOl/okpf64uVpw7s3LZ+xeK5M6dP0T1t1qyZM+cumLdg8eIVazdu33ng+LnK8yxecT8JxjzhFYpw9wMxIkTX+7TooTUOJZk9NzRFiwurupBUJf2N8uhw5tkUkq3G/+6LvLqPnSoZmffZ/upg5DSV/v9SEhmecMUb0/fVR0DAteWfZ/rZ6JJUrEnZvR786J/ZyzcVHjxVVF7rlempq6uuKD57bH/h+qUzRn353NUF6fExJBUAVlA4IIwDAACQFwCdASpgAGAAPi0QhkKhoQ3H1jQMAWJZ2hoX7otcIpEV7eoBApfwr/QD+AapB+Ev6AfwC1x8sW/OfwlsJEFdOp8c83pu3Rd+r3RTcgD9ANRDtGdjMtHg1pL2avI//wnXeN1s64S3X6NHsqd81bCWfizTqnEG0QhEeXmGcGpQl9mx71kf9AS//DlxpxE3kTSPbyrNmGYeHriCySEXFL31kzuwbSOE+lZbSDtEYmdl2+QzXyeGKvnvsOu8HRRSL6fE6sowAAD+/j6JxPTEN3NdUgXjf+RBL8nM5AWvbYnfzZlZSc9TRIXLjSVNOO8vyqmUaqKhftEe42D3g6dp8/jGqFF9zR3+jmtqu3p6+QDF6Xh9WzauAJcp/kIrP+Up3mOT/PfzwdFF4TRBkd9kvbJONr68CbRkEmdgZobaHRDFJhyaor3bS6xR0uZQGmZWuEALG/Rfrl2bMekK2WA7s22CrCaN+FKVmlzjKkABFEqAAmSfZ4Mw+GxxYXU/bn2GxweIIWy1pnLMXlsbxYvGeGAT2rbVYEffX14sJrztBGx54h1W9BCOa0A/iM0NQsuHyr8f7fbj+F51/MKPTtfvsMUTQAg92X4tVh8FtedkUOFlZwu8kq8kse0DyH1kDveWdGMY5hpO7wIGaeVbYuA+nAKNN64xHcftxMSKi4p6BTbKYXkgH3EJBKJhzlIwAaLz7/zLTf6wu+TOophSXYt4AFnSV7wE7/IhKPVETFvv/yqba+vJ+pGCwSuRdLNS4IpR+U+VRXiRmwgClbe1nCjgYDAfoWkan20skj5KQtVuSJ3zttDREjAo3tsrybZiYWjZsEe36B/Ug/+6wdVUZ0edPPcsMctFxEag5mLfvgWt5NcngQLKtvZG6Auk7ZjsbTfV0dchtmVLdAETa7wI2SifypHOz7x5dX1Frk1NKQ/C+YyJVf5NB/+vf9hiv7/tT5tpvjqfM6p6ueAYDOR/KQRjnEqWF//9smWx/UbpdojHm7+EnYIC8ps9DPozwa77LDYvke+l/zcW9z8GvjauRyYrxxqjcI3QbC4B9HAO6ewGOYfbpDHojqejxul9f/iHZWmfc084fkGSt2QzJaX9coBEo07rkrBin0xSLaZNuPblshbg3L5Lgm3AjIH76Za4qc+4gYqOhqtBrJPEGAWt9dSYIE/lg6g0+NeP+j634hQ4vPNttDsERXnxGcf/d0AAAA=="); }
body.jja-body .jj-sns--youtube { background-image: url("data:image/webp;base64,UklGRoIKAABXRUJQVlA4WAoAAAAwAAAAXwAAXwAASUNDUMgBAAAAAAHIAAAAAAQwAABtbnRyUkdCIFhZWiAH4AABAAEAAAAAAABhY3NwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAQAA9tYAAQAAAADTLQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAlkZXNjAAAA8AAAACRyWFlaAAABFAAAABRnWFlaAAABKAAAABRiWFlaAAABPAAAABR3dHB0AAABUAAAABRyVFJDAAABZAAAAChnVFJDAAABZAAAAChiVFJDAAABZAAAAChjcHJ0AAABjAAAADxtbHVjAAAAAAAAAAEAAAAMZW5VUwAAAAgAAAAcAHMAUgBHAEJYWVogAAAAAAAAb6IAADj1AAADkFhZWiAAAAAAAABimQAAt4UAABjaWFlaIAAAAAAAACSgAAAPhAAAts9YWVogAAAAAAAA9tYAAQAAAADTLXBhcmEAAAAAAAQAAAACZmYAAPKnAAANWQAAE9AAAApbAAAAAAAAAABtbHVjAAAAAAAAAAEAAAAMZW5VUwAAACAAAAAcAEcAbwBvAGcAbABlACAASQBuAGMALgAgADIAMAAxADZBTFBIkgUAAA2gtm17IUnf1J1UdfUY3b02xlzbtm3ztW3b5nqP17ZtjLnmzPawp6e7U/kwSHVSETEBkNKIiorLTevfs6Mn0gBrrD57tKzg73qfLwhbjEzJykzqGoO2tWh3p17907NqTpbm55c0qUb6LpzR0ARL9R5JOUmdYz56u4KrQ5yDrk5CWKPdXRfNKr3vr2auBOkxYY0DEhrTrgzs/eq4Au414/yQVB++qss3e6plG303g8QR6SuHXP+jTFq/a/tBci31mdL7ypks+ooFJuSna+e+dTAkh+sxH5SkabtiLvHKkHEXh6pRc5dfXxA2OnUTFCZjLnrxczM82prJUDv9+s/3snBoywdBdc8Nvx9i1mnLh0D9+Nt+PcysoqsHww5dt/+6z7Ro6hTYY/yNn31uTcYm2KXn+hcLrHDdDftMv/j6C2L649xGMHrFxUxEW+GDnZLZ8QeYQL8FsNfoHW9VCFxj2gzS5tzfvlFJsFttXeHP7XHfA/ulz157oR1rmQ0hbfCetnqMgx1rK7853hqZ4A8DCwaDwVCQsRBjJgfnnBBKKNV0XdN1h0N36JYho+M3vBXnGlhZU3La6/V6G0LMNJnJTXAAHCBoSUBAqUapRp0ut8vdNTnBgohVewKt5EZY4LvvjZhIp0MjsJBzk5uMBUPBQHNLn7emxnv2zJKro4Qw0vdPC3INhM2/d0JizplpsroXPnp6ABXRr7ifA+iTKlZ6D5Gp7fyHrksSwcyCIwAWQvwyAhV53isPCzlnvANEzhT7xQs1+ceu4SJY8r4fKQ1ir0DZV9cLdYsuQaZP7Cd1fhop5OmcZ2RAvFqdKo9QVGpeVJIFtppTGtnN3pJOxMZJ1GlIZb503WpzIW3MVRvQ+/wN/zXKpWdmyzO/H0DGX1bx2t9SIbu/NM7haOmZu/SfB6pl6t9DGt1oBdSzYc7d3zdwaXp6pGl36r31r/3gl8XtUgGOGcsqbpImSgkQz7qS9ySJNNQAsOEVSZxUGWlpwFDlFVkCjdFK8KqXIWuDN1GF4MeHIqTxnu+gQNG1sQTSnj/WU5aQP5q0MKte/gAyHytNkqX5x6ExAKreOwy5y/7LlgUfFF1s8G8eiYbk//2bocvS+NCrg8ohfSivvq6bLMDJnyH/yfimE0nyKFma4CvLtrV/jUBeapSQu1oZt5ivGMjv5BEa+ZMyo8SqzgDFcV2ENryizHqxUw1A00eLhIbHf8aVINMg/hYAvDXbEMGjL+VxBUjWBrHABy0qSqYLJV/3UJ4CmZebYp+QFvzeq3QRmvvMRy/WMtM0TS4BIZRqWvzmmRAP3Y9W/24aKQJEXrP47FlvTU1dQ5Pf728OhEIhZjKTc84JIZRSTdcNw3A6IyOjEhITEzt1gpU/OVsL7FkVIQQkJHd1u1wJkTrVNEoJCOGEcIBwtGoS0zQZDzEOy/37SGv8m44ZFrSpOwyHw6FrukY1SighkDj/HNo8/t1yzTKV2QG08/VhKTZU/Ft7qq9/htqOuR3t/qF8DbUZ83UI3jsvzWYK3xMpf2tXlK34ntJE2MHYOcRG+Pt1EA5dsnKUjfxwABZeuP6SNNsofByW5r98vdsmqu+GxZ9+eUO8LdTeRa0y9/x5W6INeG/RYDk7+Ptt8crV3qwhjOzg7zd6FKu6U0NY2b7Pr0tXquBuijCbn7108WiiDP/hcUhYcP2KOVGK+N7fDykvXBK3M40qYBY+XQdJQwfenreGSmfueVeDtKz83vJnUjSpWPF2SP7D9cNWpEdI4y848Cukr97zTZfVwzUpQr/sPUOgID/x1Z7gVVONsAU+fdAgUJQ3/3lf2exFXTxRlvmqTr/5AYHSvOKtj+I6p+QmddWE2KnSf4rP1MEGm4rz8ktO1udk9+nqcUU7abDOe/5k5X//xiYYkBJWUDgg+gIAALASAJ0BKmAAYAA+MRaIQqIhoRlaTAAgAwSztihoTIGnAKzT1r6WuV2V7yj9gHszY4BBAdogagqnwQPsA6d2Zt/suuT6AH7AFqQb7pryk+V9lS/wcDg7lG0LbUvdnYZ8+zkYMYebGZ5lhBu4dndsC4wpbjQDVM5gGifeaVcFsNQ6IjUnpSN4UmTTqauECPufN1XLNqH3LhyO5ah7LMAAAP7/Gct//LW5mD5zXRdZ9jjY133nu5EnXkTDO5WP2v/pL0xdNyOMwNU9hQ3kjWzyCXjv1dHdLXEu6QLeFOGB30iDdoq1pfG4EKGR+r05Ff+hMvVX8HiiwDTjaIHDvuLjGoBvXE6pIa1Ar5lbDr+fWV0R9m0XYxlUmxuTakHU5vPlWOPL3MyJ1o/29ND/deXusxBLpGz8qIIeBO6yvCL/IUu/3hZLr8QkC8u8KgIvVfkAWxcUosSAJFI5olXwgTuSFeKRojzpTh08DN8lKdRr7FqJE/dOdiOVZd34HHwwdrEGG/kUKsNI8ifaS877pSe/+UmhwMCd4L4fy2WvnhuTUB9/q7P//9nO14eg6G8iU3BnR1kWF84HWzsNsYJPpB6nxSldgDnJYIOADcrTKB1qwvrsPxoHwZ+/zWAmwQQanBPloNDnFIZDTX/5Yjf//7O6l03jtLpY09HwZlZNA6aFfy97G3nmrOgxqtZeMtRPZ70e9oRmRXtyS4PWlLg+kRYJ9zzP6MHH2pUUZiAEMd+V2VS6O7zYoRHWzWM2gGAJvTP/Wl+Qflk1fn/2BTdPXM6Y7nBYsIYmpJfnlMulXnCuipqX6oQhLS9ZXS0YSbijQ/HMb/k1OTnL69G0xeDyfIAuH6t5d3rejsVdb9G/YAcUjLRgZMl+Pl476vVK6ow66X8Nce4Y5mrzTTZyUxDn0MuAIYX4ujDCsVteBuxAwooWPoffCblp94o2U4wXcVxPExgXC02m7Mqy9ijGBE9I4nJnx11rbz//EAFhiIy7sV05wDnQ3/xARWvRhwAAAA=="); }
@media (max-width: 600px) {
body.jja-body .jj-foot__sns .jj-sns {
width: 32px; height: 32px;
background-size: 20px 20px;
}
}
body.jja-body {
--jj-fit: calc(100svh - var(--jj-barh, 0px) - var(--jj-navh, 0px)
- var(--jj-adminh, 0px) - var(--jj-footh, 0px));
}
.jj-cat-page .jj-catfoot__item,
.jj-cat-page .jj-catfoot__item:hover,
.jj-catfoot__item,
.jj-catfoot__item:hover {
border-style: solid;
border-color: transparent;
border-width: calc(var(--jj-plate-h) * .275);
border-image-source: url(plate.png);
border-image-slice: 42 fill;
border-image-repeat: stretch;
}
body.jja-body.jc-article-page .jj-bar,
body.jja-body.jc-article-page .jj-bar.is-solid { border-bottom: 0; }
body.jja-body.jj-cat-page .jj-bar { transform: none; }
@keyframes jj-turn-next {
0%   { opacity: 0; transform: translateX(-46%); }
16%  { opacity: 1; }
100% { opacity: 0; transform: translateX(104%); }
}
@keyframes jj-turn-prev {
0%   { opacity: 0; transform: translateX(104%); }
16%  { opacity: 1; }
100% { opacity: 0; transform: translateX(-46%); }
}
.jj-flip {
--jj-paper-ratio: .98;
--jj-paper-max: 1000;
--jj-paper-gap: 0;
position: relative;
height: calc(100svh - var(--jj-adminh, 0px) - var(--jj-footh, 0px));
box-sizing: border-box;
display: flex; flex-direction: column;
align-items: center; justify-content: center;
gap: 10px;
padding: calc(var(--jj-flip-barh, 66px) + 10px) 0 12px;
background-color: #241d17;
background-image:
linear-gradient(180deg, rgba(14, 10, 7, .5) 0%, rgba(14, 10, 7, .7) 100%),
url(rack-wall.jpg);
background-size: auto, cover;
background-position: center, center;
background-repeat: no-repeat, no-repeat;
}
@media (max-width: 600px) {
.jj-flip {
display: block;
min-height: 0;
padding: 0;
}
}
.jj-flip { padding-bottom: 12px; }
.jje {
--jje-paper: #f4f1e9;
--jje-paper-2: #eae6db;
--jje-ink: #111111;
--jje-ink-2: #55554f;
--jje-ink-3: #7c8474;
--jje-line: #c9c4b6;
--jje-cell-h: 128px;
padding-bottom: clamp(30px, 6vh, 64px);
font-family: var(--jc-font, sans-serif), sans-serif;
}
.jje-nav {
display: flex; align-items: center; gap: 10px;
flex-wrap: wrap;
margin: clamp(18px, 3vh, 30px) 0 14px;
}
.jje-nav__a,
.jje-nav__today {
display: inline-flex; align-items: center; gap: 6px;
min-height: 44px; padding: 0 14px;
border: 1px solid rgba(244, 241, 233, .34);
border-radius: 999px;
font-size: .78rem; letter-spacing: .1em;
text-decoration: none;
white-space: nowrap;
}
.jje .jje-nav__a,
.jje .jje-nav__today { color: #f4f1e9; }
.jje-nav__a:hover,
.jje-nav__today:hover { border-color: #f4f1e9; background: rgba(244, 241, 233, .1); }
.jje-nav__now {
display: flex; align-items: baseline; gap: 8px;
margin: 0 4px;
color: #f4f1e9;
}
.jje-nav__y {
font-family: var(--jc-mono, monospace), monospace;
font-size: .72rem; letter-spacing: .16em;
color: rgba(244, 241, 233, .66);
}
.jje-nav__now b {
font-family: var(--jc-logo, sans-serif), sans-serif;
font-weight: 700; font-size: 1.7rem; letter-spacing: .04em;
}
.jje-nav__today { margin-left: auto; }
.jje-grid {
display: grid;
grid-template-columns: repeat(7, minmax(0, 1fr));
gap: 1px;
background: var(--jje-line, #c9c4b6);
border: 1px solid var(--jje-line, #c9c4b6);
border-radius: var(--jc-radius-sm, 6px);
overflow: hidden;
}
.jje-dow {
background: var(--jje-paper-2, #eae6db);
padding: 7px 0;
text-align: center;
font-size: .7rem; letter-spacing: .16em;
color: var(--jje-ink-2, #55554f);
}
.jje-dow--0 { color: #9a4436; }
.jje-dow--6 { color: #3d5670; }
.jje-cell {
background: var(--jje-paper, #f4f1e9);
height: var(--jje-cell-h, 128px);
padding: 5px 6px 6px;
overflow: hidden;
}
.jje-cell.is-out { background: var(--jje-paper-2, #eae6db); }
.jje-cell.is-out .jje-cell__d { opacity: .45; }
.jje-cell__d {
display: flex; align-items: center; gap: 6px;
margin: 0 0 4px;
font-family: var(--jc-mono, monospace), monospace;
font-size: .78rem; line-height: 1;
color: var(--jje-ink-2, #55554f);
}
.jje-cell--0 .jje-cell__d { color: #9a4436; }
.jje-cell--6 .jje-cell__d { color: #3d5670; }
.jje-cell.is-today { box-shadow: inset 0 0 0 2px var(--jc-accent, #a8760a); }
.jje-cell__today {
padding: 2px 5px; border-radius: 3px;
background: var(--jc-accent, #a8760a); color: #fbf8f1;
font-family: var(--jc-font, sans-serif), sans-serif;
font-size: .56rem; letter-spacing: .08em; line-height: 1.4;
}
.jje-cell__list { margin: 0; padding: 0; list-style: none; }
.jje-chip {
display: flex; align-items: baseline; gap: 3px;
margin-bottom: 2px; padding: 2px 4px;
border: 1px solid transparent;
border-radius: 3px;
background: rgba(23, 26, 21, .05);
font-size: .64rem; line-height: 1.35;
color: var(--jje-ink, #111111);
}
.jje-chip.is-2nd {
background: none;
border-style: dashed;
border-color: rgba(23, 26, 21, .34);
}
.jje-chip.is-recur { border-style: dotted; border-color: rgba(23, 26, 21, .34); background: none; }
.jje-cell__i { margin: 0; }
.jje-chip { text-decoration: none; }
a.jje-chip:hover {
background: rgba(23, 26, 21, .12);
border-color: var(--jc-accent, #a8760a);
border-style: solid;
}
a.jje-chip:focus-visible {
outline: 2px solid var(--jc-accent, #a8760a);
outline-offset: 1px;
}
.jje-chip__m { flex: none; font-size: .58rem; color: var(--jje-ink-2, #55554f); }
.jje-chip__n { flex: none; color: #9a4436; }
.jje-chip__t {
min-width: 0; flex: 1 1 auto;
overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.jje-chip__sr { position: absolute; left: -9999px; }
.jje-cell__more {
margin: 2px 0 0;
font-size: .6rem; letter-spacing: .04em;
color: var(--jje-ink-3, #7c8474);
}
.jje-block { margin-top: clamp(28px, 5vh, 54px); }
.jje-block__h {
margin: 0 0 6px;
font-family: var(--jc-serif, serif), serif;
font-weight: 500; font-size: clamp(1rem, 1.9vw, 1.24rem);
letter-spacing: .16em;
color: #f4f1e9;
}
.jje-block__why {
max-width: 46em; margin: 0 0 16px;
font-size: .76rem; line-height: 1.9;
color: rgba(244, 241, 233, .72);
}
.jje-empty {
margin: 0; padding: 16px 18px;
border: 1px dashed rgba(244, 241, 233, .3);
border-radius: var(--jc-radius-sm, 6px);
font-size: .8rem;
color: rgba(244, 241, 233, .72);
}
.jje-cards {
max-width: 58em;
margin: 0; padding: 0;
list-style: none;
display: grid; gap: 12px;
}
.jje-card {
background: var(--jje-paper, #f4f1e9);
border: 1px solid var(--jje-line, #c9c4b6);
border-radius: var(--jc-radius-sm, 6px);
padding: clamp(14px, 2vw, 20px);
color: var(--jje-ink, #111111);
}
.jje-card.is-2nd { border-style: dashed; border-color: rgba(23, 26, 21, .4); }
.jje-card.is-past { opacity: .68; }
.jje-card__tags { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 8px; }
.jje-tag {
display: inline-block;
padding: 2px 8px; border-radius: 999px;
border: 1px solid rgba(23, 26, 21, .34);
font-size: .6rem; letter-spacing: .1em; line-height: 1.7;
color: var(--jje-ink-2, #55554f);
}
.jje-tag--2nd { border-style: dashed; }
.jje-tag--recur { border-style: dotted; }
.jje-tag--wait { border-color: var(--jc-accent, #a8760a); color: #8a5f08; }
.jje-tag--past { background: rgba(23, 26, 21, .08); }
.jje-card__t {
margin: 0 0 8px;
font-family: var(--jc-serif, serif), serif;
font-weight: 600; font-size: clamp(.98rem, 1.5vw, 1.14rem);
line-height: 1.5;
color: var(--jje-ink, #111111);
}
.jje-card__t a { text-decoration: none; }
.jje-card__t a:hover { text-decoration: underline; text-underline-offset: 3px; }
.jje-card__meta {
display: flex; flex-wrap: wrap; gap: 3px 14px;
margin: 0 0 6px;
font-size: .8rem; line-height: 1.8;
color: var(--jje-ink-2, #55554f);
}
.jje-card__date { font-weight: 700; color: var(--jje-ink, #111111); }
.jje-mark { color: #9a4436; margin-left: 2px; }
.jje-card__prev,
.jje-card__note{
margin: 0 0 5px;
font-size: .76rem; line-height: 1.85;
color: var(--jje-ink-2, #55554f);
}
.jje-card__prev,
.jje-card__note {
padding: 8px 10px;
background: rgba(23, 26, 21, .05);
border-left: 3px solid rgba(23, 26, 21, .28);
border-radius: 0 3px 3px 0;
}
.jje-card__note { border-left-color: #9a4436; }
.jje-back { margin: 20px 0 0; font-size: .8rem; }
.jje .jje-back a { color: #f4f1e9; }
@media (max-width: 900px) {
.jje-grid{ display: none; }
.jje-nav { margin-bottom: 4px; }
.jje-nav__now b { font-size: 1.4rem; }
.jje-cards { max-width: none; }
.jje-card__meta{ flex-direction: column; gap: 3px; }
}
.jj-doc { padding-bottom: clamp(30px, 6vh, 64px); }
.jj-sheet {
margin-top: calc(var(--jj-abh, 0px) + clamp(78px, 11vh, 130px));
max-width: 780px;
margin-left: auto;
margin-right: auto;
padding: clamp(26px, 5vw, 68px) clamp(22px, 5vw, 64px);
background: #f4f1e9;
border-radius: var(--jc-radius-sm, 6px);
box-shadow: 0 24px 54px -24px rgba(0, 0, 0, .6);
color: var(--jc-ink-primary, #111111);
}
.jj-sheet__head {
margin-bottom: clamp(20px, 3vh, 34px);
padding-bottom: clamp(14px, 2vh, 22px);
border-bottom: 1px solid var(--jc-line, #d9d9d9);
}
.jj-sheet__title {
margin: 0;
font-family: var(--jc-serif, serif), serif;
font-weight: 600;
font-size: clamp(1.4rem, 3.4vw, 2.1rem);
line-height: 1.4; letter-spacing: .04em;
}
.jj-sheet .jm-read { margin-top: 0; }
.jj-sheet .entry-content a {
color: var(--jc-ink-primary, #111111);
text-decoration: underline;
text-underline-offset: 3px;
}
.jj-sheet .entry-content a:hover { color: var(--jc-accent, #a8760a); }
.jj-sheet .entry-content h2::before { content: none; }
.jj-sheet .entry-content h2 {
margin-top: clamp(34px, 5vh, 56px);
padding-top: clamp(14px, 2vh, 22px);
font-size: clamp(1.15rem, 2.2vw, 1.5rem);
}
.jj-sheet .entry-content { overflow-wrap: break-word; }
.jj-sheet .entry-content img { max-width: 100%; height: auto; }
.jj-sheet .entry-content > table { display: block; max-width: 100%; overflow-x: auto; }
@media (max-width: 600px) {
.jj-sheet { border-radius: 0; margin-left: calc(var(--jj-pad, 18px) * -1); margin-right: calc(var(--jj-pad, 18px) * -1); }
}
.jje-k--see   { --jje-k: #3d5670; }
.jje-k--run   { --jje-k: #9a4436; }
.jje-k--stay  { --jje-k: #3d6640; }
.jje-k--buy   { --jje-k: #7a5406; }
.jje-k--meet  { --jje-k: #5f4a7a; }
.jje-k--other { --jje-k: #565c50; }
.jje-kinds {
display: flex; flex-wrap: wrap; align-items: center; gap: 8px;
margin: 0 0 12px;
}
.jje .jje-kind {
display: inline-flex; align-items: center; gap: 7px;
min-height: 34px; padding: 0 13px;
border: 1px solid rgba(244, 241, 233, .3);
border-radius: 999px;
font-size: .74rem; letter-spacing: .06em;
color: #f4f1e9; text-decoration: none;
white-space: nowrap;
}
.jje .jje-kind:hover { border-color: #f4f1e9; background: rgba(244, 241, 233, .1); }
.jje-kind i {
display: block; width: 9px; height: 9px; border-radius: 50%;
background: var(--jje-k, #565c50);
box-shadow: 0 0 0 1px rgba(244, 241, 233, .45);
}
.jje .jje-kind.is-on {
background: #f4f1e9;
border-color: #f4f1e9;
color: #111111;
font-weight: 700;
}
.jje-kind.is-on i { box-shadow: 0 0 0 1px rgba(23, 26, 21, .3); }
.jje-chip { box-shadow: inset 3px 0 0 var(--jje-k, #565c50); padding-left: 7px; }
.jje-tag--kind {
border-color: var(--jje-k, #565c50);
color: var(--jje-k, #565c50);
font-weight: 700;
}
.jje.is-filtered .jje-block__h::after {
content: "（絞り込み中）";
margin-left: .6em;
font-size: .72rem; letter-spacing: .08em;
color: rgba(244, 241, 233, .6);
}
@media (max-width: 900px) {
.jje-kinds { gap: 6px; }
.jje .jje-kind { min-height: 40px; }
}
.jj-upnext {
margin: clamp(18px, 3vh, 30px) 0 clamp(6px, 1.4vh, 14px);
padding: clamp(14px, 2.2vw, 20px) clamp(14px, 2.4vw, 22px);
border: 1px solid rgba(244, 241, 233, .22);
border-radius: var(--jc-radius-sm, 6px);
background: rgba(18, 13, 9, .34);
backdrop-filter: blur(3px);
}
.jj-upnext__head {
display: flex; align-items: baseline; gap: 10px;
margin: 0 0 10px;
font-family: var(--jc-font, sans-serif), sans-serif;
font-size: .8rem; letter-spacing: .14em;
color: rgba(244, 241, 233, .82);
}
.jj-upnext__en {
font-family: var(--jc-logo, sans-serif), sans-serif;
font-weight: 700; font-size: .74rem; letter-spacing: .22em;
color: #e5cf9d;
}
.jj-upnext__list { margin: 0; padding: 0; list-style: none; }
.jj-upnext__i { border-top: 1px solid rgba(244, 241, 233, .14); }
.jj-upnext__i:first-child { border-top: 0; }
.jj-upnext .jj-upnext__i > a,
.jj-upnext .jj-upnext__i > span {
display: flex; align-items: baseline; gap: 10px;
min-height: 44px; padding: 9px 4px 9px 12px;
text-decoration: none;
color: #f4f1e9;
box-shadow: inset 3px 0 0 var(--jje-k, #565c50);
}
.jj-upnext .jj-upnext__i > a:hover { background: rgba(244, 241, 233, .08); }
.jj-upnext__d {
flex: none;
min-width: 3.6em;
font-family: var(--jc-mono, monospace), monospace;
font-size: .82rem; letter-spacing: .04em;
color: #e5cf9d;
}
.jj-upnext__d i {
font-style: normal; font-size: .68rem;
margin-left: .3em; opacity: .72;
}
.jj-upnext__m { flex: none; font-size: .62rem; opacity: .8; }
.jj-upnext__t {
flex: 1 1 auto; min-width: 0;
font-family: var(--jc-serif, serif), serif;
font-size: .92rem; line-height: 1.5;
overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.jj-upnext__p {
flex: none;
font-size: .7rem; letter-spacing: .06em;
color: rgba(244, 241, 233, .62);
}
.jj-upnext__key {
display: flex; flex-wrap: wrap; gap: 4px 16px;
margin: 10px 0 0;
font-size: .68rem; line-height: 1.7;
color: rgba(244, 241, 233, .6);
}
.jj-upnext__key i { font-style: normal; margin-right: .4em; color: #e5cf9d; }
.jj-upnext__more {
display: inline-flex; align-items: center; gap: 6px;
min-height: 44px; margin-top: 6px;
font-size: .76rem; letter-spacing: .1em;
text-decoration: none;
}
.jj-upnext .jj-upnext__more { color: #f4f1e9; }
.jj-upnext__more:hover { text-decoration: underline; text-underline-offset: 4px; }
@media (max-width: 600px) {
.jj-upnext .jj-upnext__i > a,
.jj-upnext .jj-upnext__i > span { flex-wrap: wrap; gap: 4px 8px; }
.jj-upnext__t { flex: 1 1 100%; white-space: normal; }
.jj-upnext__p { font-size: .66rem; }
}
.jje-back--sheet {
margin: 0 0 clamp(14px, 2vh, 20px);
font-size: .76rem;
}
.jj-sheet .jje-back--sheet a {
display: inline-flex; align-items: center; gap: 6px;
color: var(--jc-ink-secondary, #55554f);
text-decoration: underline;
text-underline-offset: 3px;
}
.jj-sheet .jje-back--sheet a:hover { color: var(--jc-accent, #a8760a); }
.jj-sheet .jje-cards { max-width: none; margin-bottom: clamp(18px, 3vh, 28px); }
.jj-sheet .jje-card { background: rgba(23, 26, 21, .035); }
.jj-flip {
height: auto;
min-height: calc(100svh - var(--jj-adminh, 0px) - var(--jj-footh, 0px));
justify-content: safe center;
}
.jj-flip {
margin-top: var(--jj-flip-barh, 66px);
height: calc(100svh - var(--jj-adminh, 0px) - var(--jj-flip-barh, 66px) - var(--jj-footh, 0px));
min-height: 0;
overflow-y: auto;
overflow-x: hidden;
scrollbar-gutter: stable;
padding-top: clamp(14px, 2.4vh, 26px);
justify-content: safe center;
}
@media (max-width: 600px) {
.jj-flip {
margin-top: 0;
height: auto;
overflow: visible;
padding-top: 0;
}
}
.jj-flip {
--jj-paper-min: 480;
}
.jj-flip { --jj-type: .78; }
.jj-topnav {
display: flex; align-items: baseline; flex-wrap: nowrap;
gap: clamp(12px, 1.7vw, 30px);
}
.jj-bar .jj-topnav a {
display: inline-flex; align-items: baseline; gap: .5em;
padding: 6px 2px;
color: #f4f1e9; text-decoration: none;
opacity: .82; transition: opacity .18s ease;
white-space: nowrap;
}
.jj-bar .jj-topnav a:hover { opacity: 1; }
.jj-bar .jj-topnav strong {
font-family: var(--jc-logo), sans-serif; font-weight: 700;
font-size: .7rem; letter-spacing: .18em;
}
.jj-bar .jj-topnav span {
font-family: var(--jc-font), sans-serif;
font-size: .66rem; letter-spacing: .08em; opacity: .74;
}
@media (min-width: 1101px) {
.jj-bar .jj-trigger { display: none; }
}
@media (max-width: 1100px) {
.jj-bar .jj-topnav { display: none; }
}
.jj-event {
--jje-paper:   #e8dfcb;
--jje-paper-2: #f0e8d6;
--jje-pink:    #26231f;
--jje-muted:   #6f695d;
--jje-line:    rgba(55, 48, 39, .22);
--jje-brown:   #55372a;
}
.jj-event .jj-event-hero {
position: relative;
overflow: hidden;
padding: clamp(34px, 7vh, 78px) 0 clamp(30px, 6vh, 66px);
background-image:
linear-gradient(90deg, rgba(16,14,11,.86) 0%, rgba(16,14,11,.58) 46%, rgba(16,14,11,.22) 100%),
var(--jj-event-hero, none);
background-size: cover;
background-position: center 55%;
}
.jj-event .jj-event-hero__inner {
width: min(1320px, calc(100% - clamp(28px, 6vw, 64px)));
margin: 0 auto;
display: flex; align-items: center; justify-content: space-between;
gap: clamp(20px, 4vw, 60px);
}
.jj-event .jj-event-hero__copy { min-width: 0; }
.jj-event .jj-event-hero h1 {
margin: 0;
font-family: var(--jc-logo), sans-serif; font-weight: 700;
font-size: clamp(56px, 8vw, 116px); line-height: .86; letter-spacing: -.01em;
color: #f0eadc;
}
.jj-event .jj-event-hero__jp {
margin: .5em 0 0;
font-family: var(--jc-serif), serif;
font-size: clamp(15px, 1.6vw, 22px); letter-spacing: .28em; color: #eee6d7;
}
.jj-event .jj-event-hero__text {
margin: 1.4em 0 0; max-width: 34em;
font-family: var(--jc-font), sans-serif;
font-size: clamp(12px, 1vw, 14px); line-height: 2.1; letter-spacing: .04em;
color: rgba(255,255,255,.76);
}
.jj-event .jj-event-section-head {
margin: 0 0 clamp(14px, 2.2vh, 22px);
border-bottom: 1px solid var(--jje-line);
}
.jj-event .jj-event-section-head > div {
display: flex; align-items: baseline; justify-content: space-between;
gap: 16px; padding-bottom: 10px; flex-wrap: wrap;
}
.jj-event .jj-event-section-head h2 {
margin: 0; display: flex; align-items: baseline; gap: 14px; flex-wrap: wrap;
border: 0; padding: 0;
}
.jj-event .jj-event-section-head h2::before,
.jj-event .jj-event-section-head h2::after { content: none; }
.jj-event .jj-event-section-head strong {
font-family: var(--jc-logo), sans-serif; font-weight: 700;
font-size: clamp(22px, 2.6vw, 30px); letter-spacing: .02em;
}
.jj-event .jj-event-section-head span {
font-family: var(--jc-font), sans-serif;
font-size: 12px; letter-spacing: .1em; color: var(--jje-muted);
}
.jj-event .jj-event-section-head__more {
font-family: var(--jc-font), sans-serif; font-size: 12px; letter-spacing: .08em;
color: var(--jje-brown); text-decoration: none;
border-bottom: 1px solid rgba(85,55,42,.4); padding-bottom: 2px;
}
.jj-event .jj-event-section-head__more:hover { color: var(--jje-pink); }
.jj-event .jj-event-cards {
display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
gap: clamp(12px, 1.6vw, 20px);
margin: 0 0 clamp(30px, 5vh, 52px);
}
.jj-event .jj-event-card {
position: relative; overflow: hidden;
background: var(--jje-paper-2);
border: 1px solid rgba(68,57,44,.15);
box-shadow: 0 6px 14px rgba(60,44,27,.12);
transition: transform .2s ease, box-shadow .2s ease;
}
.jj-event .jj-event-card:nth-child(1) { transform: rotate(-.25deg); }
.jj-event .jj-event-card:nth-child(2) { transform: rotate(.2deg); }
.jj-event .jj-event-card:nth-child(3) { transform: rotate(-.15deg); }
.jj-event .jj-event-card:hover {
transform: translateY(-4px) rotate(0);
box-shadow: 0 10px 24px rgba(60,44,27,.18);
}
.jj-event .jj-event-card__image { display: block; aspect-ratio: 16 / 9; overflow: hidden; }
.jj-event .jj-event-card__image img {
display: block; width: 100%; height: 100%; object-fit: cover;
filter: saturate(.82) contrast(.96);
}
.jj-event .jj-event-card__body { padding: clamp(14px, 1.6vw, 20px); }
.jj-event .jj-event-card__date {
margin: 0 0 8px; display: flex; align-items: baseline; gap: .5em;
font-family: var(--jc-logo), sans-serif; line-height: 1;
}
.jj-event .jj-event-card__date span  { font-size: 13px; letter-spacing: .06em; }
.jj-event .jj-event-card__date strong { font-size: clamp(26px, 3vw, 34px); letter-spacing: -.01em; }
.jj-event .jj-event-card__date small  { font-size: 11px; letter-spacing: .12em; color: var(--jje-muted); }
.jj-event .jj-event-card__tags {
margin: 0 0 8px; display: flex; align-items: center; gap: 8px;
}
.jj-event .jj-event-tag {
display: inline-block; padding: 5px 9px;
background: var(--jje-brown); color: #f1e9dc;
font-family: var(--jc-font), sans-serif; font-size: 10px; letter-spacing: .1em;
}
.jj-event .jje-k--see  .jj-event-tag { background: #4b5a6b; }
.jj-event .jje-k--run  .jj-event-tag { background: #8a3a2f; }
.jj-event .jje-k--stay .jj-event-tag { background: #4a6046; }
.jj-event .jje-k--buy  .jj-event-tag { background: #8a6a24; }
.jj-event .jje-k--meet .jj-event-tag { background: #5a4a70; }
.jj-event .jj-event-card__mark {
font-size: 12px; color: var(--jje-muted);
}
.jj-event .jj-event-card h3 {
margin: 0 0 10px; padding: 0; border: 0;
font-family: var(--jc-serif), serif; font-weight: 600;
font-size: clamp(15px, 1.5vw, 19px); line-height: 1.6;
}
.jj-event .jj-event-card h3::before,
.jj-event .jj-event-card h3::after { content: none; }
.jj-event .jj-event-card h3 a { color: var(--jje-pink); text-decoration: none; }
.jj-event .jj-event-card h3 a:hover { text-decoration: underline; }
.jj-event .jj-event-card__place {
margin: 0; font-family: var(--jc-font), sans-serif;
font-size: 11px; line-height: 1.7; color: var(--jje-muted);
}
.jj-event .jj-event-card__more {
display: block; margin-top: 14px; padding-top: 11px;
border-top: 1px solid var(--jje-line);
font-family: var(--jc-font), sans-serif; font-size: 11px; letter-spacing: .08em;
text-align: right; text-decoration: none; color: var(--jje-pink);
}
.jj-event .jj-event-card__more:hover { color: var(--jje-brown); }
.jj-event .jj-event-card.is-noimg .jj-event-card__body { padding-top: clamp(18px, 2.4vw, 28px); }
.jj-event .jj-event-card.is-noimg .jj-event-card__date {
display: block; margin-bottom: 12px;
padding-bottom: 12px; border-bottom: 1px solid var(--jje-line);
}
.jj-event .jj-event-card.is-noimg .jj-event-card__date span { display: block; font-size: 15px; }
.jj-event .jj-event-card.is-noimg .jj-event-card__date strong {
display: block; margin: 2px 0 4px;
font-size: clamp(44px, 6vw, 72px); line-height: .92; letter-spacing: -.02em;
}
.jj-event .jj-event-card.is-noimg .jj-event-card__date small { display: block; font-size: 13px; }
@media (max-width: 760px) {
.jj-event .jj-event-hero__inner { display: block; }
.jj-event .jj-event-cards { grid-template-columns: 1fr; }
.jj-event .jj-event-card,
.jj-event .jj-event-card:nth-child(1),
.jj-event .jj-event-card:nth-child(2),
.jj-event .jj-event-card:nth-child(3) { transform: none; }
}
.jj-event .jje-back--sheet {
width: min(1180px, calc(100% - clamp(20px, 4vw, 48px)));
margin: clamp(14px, 3vh, 26px) auto clamp(10px, 1.6vh, 16px);
}
.jj-event .jj-event-sheet {
position: relative;
width: min(1180px, calc(100% - clamp(20px, 4vw, 48px)));
margin: 0 auto clamp(28px, 5vh, 46px);
padding: clamp(26px, 5vh, 52px) clamp(18px, 3.4vw, 58px) clamp(24px, 4vh, 44px);
background: #e9dfca;
color: #26231f;
box-shadow: 0 14px 45px rgba(0,0,0,.35);
overflow: hidden;
}
.jj-event .jj-event-sheet::after {
content: ""; position: absolute; inset: 0; opacity: .23; pointer-events: none;
background-image: radial-gradient(rgba(56,48,38,.2) .6px, transparent .8px);
background-size: 6px 6px;
}
.jj-event .jj-event-sheet > * { position: relative; z-index: 2; }
.jj-event .jj-event-sheet__category {
display: inline-block; margin: 0;
padding: 7px 12px;
background: #55372a; color: #eee6d6;
font-family: var(--jc-logo), sans-serif;
font-size: 11px; letter-spacing: .14em;
}
.jj-event .jj-event-sheet__header {
display: grid; grid-template-columns: minmax(140px, 200px) 1fr;
gap: clamp(18px, 3vw, 36px);
margin-top: clamp(18px, 3vh, 30px);
padding-bottom: clamp(18px, 3vh, 28px);
border-bottom: 1px solid rgba(49,43,35,.24);
}
.jj-event .jj-event-sheet__date {
margin: 0; display: flex; flex-direction: column;
font-family: var(--jc-logo), sans-serif; line-height: .94;
}
.jj-event .jj-event-sheet__date span   { font-size: clamp(18px, 2.2vw, 26px); letter-spacing: .06em; }
.jj-event .jj-event-sheet__date strong { margin: .12em 0 .16em; font-size: clamp(40px, 6vw, 64px); letter-spacing: -.02em; }
.jj-event .jj-event-sheet__date small  { font-size: clamp(16px, 2vw, 24px); letter-spacing: .08em; color: #6f695d; }
.jj-event .jj-event-sheet__wait {
font-family: var(--jc-serif), serif; font-size: clamp(18px, 2.4vw, 26px);
line-height: 1.5; letter-spacing: .08em;
}
.jj-event .jj-event-sheet__title {
padding-left: clamp(16px, 2.4vw, 32px);
border-left: 1px solid rgba(56,48,39,.3);
}
.jj-event .jj-event-sheet__title h1 {
margin: 0; padding: 0; border: 0;
font-family: var(--jc-serif), serif; font-weight: 600;
font-size: clamp(24px, 3.6vw, 44px); line-height: 1.45; letter-spacing: .02em;
color: #26231f;
}
.jj-event .jj-event-sheet__title h1::before,
.jj-event .jj-event-sheet__title h1::after { content: none; }
.jj-event .jj-event-sheet__when {
margin: 1em 0 0; font-family: var(--jc-font), sans-serif;
font-size: 14px; letter-spacing: .06em; color: #5c5346;
}
.jj-event .jj-event-sheet__tags { margin: .9em 0 0; display: flex; gap: 8px; flex-wrap: wrap; }
.jj-event .jj-event-sheet__facts {
display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
gap: clamp(14px, 2vw, 26px);
padding: clamp(18px, 3vh, 30px) 0;
border-bottom: 1px solid rgba(49,43,35,.24);
}
.jj-event .jj-event-fact { display: block; }
.jj-event .jj-event-fact__k {
display: block; margin-bottom: .5em;
font-family: var(--jc-logo), sans-serif;
font-size: 10px; letter-spacing: .22em; color: #7a7266;
}
.jj-event .jj-event-fact__v {
display: block; font-family: var(--jc-font), sans-serif;
font-size: 14px; line-height: 1.75;
}
.jj-event .jj-event-fact__v small {
display: block; margin-top: .3em; font-size: 12px; color: #6f695d;
}
.jj-event .jj-event-fact__v.is-unknown { color: #8a6a24; }
.jj-event .jj-event-sheet__note {
margin: clamp(14px, 2vh, 20px) 0 0;
padding: clamp(10px, 1.6vh, 14px) clamp(12px, 1.6vw, 18px);
background: rgba(238,226,201,.7);
border-left: 3px solid #9a4436;
font-family: var(--jc-font), sans-serif;
font-size: 13px; line-height: 1.9;
}
.jj-event .jj-event-sheet__photo {
margin: clamp(18px, 3vh, 30px) 0 0;
padding: 7px; background: #f4edde;
box-shadow: 0 5px 16px rgba(44,34,24,.18);
transform: rotate(-.4deg);
}
.jj-event .jj-event-sheet__photo img {
display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover;
filter: saturate(.85) contrast(.96);
}
.jj-event .jj-event-official {
display: flex; align-items: center; gap: 14px 20px; flex-wrap: wrap;
margin-top: clamp(20px, 3.4vh, 32px);
padding-top: clamp(16px, 2.4vh, 22px);
border-top: 1px dashed rgba(59,50,40,.34);
}
.jj-event .jj-event-official__k {
margin: 0; font-family: var(--jc-logo), sans-serif;
font-size: 11px; letter-spacing: .2em; color: #7a7266;
}
.jj-event .jj-event-official .jj-event-official__a {
padding: 9px 16px; border: 1px solid rgba(55,48,39,.4); border-radius: 24px;
font-family: var(--jc-font), sans-serif; font-size: 12px; letter-spacing: .06em;
color: #26231f; text-decoration: none;
}
.jj-event .jj-event-official .jj-event-official__a:hover { background: rgba(55,48,39,.09); }
.jj-event .jj-event-official__none,
.jj-event .jj-event-official__d {
font-family: var(--jc-font), sans-serif; font-size: 12px; color: #6f695d;
}
.jj-event .jj-event-body {
width: min(880px, calc(100% - clamp(20px, 4vw, 48px)));
margin: 0 auto clamp(40px, 7vh, 80px);
}
@media (max-width: 760px) {
.jj-event .jj-event-sheet__header { grid-template-columns: 1fr; gap: 14px; }
.jj-event .jj-event-sheet__date { flex-direction: row; align-items: baseline; gap: .4em; }
.jj-event .jj-event-sheet__title { padding-left: 0; border-left: 0; }
}
.jj-event .jje-back--sheet a { color: rgba(244,241,233,.82); }
.jj-event .jje-back--sheet a:hover { color: #f4f1e9; }
.jj-event .jj-event-body {
padding: clamp(22px, 4vh, 44px) clamp(18px, 3vw, 46px);
background: #fff;
color: var(--jc-ink-primary, #111111);
box-shadow: 0 10px 30px rgba(0,0,0,.26);
}
.jj-event .jj-event-cards { padding-top: 6px; }
.jj-event .jj-event-card {
overflow: visible;
background-color: #f7f1e2;
background-image:
radial-gradient(90% 60% at 50% 0%, rgba(255,253,248,.9) 0%, rgba(255,253,248,0) 70%),
repeating-linear-gradient(97deg, rgba(120,92,52,.05) 0 1px, rgba(120,92,52,0) 1px 12px);
border: 1px solid #c4b191;
box-shadow:
0 1px 0 rgba(255,255,255,.85) inset,
0 10px 20px rgba(52,36,18,.30),
0 2px 4px rgba(52,36,18,.22);
}
.jj-event .jj-event-card::after {
content: ""; position: absolute; z-index: 2;
top: -1px; right: -1px; width: 30px; height: 30px;
background: linear-gradient(225deg, #ded1b4 0 50%, transparent 50%);
pointer-events: none;
}
.jj-event .jj-event-card::before {
content: ""; position: absolute; z-index: 3;
top: 0; right: 0; width: 29px; height: 29px;
background: linear-gradient(225deg, #cbbc99 0 50%, transparent 50%);
box-shadow: -1px 1px 2px rgba(52,36,18,.28);
pointer-events: none;
}
.jj-event .jj-event-card:hover {
box-shadow:
0 1px 0 rgba(255,255,255,.85) inset,
0 16px 28px rgba(52,36,18,.34),
0 3px 6px rgba(52,36,18,.24);
}
.jj-event .jj-event-card__image {
margin: 13px 13px 0; padding: 7px 7px 9px;
background: #fffcf4;
border: 1px solid rgba(120,92,52,.2);
box-shadow: 0 3px 8px rgba(52,36,18,.24);
aspect-ratio: auto;
}
.jj-event .jj-event-card__image img { aspect-ratio: 16 / 9; }
.jj-event .jj-event-card__date strong { color: #241d12; }
.jj-event .jj-event-card__date span   { color: #3b3121; }
.jj-event .jj-event-card__date small  { color: #6a5e49; }
.jj-event .jj-event-card h3 a { color: #241d12; }
.jj-event .jj-event-card__place { color: #635742; }
.jj-event .jj-event-card__more {
border-top-color: rgba(58,44,26,.32); color: #3b3121;
}
.jj-event .jj-event-card.is-noimg .jj-event-card__date {
border-bottom: 1px dashed rgba(58,44,26,.42);
}
.jj-event .jj-event-card.is-noimg .jj-event-card__date strong {
text-shadow: 0 1px 0 rgba(255,255,255,.9);
}
.jj-event .jj-event-sheet {
background-color: #ded1b4;
background-image:
radial-gradient(78% 52% at 18% 10%, rgba(255,250,236,.55) 0%, rgba(255,250,236,0) 62%),
radial-gradient(64% 46% at 84% 24%, rgba(255,250,236,.36) 0%, rgba(255,250,236,0) 58%),
radial-gradient(70% 40% at 26% 82%, rgba(122, 92, 48,.20) 0%, rgba(122, 92, 48,0) 60%),
repeating-linear-gradient(103deg, rgba(120, 92, 52,.09) 0 1px, rgba(120,92,52,0) 1px 13px);
box-shadow: 0 18px 50px rgba(0,0,0,.45);
}
.jj-event .jj-event-sheet::after {
opacity: .55;
background-image:
radial-gradient(rgba(64,48,26,.22) .5px, transparent .7px),
radial-gradient(rgba(64,48,26,.13) .5px, transparent .7px);
background-size: 3px 3px, 8px 8px;
background-position: 0 0, 2px 3px;
box-shadow:
inset 0 1px 0 rgba(255,251,240,.72),
inset 0 0 0 1px rgba(90,68,38,.16),
inset 0 0 80px rgba(88,66,36,.18);
}
.jj-event .jj-event-sheet__photo {
background: #fffcf4; border: 1px solid rgba(120,92,52,.22);
box-shadow: 0 6px 18px rgba(52,36,18,.26);
}
.jj-event .jj-event-hero {
padding: clamp(48px, 12vh, 132px) 0 clamp(40px, 10vh, 108px);
background-color: #14110d;
}
.jj-event .jj-event-hero.has-photo {
background-image:
linear-gradient(92deg, rgba(14,12,9,.90) 0%, rgba(14,12,9,.62) 40%,
rgba(14,12,9,.18) 74%, rgba(14,12,9,.42) 100%),
linear-gradient(180deg, rgba(14,12,9,.55) 0%, rgba(14,12,9,0) 34%,
rgba(14,12,9,0) 62%, rgba(14,12,9,.66) 100%),
var(--jj-event-hero, none);
background-size: cover, cover, cover;
background-position: center, center, center 58%;
}
.jj-event .jj-event-hero h1 {
font-size: clamp(64px, 11vw, 168px);
text-shadow: 0 2px 0 rgba(0,0,0,.28), 0 14px 40px rgba(0,0,0,.5);
}
.jj-event .jj-event-hero__jp { margin-top: .35em; }
.jj-event .jj-event-cards {
grid-template-columns: 1.08fr .88fr 1.04fr;
align-items: start;
gap: clamp(14px, 2vw, 26px);
padding-top: 18px;
}
.jj-event .jj-event-card:nth-child(1) { transform: rotate(-.9deg);  margin-top: 0; }
.jj-event .jj-event-card:nth-child(2) { transform: rotate(1.1deg);  margin-top: 26px; }
.jj-event .jj-event-card:nth-child(3) { transform: rotate(-.5deg);  margin-top: 9px; }
.jj-event .jj-event-card:hover { transform: translateY(-5px) rotate(0); }
.jj-event .jj-event-card::after { content: none; }
.jj-event .jj-event-card::before {
content: ""; position: absolute; z-index: 3;
top: -11px; left: 13%; width: 86px; height: 24px;
background:
linear-gradient(180deg, rgba(246,238,214,.92) 0%, rgba(232,220,188,.9) 52%, rgba(218,203,166,.9) 100%);
border-left: 1px solid rgba(255,255,255,.5);
border-right: 1px solid rgba(255,255,255,.5);
box-shadow: 0 3px 7px rgba(52,36,18,.3);
transform: rotate(-4.5deg);
pointer-events: none;
}
.jj-event .jj-event-card:nth-child(2)::before {
left: auto; right: 11%; width: 64px; transform: rotate(3.8deg); top: -9px;
}
.jj-event .jj-event-card:nth-child(3)::before {
left: 46%; width: 98px; transform: rotate(-1.2deg); top: -12px;
}
.jj-event .jj-event-card:nth-child(1).is-noimg .jj-event-card__date strong {
font-size: clamp(54px, 7.4vw, 88px);
}
.jj-event .jj-event-card:nth-child(2) .jj-event-card__body { padding-top: clamp(18px, 2vw, 24px); }
.jj-event .jj-event-card:nth-child(2).is-noimg .jj-event-card__date strong {
font-size: clamp(38px, 5vw, 58px);
}
.jj-event .jj-event-place {
margin-top: clamp(20px, 3.4vh, 34px);
padding-bottom: clamp(18px, 3vh, 30px);
border-bottom: 1px solid rgba(58,44,26,.28);
}
.jj-event .jj-event-place__en {
margin: 0;
font-family: var(--jc-logo), sans-serif; font-weight: 700;
font-size: clamp(46px, 11vw, 132px); line-height: .86; letter-spacing: -.01em;
color: #2b2317;
opacity: .92;
text-shadow: 0 1px 0 rgba(255,252,244,.55);
}
.jj-event .jj-event-place__v {
margin: .7em 0 0;
font-family: var(--jc-serif), serif;
font-size: clamp(16px, 2vw, 24px); line-height: 1.7; letter-spacing: .04em;
color: #33291b;
}
.jj-event .jj-event-place__v span {
display: inline-block; margin-left: .9em;
font-family: var(--jc-font), sans-serif;
font-size: .62em; letter-spacing: .12em; color: #6a5e49;
}
.jj-event .jj-event-sheet__facts {
display: flex; flex-wrap: wrap;
gap: clamp(14px, 2.6vw, 40px);
padding: clamp(14px, 2.4vh, 22px) 0;
border-bottom: 1px solid rgba(58,44,26,.28);
}
.jj-event .jj-event-fact {
display: flex; align-items: baseline; gap: .7em;
}
.jj-event .jj-event-fact__k {
display: inline; margin: 0;
font-size: 10px; letter-spacing: .2em; color: #7a6f5c;
}
.jj-event .jj-event-fact__v { display: inline; font-size: 13px; }
.jj-event .jj-event-sheet:not(.is-noimg) .jj-event-place__en {
font-size: clamp(28px, 4.4vw, 52px); opacity: .7;
}
.jj-event .jj-event-sheet__photo { margin-top: clamp(20px, 3.4vh, 34px); }
.jj-event .jj-event-sheet__photo img { aspect-ratio: 3 / 2; }
@media (max-width: 760px) {
.jj-event .jj-event-cards { grid-template-columns: 1fr; }
.jj-event .jj-event-card:nth-child(1),
.jj-event .jj-event-card:nth-child(2),
.jj-event .jj-event-card:nth-child(3) { transform: none; margin-top: 0; }
}
.jj-event .jj-event-pickup {
width: min(1320px, calc(100% - clamp(20px, 4vw, 48px)));
margin: clamp(26px, 5vh, 54px) auto clamp(26px, 5vh, 52px);
}
.jj-event .jj-event-pickup .jj-event-section-head {
border-bottom-color: rgba(244,241,233,.28);
}
.jj-event .jj-event-pickup .jj-event-section-head strong { color: #f0eadc; }
.jj-event .jj-event-pickup .jj-event-section-head span { color: rgba(244,241,233,.66); }
.jj-event .jj-event-pickup .jj-event-section-head__more {
color: rgba(244,241,233,.86); border-bottom-color: rgba(244,241,233,.4);
}
.jj-event .jj-event-pickup .jj-event-section-head__more:hover { color: #fff; }
.jj-event .jj-event-cards {
grid-template-columns: repeat(3, minmax(0, 1fr));
align-items: stretch;
gap: clamp(14px, 2vw, 26px);
padding-top: 16px;
margin-bottom: 0;
}
.jj-event .jj-event-card,
.jj-event .jj-event-card:nth-child(1),
.jj-event .jj-event-card:nth-child(2),
.jj-event .jj-event-card:nth-child(3) {
transform: none; margin-top: 0;
}
.jj-event .jj-event-card:hover { transform: translateY(-4px); }
.jj-event .jj-event-card:nth-child(1).is-noimg .jj-event-card__date strong,
.jj-event .jj-event-card:nth-child(2).is-noimg .jj-event-card__date strong {
font-size: clamp(44px, 6vw, 72px);
}
.jj-event .jj-event-card:nth-child(2) .jj-event-card__body { padding-top: clamp(14px, 1.6vw, 20px); }
.jj-event .jj-event-card {
background-color: #f4ecd9;
background-image:
linear-gradient(178deg, rgba(255,253,247,.85) 0%, rgba(255,253,247,0) 34%),
linear-gradient(0deg, rgba(122, 96, 54,.10) 0%, rgba(122,96,54,0) 22%),
repeating-linear-gradient(97deg,  rgba(120, 92, 52,.055) 0 1px, rgba(120,92,52,0) 1px 11px),
repeating-linear-gradient(-79deg, rgba(120, 92, 52,.04)  0 1px, rgba(120,92,52,0) 1px 17px);
border: 1px solid #c9b590;
border-radius: 2px 1px 3px 1px;
box-shadow:
inset 0 1px 0 rgba(255,255,255,.95),
inset 0 -1px 0 rgba(120, 95, 55,.28),
0 2px 3px rgba(0,0,0,.34),
0 16px 34px rgba(0,0,0,.46);
}
.jj-event .jj-event-card:hover {
box-shadow:
inset 0 1px 0 rgba(255,255,255,.95),
inset 0 -1px 0 rgba(120, 95, 55,.28),
0 3px 5px rgba(0,0,0,.36),
0 22px 44px rgba(0,0,0,.52);
}
.jj-event .jj-event-card__body::before {
content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .42;
background-image:
radial-gradient(rgba(64,48,26,.20) .5px, transparent .7px),
radial-gradient(rgba(64,48,26,.12) .5px, transparent .7px);
background-size: 3px 3px, 8px 8px;
background-position: 0 0, 2px 3px;
}
.jj-event .jj-event-card__body > * { position: relative; z-index: 1; }
.jj-event .jj-event-card::before,
.jj-event .jj-event-card:nth-child(2)::before,
.jj-event .jj-event-card:nth-child(3)::before {
content: ""; position: absolute; z-index: 3;
top: -10px; left: 50%; right: auto;
width: 92px; height: 22px;
margin-left: -46px;
background:
linear-gradient(180deg, rgba(247,240,219,.9) 0%, rgba(233,222,192,.88) 54%, rgba(216,201,164,.88) 100%);
border-left: 1px solid rgba(255,255,255,.55);
border-right: 1px solid rgba(255,255,255,.55);
border-radius: 1px;
box-shadow: 0 3px 8px rgba(0,0,0,.34);
transform: rotate(-1.2deg);
pointer-events: none;
}
.jj-event .jj-event-card__image {
margin: 14px 14px 0; padding: 8px 8px 10px;
background: #fffdf7;
border: 1px solid rgba(120,92,52,.24);
border-radius: 1px;
box-shadow: 0 3px 9px rgba(52,36,18,.3);
}
@media (max-width: 760px) {
.jj-event .jj-event-pickup { width: 100%; padding: 0 14px; }
.jj-event .jj-event-cards { grid-template-columns: 1fr; }
}
.jj-event .jj-event-sheet {
background-color: #f4ecd9;
}
.jj-event .jj-event-sheet {
background-image:
radial-gradient(78% 52% at 18% 10%, rgba(255,253,247,.6) 0%, rgba(255,253,247,0) 62%),
radial-gradient(70% 40% at 26% 82%, rgba(122, 92, 48,.10) 0%, rgba(122, 92, 48,0) 60%),
repeating-linear-gradient(103deg, rgba(120, 92, 52,.055) 0 1px, rgba(120,92,52,0) 1px 13px);
}
.jj-event .jj-event-sheet::after { opacity: .34; }
.jj-event .jj-event-card { background-color: #f4ecd9; }
.jj-event .jj-event-hero {
position: relative;
width: 100vw;
max-width: 100vw;
margin-left: calc(50% - 50vw);
margin-right: calc(50% - 50vw);
background: none;
overflow: visible;
}
.jj-event .jj-event-hero::before {
content: ""; position: absolute; inset: 0; z-index: 0;
background-color: #14110d;
-webkit-mask-image: linear-gradient(180deg, #000 0%, #000 58%, rgba(0,0,0,.55) 82%, transparent 100%);
mask-image:         linear-gradient(180deg, #000 0%, #000 58%, rgba(0,0,0,.55) 82%, transparent 100%);
}
.jj-event .jj-event-hero.has-photo::before {
background-image:
linear-gradient(92deg, rgba(14,12,9,.86) 0%, rgba(14,12,9,.56) 42%,
rgba(14,12,9,.16) 76%, rgba(14,12,9,.38) 100%),
linear-gradient(180deg, rgba(14,12,9,.5) 0%, rgba(14,12,9,0) 32%,
rgba(14,12,9,0) 58%, rgba(14,12,9,.5) 100%),
var(--jj-event-hero, none);
background-size: cover, cover, cover;
background-position: center, center, center 58%;
}
.jj-event .jj-event-hero:not(.has-photo)::before {
background-image: linear-gradient(180deg, #16120e 0%, #221b14 100%);
}
.jj-event .jj-event-hero__inner { position: relative; z-index: 1; }
.jj-event .jj-event-hero { padding-bottom: clamp(72px, 15vh, 168px); }
.jj-event .jj-event-hero.has-photo::before {
background-image:
linear-gradient(92deg, rgba(14,12,9,.84) 0%, rgba(14,12,9,.52) 44%,
rgba(14,12,9,.14) 78%, rgba(14,12,9,.10) 100%),
linear-gradient(180deg, rgba(14,12,9,.52) 0%, rgba(14,12,9,0) 30%),
var(--jj-event-hero, none);
}
.jj-event .jj-event-hero::before {
-webkit-mask-image: linear-gradient(180deg,
#000 0%, #000 42%, rgba(0,0,0,.72) 66%, rgba(0,0,0,.28) 86%, transparent 100%);
mask-image: linear-gradient(180deg,
#000 0%, #000 42%, rgba(0,0,0,.72) 66%, rgba(0,0,0,.28) 86%, transparent 100%);
}
.jj-event { --jje-paper: #f4ecd9; }
.jj-event .jj-event-hero.has-photo { background-image: none; }
.jj-event .jj-event-hero { min-height: clamp(400px, 54vh, 600px); }
.jj-event .jj-event-place__en {
font-size: clamp(26px, 3.2vw, 40px);
letter-spacing: .04em;
opacity: .8;
}
.jj-event .jj-event-sheet:not(.is-noimg) .jj-event-place__en {
font-size: clamp(24px, 3.2vw, 40px);
}
.jj-event .jj-event-place__v {
margin-top: .5em;
font-size: clamp(15px, 1.7vw, 21px);
}
.jj-event .jje-back--sheet {
margin-top: clamp(92px, 12vh, 118px);
}
.jj-event .jj-event-card__body { padding: clamp(12px, 1.3vw, 17px); }
.jj-event .jj-event-card__date strong { font-size: clamp(24px, 2.6vw, 32px); }
.jj-event .jj-event-card.is-noimg .jj-event-card__date strong,
.jj-event .jj-event-card:nth-child(1).is-noimg .jj-event-card__date strong,
.jj-event .jj-event-card:nth-child(2).is-noimg .jj-event-card__date strong {
font-size: clamp(30px, 3.6vw, 46px);
}
.jj-event .jj-event-card__date span  { font-size: 11px; }
.jj-event .jj-event-card__date small { font-size: 10px; }
.jj-event .jj-event-card.is-noimg .jj-event-card__date {
margin-bottom: 9px; padding-bottom: 9px;
}
.jj-event .jj-event-card.is-noimg .jj-event-card__date span { font-size: 12px; }
.jj-event .jj-event-card.is-noimg .jj-event-card__date small { font-size: 11px; }
.jj-event .jj-event-card__tags { margin-bottom: 7px; }
.jj-event .jj-event-card h3 {
margin-bottom: 8px;
font-size: clamp(13px, 1.2vw, 16px); line-height: 1.62;
}
.jj-event .jj-event-card__place { font-size: 10.5px; line-height: 1.65; }
.jj-event .jj-event-card__more {
margin-top: 10px; padding-top: 9px; font-size: 10.5px;
}
.jj-event .jj-event-card__image { margin: 11px 11px 0; padding: 6px 6px 8px; }
.jj-event .jj-event-card::before,
.jj-event .jj-event-card:nth-child(2)::before,
.jj-event .jj-event-card:nth-child(3)::before {
width: 76px; height: 19px; margin-left: -38px; top: -9px;
}
.jj-event .jj-event-tag {
--jj-plate-h: 24px;
display: inline-flex; align-items: center;
min-height: var(--jj-plate-h);
background: none;
color: #f0ece1;
border-style: solid;
border-color: transparent;
border-width: calc(var(--jj-plate-h) * .275);
border-image-source: url(plate.png);
border-image-slice: 42 fill;
border-image-repeat: stretch;
padding: 0 3px;
font-family: var(--jc-font), sans-serif;
font-size: 10px; letter-spacing: .12em; white-space: nowrap;
}
.jj-event .jje-k--see  .jj-event-tag,
.jj-event .jje-k--run  .jj-event-tag,
.jj-event .jje-k--stay .jj-event-tag,
.jj-event .jje-k--buy  .jj-event-tag,
.jj-event .jje-k--meet .jj-event-tag { background: none; }
.jj-catfoot__grid {
--jj-plate-w: 184px;
display: grid;
grid-template-columns: repeat(3, var(--jj-plate-w));
justify-content: center;
gap: clamp(10px, 1.2vw, 18px);
}
.jj-catfoot__item {
--jj-plate-h: 44px;
width: 100%;
padding-left: calc(var(--jj-plate-h) * .275 + 6px);
padding-right: calc(var(--jj-plate-h) * .275 + 6px);
}
.jj-catfoot__en,
.jj-catfoot__ja { white-space: nowrap; }
@media (max-width: 760px) {
.jj-catfoot__grid { grid-template-columns: repeat(2, var(--jj-plate-w)); }
}
@media (max-width: 430px) {
.jj-catfoot__grid { --jj-plate-w: 168px; grid-template-columns: var(--jj-plate-w); }
}
@media (max-width: 600px) {
.jj-catfoot__item { --jj-plate-h: 40px; }
}
.jj-event .jj-event-tag {
display: inline-block;
min-height: 0;
border: 0;
border-image-source: none;
background: var(--jje-brown);
color: #f1e9dc;
padding: 5px 9px;
font-size: 10px; letter-spacing: .1em;
}
.jj-event .jje-k--see  .jj-event-tag { background: #4b5a6b; }
.jj-event .jje-k--run  .jj-event-tag { background: #8a3a2f; }
.jj-event .jje-k--stay .jj-event-tag { background: #4a6046; }
.jj-event .jje-k--buy  .jj-event-tag { background: #8a6a24; }
.jj-event .jje-k--meet .jj-event-tag { background: #5a4a70; }
.jje-k--fes    { --jje-k: #7a5406; }
.jje-k--offkai { --jje-k: #5f4a7a; }
.jj-event .jje-k--run    .jj-event-tag { background: #8a3a2f; }
.jj-event .jje-k--fes    .jj-event-tag { background: #8a6a24; }
.jj-event .jje-k--offkai .jj-event-tag { background: #5a4a70; }
.jj-event .jje-k--other  .jj-event-tag { background: #565c50; }
body.jja-body .jj-bar,
body.jja-body .jj-bar.is-solid {
background: none;
backdrop-filter: none;
}
body.jja-body.jc-article-page .jj-bar.is-solid{
background-color: transparent;
background-image: none;
border-color: transparent;
box-shadow: none;
}
body.jja-body .jj-bar.is-solid::before { opacity: 1; }
body.jja-body .jj-bar::before {
background: linear-gradient(180deg,
rgba(8,9,6,.72) 0%, rgba(8,9,6,.38) 55%, rgba(8,9,6,0) 100%);
}
body.jja-body .jj-foot {
background-color: transparent;
background-image: none;
}
.jje-chip.is-cancelled {
opacity: .74;
border-style: dashed;
}
.jje-chip.is-cancelled .jje-chip__t {
text-decoration: line-through;
text-decoration-thickness: 1px;
}
.jje-chip__off {
flex: 0 0 auto;
margin-right: .35em;
padding: 0 .35em;
background: #8f2f22;
color: #fdf6ec;
font-size: .82em; letter-spacing: .06em;
border-radius: 2px;
}
.jje-tag--off {
background: #8f2f22;
color: #fdf6ec;
border-color: #8f2f22;
}
.jje-card.is-off { border-style: dashed; }
.jje-card.is-cancelled .jje-card__t { text-decoration: line-through; }
.jj-event .jj-event-sheet__off {
display: inline-block;
margin: 12px 0 0;
padding: 8px 16px;
background: #8f2f22;
color: #fdf6ec;
font-family: var(--jc-logo), sans-serif;
font-size: 13px; letter-spacing: .18em;
}
.jj-event .jj-event-sheet.is-cancelled .jj-event-sheet__title h1 {
text-decoration: line-through;
text-decoration-thickness: 2px;
text-decoration-color: rgba(143,47,34,.6);
}
.jj-event .jj-event-sheet__date small {
display: block; margin-top: .5em;
font-family: var(--jc-font), sans-serif;
font-size: 12px; letter-spacing: .08em; color: #6f695d;
}
.jje-card__tags .jje-tag--closed {
border-color: rgba(143, 47, 34, .55);
color: #8f2f22;
}
.jj-event .jj-event-card__entry {
display: inline-block;
padding: 2px 8px;
border: 1px solid rgba(143, 47, 34, .55);
color: #8f2f22;
font-size: 11px; letter-spacing: .1em; line-height: 1.7;
}
.jj-event .jj-event-official__note {
flex: 1 1 100%;
margin: 0 0 10px;
font-family: var(--jc-serif, serif), serif;
font-size: 13px; line-height: 1.8;
color: var(--jje-ink-2, #55554f);
}
.jj-event .jj-event-card__pr {
display: inline-block;
padding: 2px 8px;
background: #8f2f22;
color: #fdf6ec;
font-family: var(--jc-logo), sans-serif;
font-size: 11px; letter-spacing: .14em; line-height: 1.7;
}
.jje-form {
max-width: 640px;
margin: 0 auto;
font-family: var(--jc-font, sans-serif), sans-serif;
}
.jje-form__lead {
margin: 0 0 20px;
font-size: 14px; line-height: 1.9;
color: var(--jje-ink-2, #55554f);
}
.jje-form__msg {
margin: 0 0 18px; padding: 12px 16px;
border-left: 4px solid #6b7a5e;
background: rgba(107,122,94,.1);
font-size: 14px; line-height: 1.8;
}
.jje-form__msg--ng { border-left-color: #8f2f22; background: rgba(143,47,34,.08); }
.jje-form__row { margin: 0 0 16px; }
.jje-form__row label {
display: block; margin-bottom: 4px;
font-size: 13px; letter-spacing: .04em;
}
.jje-form__req {
margin-left: 8px; padding: 1px 6px;
background: #8f2f22; color: #fdf6ec;
font-size: 10px; letter-spacing: .1em; font-weight: 400;
}
.jje-form__row input,
.jje-form__row select,
.jje-form__row textarea {
width: 100%; box-sizing: border-box;
padding: 9px 12px;
border: 1px solid rgba(23,26,21,.3);
border-radius: 2px;
background: #fff;
font-family: inherit; font-size: 15px;
line-height: 1.6; color: inherit;
}
.jje-form__row textarea { resize: vertical; }
.jje-form__row small {
display: block; margin-top: 4px;
font-size: 12px; line-height: 1.7; color: #6f695d;
}
.jje-form__hp {
position: absolute !important;
left: -9999px; width: 1px; height: 1px; overflow: hidden;
}
.jje-form__send { margin: 24px 0 0; }
.jje-form__send button {
padding: 12px 32px;
border: 1px solid rgba(23,26,21,.5); border-radius: 999px;
background: #111111; color: #f5f1e6;
font-family: inherit; font-size: 14px; letter-spacing: .1em;
cursor: pointer;
}
.jje-form__send button:hover { background: #2c322a; }
.jje-form__h {
margin: 32px 0 14px;
padding-bottom: 6px;
border-bottom: 1px solid rgba(23,26,21,.2);
font-family: var(--jc-serif, serif), serif;
font-size: 15px; font-weight: 600; letter-spacing: .06em;
}
.jje-form__h:first-of-type { margin-top: 20px; }
.jje-form__row small strong { color: var(--jje-ink, #111111); }
.jje-card__as {
margin: 10px 0 0; padding-top: 8px;
border-top: 1px solid rgba(23, 26, 21, .16);
font-family: var(--jc-mono, monospace), monospace;
font-size: .66rem; letter-spacing: .02em;
color: var(--jje-ink-2, #55554f);
}
.jj-event .jj-event-official .jj-event-official__a--sns {
border-style: dashed;
background: transparent;
}
.jj-event .jj-event-embed {
margin: clamp(16px, 2.6vh, 26px) 0 0;
padding: clamp(14px, 2vh, 20px);
border: 1px dashed rgba(59, 50, 40, .34);
text-align: center;
}
.jj-event .jj-event-embed.is-open {
padding: 0; border: 0; text-align: left;
}
.jj-event .jj-event-embed__go {
padding: 9px 20px;
border: 1px solid rgba(55, 48, 39, .4); border-radius: 24px;
background: transparent;
font-family: var(--jc-font), sans-serif;
font-size: 12px; letter-spacing: .06em; color: #26231f;
cursor: pointer;
}
.jj-event .jj-event-embed__go:hover { background: rgba(55, 48, 39, .07); }
.jj-event .jj-event-embed__note {
margin: 8px 0 0;
font-size: 11px; line-height: 1.7; color: #7a7266;
}
.jj-event .jj-event-embed .instagram-media {
max-width: 100% !important;
min-width: 0 !important;
}
.jj-event-card .jj-event-embed { margin: 10px 0 0; padding: 8px; }
.jj-event-card .jj-event-embed__go { padding: 6px 14px; font-size: 11px; }
.jj-event-card .jj-event-embed__note { display: none; }
.jj-event-card .jj-event-embed.is-open { padding: 0; border: 0; }
.jj-event .jj-event-embed.is-auto { border: 0; padding: 0; min-height: 420px; }
.jj-event .jj-event-embed.is-auto .jj-event-embed__go,
.jj-event .jj-event-embed.is-auto .jj-event-embed__note { display: none; }
.jj-event-card .jj-event-embed.is-auto { margin: 10px 0 0; }
.jj-event .jjm { color: var(--jje-paper, #f4f1e9); }
.jj-event .jjm-head {
display: flex; align-items: baseline; gap: clamp(12px, 2vw, 20px);
margin: 0 0 clamp(16px, 2.6vh, 24px);
padding-bottom: clamp(12px, 1.8vh, 18px);
border-bottom: 1px solid rgba(244, 241, 233, .2);
}
.jj-event .jjm-head__m {
margin: 0; font-family: var(--jc-logo), sans-serif;
font-size: clamp(26px, 3.4vw, 40px); letter-spacing: .06em; line-height: 1;
}
.jj-event .jjm-head__n {
margin: 0; font-size: 12px; letter-spacing: .16em; color: #bdb39c;
}
.jj-event .jjm-head .jje-nav { margin-left: auto; }
.jj-event .jjm-wrap {
display: grid; grid-template-columns: 326px 1fr;
gap: 0 clamp(28px, 4vw, 60px); align-items: start;
}
.jj-event .jjm-rail { position: sticky; top: 20px; }
.jj-event .jjm-sheet {
position: relative; overflow: hidden;
background: var(--jje-paper, #f4ecd9);
padding: 18px;
box-shadow: 0 10px 30px rgba(0, 0, 0, .34);
}
.jj-event .jjm-sheet + .jjm-sheet { margin-top: 20px; }
.jj-event .jjm-sheet::before {
content: ""; position: absolute; inset: 0; opacity: .25; pointer-events: none;
background-image: radial-gradient(rgba(66, 52, 37, .18) .6px, transparent .8px);
background-size: 5px 5px;
}
.jj-event .jjm-sheet > * { position: relative; z-index: 1; }
.jj-event .jjm-mini { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
.jj-event .jjm-mini__w {
text-align: center; padding: 0 0 6px;
font-size: 9px; letter-spacing: .1em; color: #8a8271;
}
.jj-event .jjm-mini__w--0 { color: #a8695c; }
.jj-event .jjm-mini__w--6 { color: #5d7387; }
.jj-event .jjm-mini__d {
aspect-ratio: 1; display: flex; flex-direction: column;
align-items: center; justify-content: center; gap: 3px;
font-size: 11px; color: #6d6656; border-radius: 2px; text-decoration: none;
}
.jj-event .jjm-mini__d.is-out { visibility: hidden; }
.jj-event .jjm-mini__d.has { color: #26231f; background: rgba(23, 26, 21, .06); }
.jj-event a.jjm-mini__d.has:hover { background: rgba(23, 26, 21, .14); }
.jj-event .jjm-mini__d.is-today { outline: 1px solid var(--jc-accent, #a8760a); }
.jj-event .jjm-mini__d i { display: flex; gap: 2px; }
.jj-event .jjm-mini__d i s {
text-decoration: none; width: 4px; height: 4px; border-radius: 50%;
background: var(--jje-k, #6f695d);
}
.jj-event .jjm-map { display: block; width: 100%; height: auto; }
.jj-event .jjm-a path { stroke: rgba(23, 26, 21, .22); stroke-width: 1.2; stroke-linejoin: round; }
.jj-event .jjm-l0 path { fill: rgba(23, 26, 21, .05); }
.jj-event .jjm-l1 path { fill: rgba(23, 26, 21, .16); }
.jj-event .jjm-l2 path { fill: rgba(23, 26, 21, .32); }
.jj-event .jjm-l3 path { fill: rgba(23, 26, 21, .55); }
.jj-event a.jjm-a:hover path { fill: rgba(23, 26, 21, .72); }
.jj-event .jjm-a.is-on path { fill: var(--jc-accent, #a8760a); }
.jj-event .jjm-map__n {
font-family: var(--jc-font), sans-serif; font-size: 30px; text-anchor: middle;
fill: #7c7565; paint-order: stroke; stroke: var(--jje-paper, #f4ecd9); stroke-width: 5;
}
.jj-event .jjm-l1 .jjm-map__n,
.jj-event .jjm-l2 .jjm-map__n { fill: #3a3227; }
.jj-event .jjm-l3 .jjm-map__n { fill: #f4ecd9; stroke: none; }
.jj-event .jjm-a.is-on .jjm-map__n { fill: #241d16; stroke: none; }
.jj-event .jjm-map__c {
font-family: var(--jc-logo), sans-serif; font-size: 44px; text-anchor: middle;
fill: #8f6b12; paint-order: stroke; stroke: var(--jje-paper, #f4ecd9); stroke-width: 5;
}
.jj-event .jjm-l3 .jjm-map__c { fill: #f4ecd9; stroke: none; }
.jj-event .jjm-a.is-on .jjm-map__c { fill: #241d16; stroke: none; }
.jj-event .jjm-map__box {
fill: none; stroke: rgba(23, 26, 21, .22); stroke-width: 2; stroke-dasharray: 5 5;
}
.jj-event .jjm-map__boxt {
font-family: var(--jc-font), sans-serif; font-size: 22px;
fill: #8a8271; text-anchor: middle;
}
.jj-event .jjm-src {
margin: 8px 0 0; text-align: right;
font-family: var(--jc-font), sans-serif; font-size: 9px;
letter-spacing: .06em; line-height: 1.6; color: #8f887a;
}
.jj-event .jjm-main .jje-kinds { margin: 0 0 12px; }
.jj-event .jjm-legend {
display: flex; flex-wrap: wrap; gap: 4px 16px;
margin: 0 0 4px; padding: 0 0 14px;
border-bottom: 1px solid rgba(244, 241, 233, .2);
font-size: 10px; letter-spacing: .1em; color: #a79d88;
}
.jj-event .jjm-day {
display: grid; grid-template-columns: 78px 1fr; gap: 0 22px;
padding: 18px 0; border-top: 1px solid rgba(244, 241, 233, .16);
}
.jj-event .jjm-days > .jjm-day:first-child { border-top: 0; }
.jj-event .jjm-days > .jjm-day:last-child { border-bottom: 1px solid rgba(244, 241, 233, .16); }
.jj-event .jjm-d { margin: 0; }
.jj-event .jjm-d b {
display: block; font-family: var(--jc-logo), sans-serif;
font-size: 36px; line-height: .95; font-weight: 400;
}
.jj-event .jjm-d span { font-size: 10px; letter-spacing: .2em; color: #bdb39c; }
.jj-event .jjm-d.is-sat b, .jj-event .jjm-d.is-sat span { color: #a9c0d2; }
.jj-event .jjm-d.is-sun b, .jj-event .jjm-d.is-sun span { color: #d29a8c; }
.jj-event .jjm-d.is-today b { color: var(--jc-accent-light, #d9a92a); }
.jj-event .jjm-e {
display: grid; grid-template-columns: auto auto 1fr auto auto;
gap: 0 14px; align-items: baseline; padding: 8px 0;
}
.jj-event .jjm-e__to {
order: -1; font-family: var(--jc-logo), sans-serif;
font-size: 12px; letter-spacing: .04em; color: #bdb39c; white-space: nowrap;
}
.jj-event .jjm-e + .jjm-e { border-top: 1px dotted rgba(244, 241, 233, .18); }
.jj-event .jjm-e__k {
font-size: 10px; letter-spacing: .1em; padding: 2px 8px; white-space: nowrap;
border: 1px solid var(--jje-k, #6f695d);
background: color-mix(in srgb, var(--jje-k, #6f695d) 38%, transparent);
}
.jj-event .jjm-e__t { font-family: var(--jc-serif, serif), serif; font-size: 17px; line-height: 1.5; }
.jj-event .jjm-e__t a { color: var(--jje-paper, #f4f1e9); text-decoration: none; }
.jj-event .jjm-e__t a:hover { text-decoration: underline; }
.jj-event .jjm-e__m { font-size: 11px; color: #a79d88; }
.jj-event .jjm-e__p { font-size: 11px; letter-spacing: .06em; color: #a79d88; white-space: nowrap; }
.jj-event .jjm-e.is-off .jjm-e__t a,
.jj-event .jjm-e.is-off .jjm-e__t { text-decoration: line-through; color: #9a9081; }
.jj-event .jjm-e__off {
margin-left: 8px; padding: 1px 7px; font-size: 10px; letter-spacing: .1em;
background: #8f2f22; color: #fdf6ec; text-decoration: none; display: inline-block;
}
@media (max-width: 900px) {
.jj-event .jjm-wrap { grid-template-columns: 1fr; gap: 24px 0; }
.jj-event .jjm-rail { position: static; display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; }
.jj-event .jjm-sheet + .jjm-sheet { margin-top: 0; }
.jj-event .jjm-head { flex-wrap: wrap; }
.jj-event .jjm-head .jje-nav { margin-left: 0; flex: 1 1 100%; }
.jj-event .jjm-day { grid-template-columns: 56px 1fr; gap: 0 14px; padding: 14px 0; }
.jj-event .jjm-d b { font-size: 28px; }
.jj-event .jjm-e { display: flex; flex-wrap: wrap; align-items: baseline; gap: 5px 10px; }
.jj-event .jjm-e__k  { order: 0; }
.jj-event .jjm-e__to { order: 1; }
.jj-event .jjm-e__t  { order: 2; flex: 1 1 100%; font-size: 15px; }
.jj-event .jjm-e__m  { order: 3; }
.jj-event .jjm-e__p  { order: 4; }
}
@media (max-width: 560px) {
.jj-event .jjm-rail { grid-template-columns: 1fr; gap: 16px 0; }
}
.jj-event .jjm,
.jj-event .jjm-day { scroll-margin-top: clamp(86px, 12vh, 120px); }
.admin-bar .jj-event .jjm,
.admin-bar .jj-event .jjm-day { scroll-margin-top: clamp(118px, 12vh, 152px); }
.jj-event .jjm-wrap { grid-template-columns: 300px minmax(0, 1fr) 292px; }
.jj-event .jjm-wrap.has-no-pick { grid-template-columns: 300px minmax(0, 1fr); }
.jj-event .jjm-pick { position: sticky; top: 20px; }
.jj-event .jjm-pick .jj-event-pickup { margin: 0; }
.jj-event .jjm-pick .jj-event-section-head { margin: 0 0 14px; }
.jj-event .jjm-pick .jj-event-section-head > div { display: block; }
.jj-event .jjm-pick .jj-event-section-head h2 { font-size: 15px; letter-spacing: .16em; }
.jj-event .jjm-pick .jj-event-section-head h2 span { display: block; margin: 4px 0 0; font-size: 11px; }
.jj-event .jjm-pick .jj-event-cards { grid-template-columns: 1fr; gap: 18px; }
@media (max-width: 1240px) {
.jj-event .jjm-wrap { grid-template-columns: 300px minmax(0, 1fr); }
.jj-event .jjm-pick { position: static; grid-column: 1 / -1; grid-row: 1; margin: 0 0 28px; }
.jj-event .jjm-pick .jj-event-cards { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.jj-event .jjm-pick .jj-event-section-head > div { display: flex; }
.jj-event .jjm-pick .jj-event-section-head h2 span { display: inline; margin: 0 0 0 12px; }
}
@media (max-width: 900px) {
.jj-event .jjm-wrap,
.jj-event .jjm-wrap.has-no-pick { grid-template-columns: 1fr; }
.jj-event .jjm-pick { grid-column: auto; grid-row: auto; }
}
.jj-event .jjm-e {
grid-template-columns: auto auto minmax(0, 1fr);
align-items: baseline;
}
.jj-event .jjm-e__t { grid-column: 3; }
.jj-event .jjm-e__sub {
grid-column: 3; display: flex; align-items: baseline; gap: 10px;
margin-top: 3px;
}
.jj-event .jjm-e__m, .jj-event .jjm-e__p { white-space: nowrap; }
.jj-event .jjm-pick .jj-event-card.is-noimg .jj-event-card__date {
margin-bottom: 14px; padding-bottom: 0; border-bottom: 0;
}
.jj-event .jjm-pick .jj-event-card__more {
margin-top: 12px; padding-top: 0; border-top: 0;
}
.jj-event .jjm-pick .jj-event-section-head { border-bottom: 0; padding-bottom: 0; }
.jj-event .jjm-rail > .jjm-sheet:first-child,
.jj-event .jjm-main > :first-child,
.jj-event .jjm-pick .jj-event-pickup { margin-top: 0; }
.jj-event .jjm-pick .jj-event-section-head h2 { margin: 0; line-height: 1.3; }
.jj-event .jjm-kinds {
margin: 0 0 clamp(16px, 2.4vh, 24px);
padding: 0 0 clamp(12px, 1.8vh, 18px);
border-bottom: 1px solid rgba(244, 241, 233, .2);
}
.jj-event .jjm-kinds .jje-kinds { margin: 0; }
.jj-event .jjm-head { padding-bottom: clamp(8px, 1.2vh, 12px); border-bottom: 0; }
.jj-event .jjm-rail .jje-nav {
display: flex; align-items: center; justify-content: space-between;
gap: 8px; margin: 0 0 12px; padding: 0 0 10px;
border-bottom: 1px solid rgba(23, 26, 21, .14);
}
.jj-event .jjm-rail .jje-nav__a {
display: inline-flex; align-items: center; justify-content: center;
width: 30px; height: 30px; padding: 0; border-radius: 50%;
border: 1px solid rgba(23, 26, 21, .26);
font-size: 0; color: #3a3227; text-decoration: none; flex: none;
}
.jj-event .jjm-rail .jje-nav__a span { font-size: 13px; }
.jj-event .jjm-rail .jje-nav__a:hover { background: rgba(23, 26, 21, .08); }
.jj-event .jjm-rail .jje-nav__now {
margin: 0; display: flex; align-items: baseline; gap: 6px;
font-family: var(--jc-logo), sans-serif; color: #26231f;
}
.jj-event .jjm-rail .jje-nav__y { font-size: 11px; letter-spacing: .1em; color: #7c7565; }
.jj-event .jjm-rail .jje-nav__now b { font-size: 19px; letter-spacing: .04em; font-weight: 400; }
.jj-event .jjm-rail .jje-nav__today {
position: absolute;
width: 1px; height: 1px; min-width: 0; min-height: 0;
padding: 0; border: 0; margin: -1px;
overflow: hidden; clip-path: inset(50%); white-space: nowrap;
}
.jj-event .jjm-pick .jj-event-card__body { padding: 16px 16px 14px; }
.jj-event .jjm-pick .jj-event-card__date strong { font-size: 30px; letter-spacing: .01em; }
.jj-event .jjm-pick .jj-event-card__date span { font-size: 10px; letter-spacing: .18em; }
.jj-event .jjm-pick .jj-event-card__date small { font-size: 10px; }
.jj-event .jjm-pick .jj-event-card.is-noimg .jj-event-card__date { margin-bottom: 10px; }
.jj-event .jjm-pick .jj-event-card__tags { margin: 0 0 8px; gap: 6px; }
.jj-event .jjm-pick .jj-event-card h3 { margin: 0 0 8px; font-size: 15px; line-height: 1.6; }
.jj-event .jjm-pick .jj-event-card__place { margin: 0; font-size: 11px; line-height: 1.7; }
.jj-event .jjm-pick .jj-event-card__more { margin-top: 10px; font-size: 10px; }
.jj-event .jjm-kinds { display: none; }
.jj-event .jjm-klist {
display: block; margin: 14px 0 0; padding: 12px 0 0;
border-top: 1px solid rgba(23, 26, 21, .14);
}
.jj-event .jjm-klist__a {
display: flex; align-items: center; gap: 9px;
padding: 6px 0; text-decoration: none;
font-size: 12px; letter-spacing: .08em; color: #5d5749;
}
.jj-event .jjm-klist__a + .jjm-klist__a { border-top: 1px dotted rgba(23, 26, 21, .12); }
.jj-event .jjm-klist__a i {
width: 9px; height: 9px; border-radius: 50%; flex: none;
background: var(--jje-k, #6f695d);
}
.jj-event .jjm-klist__a:first-child i { background: none; border: 1px solid rgba(23, 26, 21, .34); }
.jj-event .jjm-klist__a b {
margin-left: auto; font-family: var(--jc-logo), sans-serif;
font-size: 13px; font-weight: 400; color: #8a8271;
}
.jj-event .jjm-klist__a:hover { color: #26231f; }
.jj-event .jjm-klist__a.is-on { color: #26231f; }
.jj-event .jjm-klist__a.is-on b { color: #8f6b12; }
.jj-event .jjm-note {
margin: 16px 2px 0;
font-size: 11px; line-height: 1.85; letter-spacing: .02em;
color: #9d947f;
}
.jj-event .jjm-sheet--kind .jjm-klist { margin: 0; padding: 0; border-top: 0; }
@media (min-width: 1241px) {
.jj-event .jjm-pick .jj-event-section-head {
margin-top: -87px;
margin-bottom: 22px;
}
.jj-event .jjm-pick .jj-event-cards { margin-top: 0; }
}
.jj-event .jjm-e { grid-template-columns: 46px 58px minmax(0, 1fr); }
.jj-event .jjm-e__to {
grid-column: 1; order: 0; text-align: right;
font-family: var(--jc-logo), sans-serif;
font-size: 12px; letter-spacing: .02em; color: #bdb39c; white-space: nowrap;
}
.jj-event .jjm-e__k { grid-column: 2; justify-self: start; text-align: center; }
.jj-event .jjm-e__t { grid-column: 3; }
.jj-event .jjm-e__sub { grid-column: 3; }
@media (max-width: 900px) {
.jj-event .jjm-e__to:empty { display: none; }
.jj-event .jjm-e__to { order: 1; text-align: left; }
}
.jj-event .jj-event-hero::before {
-webkit-mask-image: linear-gradient(180deg,
#000 0%, #000 70%, rgba(0,0,0,.82) 82%, rgba(0,0,0,.34) 93%, transparent 100%);
mask-image: linear-gradient(180deg,
#000 0%, #000 70%, rgba(0,0,0,.82) 82%, rgba(0,0,0,.34) 93%, transparent 100%);
}
.jj-event .jj-event-hero { min-height: clamp(560px, 88vh, 1000px); }
.jj-event .jj-event-hero::before {
-webkit-mask-image: linear-gradient(180deg, #000 0%, #000 92%, transparent 100%);
mask-image: linear-gradient(180deg, #000 0%, #000 92%, transparent 100%);
}
.jj-event .jj-event-bg {
position: fixed; inset: 0; z-index: -1; pointer-events: none;
background-image: var(--jj-event-hero, none);
background-size: cover;
background-position: center;
background-repeat: no-repeat;
}
.jj-event { position: relative; }
.jj-event .jj-event-scrim {
position: absolute; inset: 0; z-index: -1; pointer-events: none;
background: linear-gradient(180deg,
rgba(20, 16, 12, .08) 0,
rgba(20, 16, 12, .16) 52vh,
rgba(20, 16, 12, .70) 86vh,
rgba(20, 16, 12, .88) 118vh,
rgba(20, 16, 12, .92) 100%);
}
.jj-event .jj-event-hero.has-photo::before,
.jj-event .jj-event-hero::before { content: none; }
.jj-event .jj-event-hero.has-photo { background-image: none; }
.jj-event .jj-event-scrim ~ * { position: relative; z-index: 1; }
.jje-k--shop { --jje-k: #3d5670; }
.jj-event .jje-k--shop .jj-event-tag { background: #3a5168; }
body.jja-body:has(.jj-event-scrim) { position: relative; }
.jj-event { position: static; }
body.jja-body.jc-article-page { background: #241d17; }
.jj-event .jj-event-hero { min-height: clamp(380px, 54vh, 600px); }
.jj-event .jj-event-hero h1 { font-size: clamp(2.6rem, 8vw, 5.2rem); }
.jj-event .jjm-rail { position: static; }
.jj-event .jjm-pick { position: static; }
.jj-camp-wrap{
--ink:#25261f;
--olive:#3f4a38;
--paper:#f6f1e6;
--line:#cec6b5;
--muted:#777269;
color:var(--ink);
background:var(--paper);
padding:24px;
box-sizing:border-box;
font-family:-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN",
"Yu Gothic",Meiryo,sans-serif;
}
.jj-camp-sub{
margin:0 0 30px;
color:var(--muted);
font-size:12px;
letter-spacing:.12em;
}
.jj-camp-section{margin:0 0 28px}
.jj-camp-head{
display:flex;
justify-content:space-between;
align-items:baseline;
gap:15px;
padding:12px 16px;
background:var(--olive);
color:#fff;
}
.jj-camp-head h3{
margin:0;
color:#fff;
font-size:23px;
line-height:1.2;
}
.jj-camp-head h3 span{
margin-left:10px;
font-size:11px;
letter-spacing:.14em;
opacity:.75;
}
.jj-camp-count{
flex:none;
font-size:13px;
font-weight:700;
}
.jj-camp-scroll{
width:100%;
overflow-x:auto;
-webkit-overflow-scrolling:touch;
}
.jj-camp-table{
width:100%;
min-width:1100px;
table-layout:fixed;
border-collapse:collapse;
background:#fffdf8;
font-size:13px;
}
.jj-camp-table col:nth-child(1){width:22%}
.jj-camp-table col:nth-child(2){width:11%}
.jj-camp-table col:nth-child(3){width:17%}
.jj-camp-table col:nth-child(4){width:18%}
.jj-camp-table col:nth-child(5){width:15%}
.jj-camp-table col:nth-child(6){width:17%}
.jj-camp-table th,
.jj-camp-table td{
box-sizing:border-box;
padding:10px 12px;
border:1px solid var(--line);
vertical-align:top;
line-height:1.55;
word-break:break-word;
}
.jj-camp-table th{
background:#eae5d9;
font-size:12px;
font-weight:700;
text-align:left;
}
.jj-camp-table td:first-child{font-weight:700}
.jj-camp-table a{
color:inherit;
text-decoration:none;
border-bottom:1px solid #aaa496;
}
.jj-camp-foot{
margin:22px 0 0;
padding-top:12px;
border-top:1px solid var(--line);
color:var(--muted);
font-size:11px;
line-height:1.7;
}
@media(max-width:720px){
.jj-camp-wrap{padding:14px}
.jj-camp-head{padding:10px 12px}
.jj-camp-head h3{font-size:20px}
.jj-camp-table{font-size:12px}
.jj-camp-table th,
.jj-camp-table td{padding:8px 9px}
}
.jj-pg .jj-camp-wrap { padding: 12px; }
.jj-pg .jj-camp-sub { margin: 0 0 12px; font-size: 10px; }
.jj-pg .jj-camp-section { margin: 0 0 12px; }
.jj-pg .jj-camp-head { padding: 6px 10px; }
.jj-pg .jj-camp-head h3 { font-size: 14px; }
.jj-pg .jj-camp-table th,
.jj-pg .jj-camp-table td {
padding: 4px 7px;
line-height: 1.35;
font-size: 11px;
}
.jj-pg .jj-camp-table th { font-size: 10px; }
.jj-pg .jj-camp-foot { padding-top: 6px; font-size: 10px; }
body.jja-body.jc-article-page { background: var(--jc-bg, #fff); }
body.jja-body.jc-article-page:has(.jj-flip),
body.jja-body.jc-article-page:has(.jm-mag) { background: #241d17; }
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jj-bar,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jj-bar a,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jj-foot,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jj-foot a {
color: var(--jc-ink-primary, #111111);
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jj-foot__note,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jj-foot__cr {
color: var(--jc-ink-secondary, #55554f);
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-read .entry-content {
display: grid;
grid-template-columns: 1fr min(40em, 100%) 1fr;
max-width: none;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-read .entry-content > * {
grid-column: 2;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-read .entry-content > figure,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-read .entry-content > table,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-read .entry-content > .jj-camp-wrap,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-read .entry-content > .jc-points{
grid-column: 1 / -1;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-article {
padding-top: 88px;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jj-bar.is-solid {
background-color: rgba(255, 255, 255, .92);
background-image: none;
backdrop-filter: saturate(1.1) blur(8px);
border-bottom-color: var(--jc-line, #d9d9d9);
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jj-bar::before {
display: none;
}
.jm-read .entry-content a{
overflow-wrap: anywhere;
word-break: break-word;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-read .entry-content {
grid-template-columns: minmax(0, 1fr) min(40em, 100%) minmax(0, 1fr);
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-read .entry-content > * {
min-width: 0;
}
.jj-camp-scroll {
max-width: 100%;
min-width: 0;
}
.jj-camp-wrap { max-width: 100%; min-width: 0; }
.jj-camp-section { max-width: 100%; min-width: 0; }
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-opener:has(.jm-opener__img) {
display: grid;
position: relative;
margin: 0 0 clamp(40px, 6vh, 84px);
min-height: clamp(520px, 66vh, 780px);
isolation: isolate;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-opener > * {
grid-area: 1 / 1;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-opener__img {
aspect-ratio: auto;
height: 100%;
margin: 0;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-opener__img::after {
content: "";
position: absolute;
inset: 0;
background: linear-gradient(180deg,
rgba(14, 11, 8, .62) 0%, rgba(14, 11, 8, .34) 38%,
rgba(14, 11, 8, .48) 72%, rgba(14, 11, 8, .78) 100%);
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-opener:has(.jm-opener__img) .jm-opener__inner {
position: relative;
z-index: 1;
align-self: end;
width: 100%;
max-width: 1180px;
margin: 0 auto;
padding: clamp(96px, 14vh, 150px) clamp(24px, 4vw, 64px) clamp(36px, 6vh, 64px);
color: #f4f1e9;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-opener:has(.jm-opener__img) .jm-opener__title {
color: #f6f3ec;
max-width: 17em;
text-shadow: 0 2px 0 rgba(0, 0, 0, .22), 0 14px 38px rgba(0, 0, 0, .45);
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-opener:has(.jm-opener__img) .jm-opener__lede {
color: rgba(244, 241, 233, .88);
max-width: 34em;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-opener:has(.jm-opener__img) .jm-opener__rail,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-opener:has(.jm-opener__img) .jm-opener__meta {
color: rgba(244, 241, 233, .74);
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-opener__credit {
color: rgba(244, 241, 233, .6);
z-index: 2;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jj-bar:not(.is-solid) {
background-color: transparent;
background-image: none;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-article:has(.jm-opener__img) {
padding-top: 0;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jj-bar:not(.is-solid),
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jj-bar:not(.is-solid) a {
color: #f4f1e9;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-article:has(.jm-opener__img) ~ * .jj-bar::before,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jj-bar:not(.is-solid)::before {
display: block;
content: "";
position: absolute;
inset: 0;
z-index: -1;
background: linear-gradient(180deg, rgba(8, 9, 6, .55) 0%, rgba(8, 9, 6, 0) 100%);
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-opener {
grid-template-columns: none;
align-items: normal;
gap: 0;
max-width: none;
padding: 0;
background: none;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-opener:has(.jm-opener__img) .jm-opener__inner {
background: none;
padding-top: clamp(96px, 14vh, 150px);
padding-bottom: clamp(36px, 6vh, 64px);
}
@media (min-width: 900px) {
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-opener__title { grid-column: 2 / 9; }
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-opener__lede  { grid-column: 9 / 12; }
}
@media (min-width: 900px) and (max-width: 1180px) {
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-opener__title { grid-column: 1 / 6; }
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-opener__lede  { grid-column: 6 / 9; }
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content {
writing-mode: horizontal-tb;
text-orientation: initial;
height: auto;
overflow: visible;
border-top: 0;
border-bottom: 0;
padding: 0;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content > p{
margin: 0 0 1.1em;
height: auto;
text-indent: 0;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content h2,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content h3 { height: auto; }
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content h2 {
margin: 2.4em 0 1em;
padding: .5em 0 .55em;
border-top: 2px solid var(--jc-ink-primary);
border-bottom: 1px solid var(--jc-ink-primary);
font-size: clamp(1.15rem, 1.9vw, 1.42rem);
line-height: 1.6;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content h3 { margin: 2em 0 .7em; font-size: 1.02rem; }
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content h2::before,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content h3::before { content: none; }
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content figure,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content .wp-block-image {
margin: 1.7em 0;
width: auto;
max-width: 100%;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read::after { content: none; }
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-read {
margin-inline: auto;
}
@media all {
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content {
display: block;
grid-template-columns: none;
writing-mode: vertical-rl;
width: 100%;
text-orientation: mixed;
height: clamp(460px, 76vh, 880px);
overflow-x: auto;
overflow-y: hidden;
padding: clamp(18px, 3vh, 34px) clamp(24px, 3.4vw, 60px);
border-top: 1px solid var(--jc-ink-primary);
border-bottom: 1px solid var(--jc-ink-primary);
overscroll-behavior-x: contain;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content > p{
margin: 0 0 0 clamp(16px, 1.8vw, 30px);
height: 100%;
text-indent: 1em;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content h2,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content h3 {
height: 100%;
margin: 0 0 0 clamp(20px, 2.2vw, 34px);
padding: 0;
border: 0;
font-size: clamp(1rem, 1.25vw, 1.15rem);
line-height: 1.7;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content h2::before,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content h3::before {
content: "";
display: block;
width: 2px;
height: 34px;
margin: 0 auto .9em;
background: var(--jc-accent);
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content figure,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content .wp-block-image {
margin: 0 0 0 clamp(20px, 2.2vw, 34px);
width: auto;
max-width: none;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read.is-send::after {
content: "← 横に送って読む";
}
}
body.jja-body .jm-read .entry-content .wp-block-quote {
margin: clamp(24px, 3.2vh, 40px) 0;
padding: 0 0 0 clamp(16px, 1.8vw, 24px);
border-left: 2px solid var(--jc-accent);
border-right: 0;
font-style: normal;
}
body.jja-body .jm-read .entry-content .wp-block-quote p {
margin: 0 0 .7em;
text-indent: 0;
font-family: var(--jc-serif), serif;
font-size: 1.02rem;
line-height: 2;
letter-spacing: .04em;
}
body.jja-body .jm-read .entry-content .wp-block-quote cite,
body.jja-body .jm-read .entry-content .wp-block-quote .wp-block-quote__citation {
display: block;
font-family: var(--jc-mono), monospace;
font-size: .62rem;
font-style: normal;
letter-spacing: .16em;
color: var(--jc-ink-secondary);
}
body.jja-body .jm-read .entry-content .wp-block-quote cite::before {
content: "── ";
}
body.jja-body .jm-read .entry-content .wp-block-table {
margin: clamp(24px, 3.2vh, 40px) 0;
}
body.jja-body .jm-read .entry-content .wp-block-table table {
width: 100%;
border-collapse: collapse;
font-family: var(--jc-font), sans-serif;
font-size: .78rem;
line-height: 1.75;
}
body.jja-body .jm-read .entry-content .wp-block-table th {
padding: .7em .9em;
background: var(--jc-ink-primary);
color: var(--jc-bg, #faf7ef);
text-align: left;
font-weight: 700;
letter-spacing: .08em;
}
body.jja-body .jm-read .entry-content .wp-block-table td {
padding: .7em .9em;
border-bottom: 1px solid var(--jc-line);
vertical-align: top;
}
body.jja-body .jm-read .entry-content .wp-block-table tr:nth-child(even) td {
background: var(--jc-bg-3, #f3efe4);
}
body.jja-body .jm-read .entry-content .wp-block-table figcaption {
margin-top: .7em;
font-family: var(--jc-mono), monospace;
font-size: .62rem;
letter-spacing: .14em;
color: var(--jc-ink-mark);
}
body.jja-body .jm-read .entry-content .wp-block-media-text {
margin: clamp(24px, 3.2vh, 40px) 0;
align-items: start;
gap: 0 clamp(20px, 2.6vw, 40px);
}
body.jja-body .jm-read .entry-content .wp-block-media-text__media img {
width: 100%;
height: auto;
max-height: 62vh;
object-fit: cover;
}
body.jja-body .jm-read .entry-content .wp-block-media-text__content {
padding: 0;
}
body.jja-body .jm-read .entry-content .wp-block-media-text__content p {
text-indent: 0;
}
body.jja-body .jm-read .entry-content .is-style-jj-note {
margin: clamp(28px, 4vh, 48px) 0;
padding: clamp(18px, 2.2vw, 26px) clamp(20px, 2.4vw, 30px);
background: var(--jc-bg-3, #f3efe4);
border-left: 3px solid var(--jc-accent);
}
body.jja-body .jm-read .entry-content .is-style-jj-note::before {
content: "編集部から";
display: block;
margin: 0 0 .8em;
font-family: var(--jc-mono), monospace;
font-size: .62rem;
font-weight: 700;
letter-spacing: .2em;
color: var(--jc-accent);
}
body.jja-body .jm-read .entry-content .is-style-jj-note p {
margin: 0 0 .9em;
text-indent: 0;
font-family: var(--jc-serif), serif;
font-size: .92rem;
line-height: 2.05;
letter-spacing: .03em;
}
body.jja-body .jm-read .entry-content .is-style-jj-note p:last-child {
margin-bottom: 0;
}
@media all {
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content div[style*="display:flex"],
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content div[style*="display: flex"] {
display: block !important;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content div[style*="display:flex"] > figure,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content div[style*="display: flex"] > figure {
margin: 0 0 0 clamp(20px, 2.2vw, 34px) !important;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content figure img {
width: auto !important;
max-width: 320px;
height: auto !important;
max-height: 55%;
}
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-read .entry-content > .alignwide {
grid-column: 1 / -1;
width: 100%;
max-width: 1160px;
margin-inline: auto;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-read .entry-content > .alignfull {
grid-column: 1 / -1;
width: 100%;
max-width: none;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-read .entry-content > .alignfull img {
width: 100%;
}
body.jja-body .jm-read .entry-content .wp-block-columns {
gap: clamp(20px, 3vw, 48px);
margin: clamp(28px, 4vh, 56px) 0;
}
body.jja-body .jm-read .entry-content .wp-block-column > h2:first-child {
margin-top: 0;
}
@media all {
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read {
position: relative;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jj-vnav button {
position: absolute;
top: 0;
bottom: 0;
z-index: 3;
width: clamp(44px, 4vw, 64px);
border: 0;
padding: 0;
background: linear-gradient(90deg, rgba(250, 247, 239, .92), rgba(250, 247, 239, 0));
color: var(--jc-ink-primary);
font-family: var(--jc-mono), monospace;
font-size: 1.6rem;
line-height: 1;
cursor: pointer;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 10px;
transition: opacity .2s;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jj-vnav button span {
writing-mode: vertical-rl;
font-size: .58rem;
letter-spacing: .3em;
color: var(--jc-ink-secondary);
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jj-vnav__next {
left: 0;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jj-vnav__prev {
right: 0;
background: linear-gradient(270deg, rgba(250, 247, 239, .92), rgba(250, 247, 239, 0));
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jj-vnav button:disabled {
opacity: 0;
pointer-events: none;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read.is-send::after {
content: "← スワイプで読む";
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content .jj-upright {
text-orientation: upright;
}
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content h2 span.jj-upright,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content h3 span.jj-upright {
display: inline;
margin: 0;
padding: 0;
font-size: inherit;
letter-spacing: inherit;
color: inherit;
}
@media all {
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content {
height: max(460px, calc(100svh - 96px));
border-top: 0;
border-bottom: 0;
padding-top: 12px;
padding-bottom: 12px;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-folio {
display: none;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read.is-send::after {
content: none;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jj-vnav button,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jj-vnav__prev {
background: none;
width: 36px;
}
}
@media all {
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content {
height: max(420px, calc(100svh - 66px - 20px));
scroll-margin-top: 72px;
scroll-snap-align: start;
}
body.jja-body.admin-bar.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content {
height: max(420px, calc(100svh - 66px - 32px - 20px));
scroll-margin-top: 104px;
}
}
body.jja-body.jc-article-page .jm-opener__title,
body.jja-body.jc-article-page .jm-opener__lede {
word-break: auto-phrase;
text-wrap: balance;
}
body.jja-body.jc-article-page .jm-opener__ln {
display: inline-block;
max-width: 100%;
}
@media (min-width: 900px) {
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-opener:has(.jm-opener__img) .jm-opener__title {
grid-column: 2 / 12;
max-width: 19em;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-opener:has(.jm-opener__img) .jm-opener__lede {
grid-column: 2 / 9;
max-width: 34em;
margin-top: clamp(18px, 2.4vh, 28px);
padding-left: 0;
border-left: 0;
align-self: start;
}
}
@media (min-width: 900px) and (max-width: 1180px) {
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-opener:has(.jm-opener__img) .jm-opener__title {
grid-column: 1 / -1;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-opener:has(.jm-opener__img) .jm-opener__lede {
grid-column: 1 / 7;
}
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jj-bar.is-solid .jj-trigger {
color: var(--jc-ink-primary, #111111);
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jj-bar.is-solid .jj-trigger__mark i {
background: var(--jc-ink-primary, #111111);
}
@media (max-width: 899px) {
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-read .entry-content {
grid-template-columns: 20px minmax(0, 1fr) 20px;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-read .entry-content > * {
grid-column: 2;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-read .entry-content > figure,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-read .entry-content > .wp-block-image,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-read .entry-content > table,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-read .entry-content > .jj-camp-wrap,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-read .entry-content > .jc-points,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-read .entry-content > .alignwide,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-read .entry-content > .wp-block-table,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-read .entry-content > .wp-block-columns {
grid-column: 2;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-read .entry-content > .alignfull,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-read .entry-content > figure.alignfull,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-read .entry-content > .wp-block-image.alignfull {
grid-column: 1 / -1;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-read .entry-content img {
max-width: 100%;
height: auto;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-read .entry-content .wp-block-table {
overflow-x: auto;
}
}
@media (max-width: 899px) {
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-read .entry-content h2 {
margin-top: min(2.4em, 48px);
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-read .entry-content .wp-block-columns {
margin-bottom: 20px;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-read .entry-content div[style*="display:flex"],
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-read .entry-content div[style*="display: flex"] {
display: block !important;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-read .entry-content div[style*="display:flex"] > figure,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-read .entry-content div[style*="display: flex"] > figure {
width: min(240px, 100%) !important;
margin: 0 0 16px !important;
}
}
@media (max-width: 899px) {
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content {
height: max(360px, calc(100svh - 70px - 16px));
padding: 10px 20px;
scroll-margin-top: 74px;
}
body.jja-body.admin-bar.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content {
height: max(360px, calc(100svh - 70px - 46px - 16px));
scroll-margin-top: 120px;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content > p,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content p {
font-size: 1rem;
line-height: 1.9;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content p::first-letter,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content > p:first-of-type::first-letter {
float: none;
font-size: inherit;
font-weight: inherit;
line-height: inherit;
margin: 0;
padding: 0;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content div[style*="display:flex"] > figure,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content div[style*="display: flex"] > figure {
width: auto !important;
margin: 0 0 0 16px !important;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content figure img {
max-width: 240px;
max-height: 50%;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jj-vnav button {
width: 24px;
font-size: 1.2rem;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jj-vnav button span {
display: none;
}
}
.jm-read .entry-content > figure:not(.wp-block-image):not(:has(> img)):not(:has(> a > img)) {
display: block;
grid-template-columns: none;
background: none;
padding: 0;
border: 0;
border-radius: 0;
box-shadow: none;
transform: none;
transition: none;
}
.jm-read .entry-content > figure:not(.wp-block-image):not(:has(> img)):not(:has(> a > img)) figcaption::before {
content: none;
}
.jm-read .entry-content > figure:not(.wp-block-image):not(:has(> img)):not(:has(> a > img))::before,
.jm-read .entry-content > figure:not(.wp-block-image):not(:has(> img)):not(:has(> a > img))::after {
content: none;
}
body.jja-body .jm-read .entry-content .wp-block-table > table {
width: 100%;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-read .entry-content > figure:not(.wp-block-image):not(:has(> img)):not(:has(> a > img)):not(.alignwide):not(.alignfull) {
grid-column: 2;
}
body.jja-body .jm-read .entry-content .wp-block-table table,
body.jja-body .jm-read .entry-content .wp-block-table thead,
body.jja-body .jm-read .entry-content .wp-block-table tbody,
body.jja-body .jm-read .entry-content .wp-block-table tr {
border: 0;
}
body.jja-body .jm-read .entry-content .wp-block-table th,
body.jja-body .jm-read .entry-content .wp-block-table td {
border: 0;
border-bottom: 1px solid var(--jc-line);
}
body.jja-body .jm-read .entry-content .wp-block-table th {
border-bottom: 0;
}
body.jja-body .jm-read .entry-content .wp-block-table th + th {
border-left: 1px solid rgba(250, 247, 239, .22);
}
body.jja-body .jm-read .entry-content .wp-block-table td + td {
border-left: 1px solid var(--jc-line);
}
body.jja-body .jm-read .entry-content .wp-block-table tbody tr:last-child td {
border-bottom: 1px solid var(--jc-ink-primary);
}
@media (min-width: 900px) {
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-read .entry-content > .alignfull {
width: 100vw;
max-width: 100vw;
margin-left: calc(50% - 50vw);
margin-right: calc(50% - 50vw);
justify-self: center;
}
}
body.jja-body .jm-read .entry-content .wp-block-pullquote cite {
font-style: normal;
font-size: .78rem;
letter-spacing: .12em;
}
body.jja-body .jm-read .entry-content .wp-block-pullquote cite::before {
content: "── ";
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-read .entry-content .wp-block-cover img.wp-block-cover__image-background,
body.jja-body .jm-read .entry-content .wp-block-cover .wp-block-cover__image-background {
width: 100%;
height: 100%;
max-width: none;
object-fit: cover;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-opener:has(.jm-opener__img) {
grid-template-columns: minmax(0, 1fr);
}
body.jja-body.jc-article-page .jm-opener__inner,
body.jja-body.jc-article-page .jm-opener__img {
min-width: 0;
}
body.jja-body.jc-article-page .jm-opener__title,
body.jja-body.jc-article-page .jm-opener__lede {
overflow-wrap: anywhere;
}
body.jja-body .jm-read .entry-content p.is-style-jj-info {
margin: 0 0 .7em;
text-indent: 0;
font: 500 .72rem/1.7 var(--jc-mono), monospace;
letter-spacing: .06em;
color: var(--jc-ink-secondary);
}
body.jja-body .jm-read .entry-content .wp-block-button__link {
display: inline-block;
padding: .7em 1.4em;
border: 0;
border-radius: 0;
background: var(--jc-ink-primary);
color: var(--jc-bg, #faf7ef);
font: 700 .74rem/1.2 var(--jc-font), sans-serif;
letter-spacing: .14em;
text-decoration: none;
}
body.jja-body .jm-read .entry-content .wp-block-button__link:hover {
opacity: .8;
}
body.jja-body .jm-read .entry-content {
counter-reset: jj-spread;
}
body.jja-body.jj-cat--choice,
body.jja-body.jj-cat--guide     { --jj-cat: #f3efd7; }
body.jja-body.jj-cat--custom,
body.jja-body.jj-cat--procedure { --jj-cat: #f2e7e3; }
body.jja-body.jj-cat--outdoor,
body.jja-body.jj-cat--photo     { --jj-cat: #e4ebe1; }
body.jja-body.jj-cat--gear,
body.jja-body.jj-cat--review    { --jj-cat: #e9eaea; }
body.jja-body.jc-article-page {
background: var(--jj-cat, var(--jc-bg));
}
body.jja-body .jm-read .entry-content .wp-block-list {
margin: 0 0 1.4em;
padding-left: 1.7em;
font: 400 .92rem/2 var(--jc-serif), serif;
letter-spacing: .03em;
}
body.jja-body .jm-read .entry-content .wp-block-list li {
margin: 0 0 .5em;
text-indent: 0;
}
body.jja-body .jm-read .entry-content .wp-block-list li::marker {
color: var(--jc-ink-secondary);
font: 700 .74rem/1 var(--jc-mono), monospace;
letter-spacing: .1em;
}
body.jja-body .jm-read .entry-content ol.wp-block-list {
list-style-type: decimal-leading-zero;
}
body.jja-body .jm-read .entry-content .wp-block-list .wp-block-list {
margin: .4em 0 .2em;
font-size: .95em;
}
body.jja-body .jm-read .entry-content .wp-block-columns:not([class*="is-style-jj-"]):not(.jj-pairs) > .wp-block-column {
padding: 0 clamp(12px, 1.4vw, 18px) clamp(14px, 1.6vw, 20px);
}
body.jja-body .jm-read .entry-content .wp-block-columns:not([class*="is-style-jj-"]):not(.jj-pairs) > .wp-block-column:not(.has-background) {
background: #fff;
border-top: 2px solid var(--jc-ink-primary);
}
body.jja-body .jm-read .entry-content .wp-block-columns:not([class*="is-style-jj-"]):not(.jj-pairs) > .wp-block-column.has-background {
border-top: 0;
padding-top: clamp(14px, 1.6vw, 20px);
}
body.jja-body .jm-read .entry-content .wp-block-columns:not([class*="is-style-jj-"]):not(.jj-pairs) > .wp-block-column > figure {
margin: 12px calc(-1 * clamp(12px, 1.4vw, 18px)) 12px;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec {
position: relative;
margin: clamp(48px, 7vh, 88px) auto;
padding: 0;
background: none;
color: var(--jc-ink-primary);
}
body.jja-body .jm-read .entry-content .is-style-jj-sec > .wp-block-group__inner-container,
body.jja-body .jm-read .entry-content .is-style-jj-sec:not(:has(> .wp-block-group__inner-container)) {
position: relative;
z-index: 1;
display: block;
counter-reset: jj-card;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec h2 {
display: flex;
flex-wrap: wrap;
align-items: baseline;
gap: 4px 18px;
margin: 0 0 26px;
padding: 0 0 10px;
border: 0;
border-bottom: 2px solid var(--jc-ink-primary);
font: 800 clamp(1.3rem, 2.2vw, 1.9rem)/1.35 var(--jc-serif), serif;
letter-spacing: .02em;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec h2::before {
content: none;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec h2::after {
content: none;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec h2 span {
flex-basis: 100%;
display: block;
width: 100%;
margin: 2px 0 0;
font: 500 .72rem/1.6 var(--jc-font), sans-serif;
letter-spacing: .12em;
color: var(--jc-ink-secondary);
}
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) {
position: relative;
margin: 0 0 clamp(20px, 2.4vw, 34px);
break-inside: avoid;
padding: clamp(40px, 5vw, 56px) clamp(24px, 5vw, 60px) clamp(32px, 4vw, 44px);
background: #fff;
border: 0;
counter-increment: jj-card;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full)::before {
content: counter(jj-card, decimal-leading-zero);
position: absolute;
top: -.18em;
right: .12em;
z-index: 0;
font: 400 clamp(6rem, 13vw, 11rem)/1 var(--jc-serif), serif;
color: transparent;
-webkit-text-stroke: 1.2px rgba(23, 26, 21, .2);
pointer-events: none;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) > * {
position: relative;
z-index: 1;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) h3 {
margin: .5em 0 .5em;
padding: 0;
border: 0;
font: 800 1rem/1.5 var(--jc-serif), serif;
letter-spacing: .03em;
break-after: avoid;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) h3::before,
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) h3::after {
content: none;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) h3 + p {
text-indent: 0;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) p {
margin: 0 0 1em;
text-indent: 0;
text-align: justify;
font: 400 .9rem/2 var(--jc-serif), serif;
letter-spacing: .03em;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) h2 + p::first-letter {
float: left;
margin: .1em .14em 0 0;
font: 800 3.4em/1 var(--jc-serif), serif;
color: var(--jc-ink-primary);
}
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) p:last-child {
margin-bottom: 0;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec .wp-block-separator {
width: 100%;
height: 0;
margin: clamp(22px, 2.6vw, 34px) 0;
padding: 0;
border: 0;
border-top: 1px solid rgba(23, 26, 21, .22);
background: none;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec > .wp-block-group__inner-container > h2,
body.jja-body .jm-read .entry-content .is-style-jj-sec:not(:has(> .wp-block-group__inner-container)) > h2 {
column-span: all;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) h2 {
margin: 0 0 26px;
padding: 0 0 10px;
font: 800 clamp(1.3rem, 2.2vw, 1.9rem)/1.35 var(--jc-serif), serif;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) h2::before {
content: counter(jj-card, decimal-leading-zero) " \2500";
position: static;
padding: 0;
font: 700 .8rem/1 var(--jc-mono), monospace;
letter-spacing: .12em;
color: var(--jc-ink-primary);
}
body.jja-body {
--jj-pad-t: clamp(40px, 5vw, 56px);
--jj-pad-x: clamp(24px, 5vw, 60px);
--jj-pad-b: clamp(32px, 4vw, 44px);
--jj-num: clamp(6rem, 13vw, 11rem);
--jj-num-ink: rgba(23, 26, 21, .2);
--jj-title: 800 clamp(1.3rem, 2.2vw, 1.9rem)/1.35 var(--jc-serif), serif;
--jj-kicker: 700 .8rem/1 var(--jc-mono), monospace;
--jj-sub: 500 .72rem/1.6 var(--jc-font), sans-serif;
--jj-body: 400 .9rem/2 var(--jc-serif), serif;
--jj-drop: 800 3.4em/1 var(--jc-serif), serif;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) {
padding: var(--jj-pad-t) var(--jj-pad-x) var(--jj-pad-b);
background: #fff;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full)::before {
font: 400 var(--jj-num)/1 var(--jc-serif), serif;
color: transparent;
-webkit-text-stroke: 1.2px var(--jj-num-ink);
}
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) h2 {
margin: 0 0 26px;
padding: 0 0 10px;
border: 0;
border-bottom: 2px solid var(--jc-ink-primary);
font: var(--jj-title);
letter-spacing: .02em;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) h2::before {
font: var(--jj-kicker);
letter-spacing: .12em;
color: var(--jc-ink-primary);
}
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) h2 span {
font: var(--jj-sub);
letter-spacing: .12em;
color: var(--jc-ink-secondary);
}
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) p {
font: var(--jj-body);
letter-spacing: .03em;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) h2 + p::first-letter {
float: left;
margin: .1em .14em 0 0;
font: var(--jj-drop);
color: var(--jc-ink-primary);
}
body.jja-body {
--jj-title-lead: 800 clamp(1.7rem, 3vw, 2.5rem)/1.35 var(--jc-serif), serif;
}
body.jja-body .jm-read .entry-content {
counter-reset: jj-spread jj-card;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec > .wp-block-group__inner-container,
body.jja-body .jm-read .entry-content .is-style-jj-sec:not(:has(> .wp-block-group__inner-container)) {
counter-reset: none;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec:has(:is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):nth-of-type(1)) { counter-increment: jj-card 1; }
body.jja-body .jm-read .entry-content .is-style-jj-sec:has(:is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):nth-of-type(2)) { counter-increment: jj-card 2; }
body.jja-body .jm-read .entry-content .is-style-jj-sec:has(:is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):nth-of-type(3)) { counter-increment: jj-card 3; }
body.jja-body .jm-read .entry-content .is-style-jj-sec:has(:is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):nth-of-type(4)) { counter-increment: jj-card 4; }
body.jja-body .jm-read .entry-content .is-style-jj-sec:has(:is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):nth-of-type(5)) { counter-increment: jj-card 5; }
body.jja-body .jm-read .entry-content .is-style-jj-sec:has(:is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):nth-of-type(6)) { counter-increment: jj-card 6; }
body.jja-body .jm-read .entry-content .is-style-jj-sec:has(:is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):nth-of-type(7)) { counter-increment: jj-card 7; }
body.jja-body .jm-read .entry-content .is-style-jj-sec:has(:is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):nth-of-type(8)) { counter-increment: jj-card 8; }
body.jja-body .jm-read .entry-content .is-style-jj-sec:has(:is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):nth-of-type(9)) { counter-increment: jj-card 9; }
body.jja-body .jm-read .entry-content .is-style-jj-sec:has(:is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):nth-of-type(10)) { counter-increment: jj-card 10; }
body.jja-body .jm-read .entry-content .is-style-jj-sec:has(:is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):nth-of-type(11)) { counter-increment: jj-card 11; }
body.jja-body .jm-read .entry-content .is-style-jj-sec:has(:is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):nth-of-type(12)) { counter-increment: jj-card 12; }
body.jja-body .jm-read .entry-content .is-style-jj-sec:has(:is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):nth-of-type(1)) :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):first-of-type { counter-increment: jj-card 0; }
body.jja-body .jm-read .entry-content .is-style-jj-sec:has(:is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):nth-of-type(2)) :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):first-of-type { counter-increment: jj-card -1; }
body.jja-body .jm-read .entry-content .is-style-jj-sec:has(:is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):nth-of-type(3)) :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):first-of-type { counter-increment: jj-card -2; }
body.jja-body .jm-read .entry-content .is-style-jj-sec:has(:is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):nth-of-type(4)) :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):first-of-type { counter-increment: jj-card -3; }
body.jja-body .jm-read .entry-content .is-style-jj-sec:has(:is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):nth-of-type(5)) :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):first-of-type { counter-increment: jj-card -4; }
body.jja-body .jm-read .entry-content .is-style-jj-sec:has(:is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):nth-of-type(6)) :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):first-of-type { counter-increment: jj-card -5; }
body.jja-body .jm-read .entry-content .is-style-jj-sec:has(:is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):nth-of-type(7)) :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):first-of-type { counter-increment: jj-card -6; }
body.jja-body .jm-read .entry-content .is-style-jj-sec:has(:is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):nth-of-type(8)) :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):first-of-type { counter-increment: jj-card -7; }
body.jja-body .jm-read .entry-content .is-style-jj-sec:has(:is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):nth-of-type(9)) :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):first-of-type { counter-increment: jj-card -8; }
body.jja-body .jm-read .entry-content .is-style-jj-sec:has(:is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):nth-of-type(10)) :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):first-of-type { counter-increment: jj-card -9; }
body.jja-body .jm-read .entry-content .is-style-jj-sec:has(:is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):nth-of-type(11)) :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):first-of-type { counter-increment: jj-card -10; }
body.jja-body .jm-read .entry-content .is-style-jj-sec:has(:is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):nth-of-type(12)) :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):first-of-type { counter-increment: jj-card -11; }
body.jja-body .jm-read .entry-content .is-style-jj-sec .is-style-jj-lead {
column-span: all;
break-inside: avoid;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec .is-style-jj-lead h2 {
font: var(--jj-title-lead);
max-width: 22em;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) figure {
margin: .3em 0 1.1em;
padding: 0;
background: none;
border: 0;
box-shadow: none;
transform: none;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) figure img {
display: block;
width: 100%;
height: auto;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) figcaption {
margin: 6px 0 0;
font: 400 .68rem/1.6 var(--jc-font), sans-serif;
letter-spacing: .04em;
color: var(--jc-ink-secondary);
}
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) figcaption::before,
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) figure::before,
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) figure::after {
content: none;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec .is-style-jj-lead > .wp-block-group__inner-container > figure:first-child,
body.jja-body .jm-read .entry-content .is-style-jj-sec .is-style-jj-lead:not(:has(> .wp-block-group__inner-container)) > figure:first-child {
margin: calc(-1 * var(--jj-pad-t)) calc(-1 * var(--jj-pad-x)) clamp(24px, 3vw, 40px);
}
body.jja-body .jm-read .entry-content .is-style-jj-sec .is-style-jj-lead > .wp-block-group__inner-container > figure:first-child img,
body.jja-body .jm-read .entry-content .is-style-jj-sec .is-style-jj-lead:not(:has(> .wp-block-group__inner-container)) > figure:first-child img {
aspect-ratio: 21 / 9;
object-fit: cover;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec:not(.jj-2col) :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not(.is-style-jj-lead):has(figure) {
column-span: all;
break-inside: avoid;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not(.is-style-jj-lead) > .wp-block-group__inner-container:has(> figure),
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not(.is-style-jj-lead):not(:has(> .wp-block-group__inner-container)):has(> figure) {
display: grid;
grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
grid-template-areas: "pic head" "pic body";
column-gap: clamp(20px, 2.8vw, 40px);
align-items: start;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not(.is-style-jj-lead) > .wp-block-group__inner-container:has(> figure) > figure,
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not(.is-style-jj-lead):not(:has(> .wp-block-group__inner-container)):has(> figure) > figure {
grid-area: pic;
margin: 0;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not(.is-style-jj-lead) > .wp-block-group__inner-container:has(> figure) > figure img,
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not(.is-style-jj-lead):not(:has(> .wp-block-group__inner-container)):has(> figure) > figure img {
aspect-ratio: 4 / 5;
object-fit: cover;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not(.is-style-jj-lead) > .wp-block-group__inner-container:has(> figure) > h2,
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not(.is-style-jj-lead):not(:has(> .wp-block-group__inner-container)):has(> figure) > h2 {
grid-area: head;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not(.is-style-jj-lead) > .wp-block-group__inner-container:has(> figure) > :not(figure):not(h2),
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not(.is-style-jj-lead):not(:has(> .wp-block-group__inner-container)):has(> figure) > :not(figure):not(h2) {
grid-column: 2;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not(.is-style-jj-lead):nth-child(even of :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):has(figure)) > .wp-block-group__inner-container:has(> figure),
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not(.is-style-jj-lead):nth-child(even of :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):has(figure)):not(:has(> .wp-block-group__inner-container)):has(> figure) {
grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
grid-template-areas: "head pic" "body pic";
}
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not(.is-style-jj-lead):nth-child(even of :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):has(figure)) > .wp-block-group__inner-container:has(> figure) > :not(figure):not(h2),
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not(.is-style-jj-lead):nth-child(even of :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):has(figure)):not(:has(> .wp-block-group__inner-container)):has(> figure) > :not(figure):not(h2) {
grid-column: 1;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec .wp-block-pullquote,
body.jja-body .jm-read .entry-content .is-style-jj-sec .is-style-jj-note {
column-span: all;
break-inside: avoid;
margin: 0 0 clamp(20px, 2.4vw, 34px);
}
@media (max-width: 781px) {
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not(.is-style-jj-lead) > .wp-block-group__inner-container:has(> figure),
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not(.is-style-jj-lead):not(:has(> .wp-block-group__inner-container)):has(> figure) {
display: block;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not(.is-style-jj-lead) figure img {
aspect-ratio: 4 / 3;
}
}
body.jja-body .jm-read .entry-content .jj-sources {
margin: clamp(32px, 4vh, 48px) 0 0;
padding: 18px 0 0;
border-top: 1px solid rgba(23, 26, 21, .22);
}
body.jja-body .jm-read .entry-content .jj-sources h3 {
margin: 0 0 10px;
font: 700 .72rem/1 var(--jc-mono), monospace;
letter-spacing: .14em;
color: var(--jc-ink-secondary);
}
body.jja-body .jm-read .entry-content .jj-sources h3::after {
content: none;
}
body.jja-body .jm-read .entry-content .jj-sources .wp-block-list {
column-count: 2;
column-gap: clamp(24px, 3vw, 40px);
margin: 0;
padding-left: 1.2em;
font: 400 .72rem/1.7 var(--jc-font), sans-serif;
letter-spacing: .02em;
color: var(--jc-ink-secondary);
}
body.jja-body .jm-read .entry-content .jj-sources .wp-block-list li {
margin: 0 0 .35em;
break-inside: avoid;
overflow-wrap: anywhere;
}
body.jja-body .jm-read .entry-content .jj-sources .is-style-jj-info {
margin: 12px 0 0;
}
@media (max-width: 781px) {
body.jja-body .jm-read .entry-content .jj-sources .wp-block-list { column-count: 1; }
}
body.jja-body .jm-read .entry-content .is-style-jj-sec:not(.jj-2col) :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not(.is-style-jj-lead):has(figure):not(:has(figure:not(.jj-filler))) {
column-span: none;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec:is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) {
margin: 0;
padding: var(--jj-pad-t) var(--jj-pad-x) var(--jj-pad-b);
background: #fff;
counter-increment: none;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec:is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) > .wp-block-group__inner-container,
body.jja-body .jm-read .entry-content .is-style-jj-sec:is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not(:has(> .wp-block-group__inner-container)) {
display: block;
column-count: auto;
counter-reset: none;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec:is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):has(:is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full)),
body.jja-body .jm-read .entry-content .is-style-jj-sec:is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):has(:is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full)) :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):first-of-type {
counter-increment: none;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) {
margin: 0;
padding: 0;
background: none;
counter-increment: none;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full)::before {
content: none;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full)::before {
content: attr(data-jj-no);
}
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) h2::before {
content: attr(data-jj-no) " \2500";
}
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not([data-jj-no])::before,
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) h2:not([data-jj-no])::before {
content: none;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper {
padding: clamp(40px, 5vw, 64px) 0 clamp(24px, 3vw, 40px);
background: #fff;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper > .wp-block-group__inner-container,
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper:not(:has(> .wp-block-group__inner-container)) {
display: block;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) {
margin: 0;
padding: clamp(40px, 5vw, 64px) clamp(24px, 6vw, 96px) clamp(40px, 5vw, 64px);
background: none;
border: 0;
border-top: 1px solid rgba(23, 26, 21, .18);
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):first-of-type {
border-top: 0;
padding-top: 0;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) > .wp-block-group__inner-container > :not(figure):not(.wp-block-pullquote):not(.jj-aside),
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not(:has(> .wp-block-group__inner-container)) > :not(figure):not(.wp-block-pullquote):not(.jj-aside) {
max-width: 36em;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) h2 {
margin: 0 0 clamp(22px, 3vw, 34px);
padding: 0 0 12px;
border-bottom: 1px solid var(--jc-ink-primary);
font: 800 clamp(1.5rem, 2.6vw, 2.2rem)/1.35 var(--jc-serif), serif;
max-width: 20em;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):is(:nth-of-type(even),.jj-num-right) > .wp-block-group__inner-container > :not(figure):not(.wp-block-pullquote):not(.jj-aside),
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):is(:nth-of-type(even),.jj-num-right):not(:has(> .wp-block-group__inner-container)) > :not(figure):not(.wp-block-pullquote):not(.jj-aside) {
margin-left: auto;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):is(:nth-of-type(even),.jj-num-right)::before {
right: auto;
left: .12em;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) figure:not(.jj-filler) {
margin: clamp(24px, 3vw, 40px) calc(-1 * clamp(24px, 6vw, 96px));
max-width: none;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) figure:not(.jj-filler) img {
aspect-ratio: auto;
object-fit: contain;
width: 100%;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) figcaption {
margin: 8px clamp(24px, 6vw, 96px) 0;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper .wp-block-pullquote {
margin: clamp(32px, 4vw, 56px) auto;
max-width: 28em;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper .wp-block-list {
max-width: 36em;
}
@media (max-width: 781px) {
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) {
padding-left: 20px;
padding-right: 20px;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) figure:not(.jj-filler) {
margin-left: -20px;
margin-right: -20px;
}
}
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not(.is-style-jj-lead) > .wp-block-group__inner-container:has(> figure),
body.jja-body .jm-read .entry-content .is-style-jj-sec :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not(.is-style-jj-lead):not(:has(> .wp-block-group__inner-container)):has(> figure){
grid-template-rows: auto 1fr;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):is(:nth-of-type(even),.jj-num-right) > .wp-block-group__inner-container > :not(figure):not(.wp-block-pullquote):not(.jj-aside),
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):is(:nth-of-type(even),.jj-num-right):not(:has(> .wp-block-group__inner-container)) > :not(figure):not(.wp-block-pullquote):not(.jj-aside) {
margin-left: clamp(4em, 18%, 12em);
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).is-style-jj-lead h2 {
font: 800 clamp(2rem, 3.6vw, 3rem)/1.3 var(--jc-serif), serif;
max-width: 14em;
margin-bottom: clamp(28px, 3.6vw, 44px);
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).is-style-jj-lead::before {
font-size: clamp(8rem, 18vw, 15rem);
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).is-style-jj-lead h2 + p {
font-size: 1.08rem;
line-height: 2.1;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).jj-cols {
display: block;
column-count: 2;
column-gap: clamp(28px, 4vw, 56px);
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).jj-cols > .wp-block-group__inner-container > :not(figure):not(.wp-block-pullquote):not(.jj-aside),
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).jj-cols:not(:has(> .wp-block-group__inner-container)) > :not(figure):not(.wp-block-pullquote):not(.jj-aside) {
max-width: none;
margin-left: 0;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).jj-cols h2,
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).jj-cols .wp-block-buttons {
column-span: all;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).jj-cols h2 {
max-width: 20em;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).jj-cols p {
break-inside: avoid;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).is-style-jj-full > .wp-block-group__inner-container:has(> figure),
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).is-style-jj-full:not(:has(> .wp-block-group__inner-container)):has(> figure) {
display: block;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).is-style-jj-full > .wp-block-group__inner-container > :not(figure):not(.wp-block-pullquote):not(.jj-aside),
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).is-style-jj-full:not(:has(> .wp-block-group__inner-container)) > :not(figure):not(.wp-block-pullquote):not(.jj-aside) {
margin-left: 0;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper > .wp-block-pullquote,
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper > .wp-block-group__inner-container > .wp-block-pullquote {
margin: 0;
padding: clamp(40px, 5vw, 72px) clamp(24px, 6vw, 96px);
max-width: none;
border: 0;
background: var(--jc-ink-primary, #111111);
color: #fff;
text-align: left;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper > .wp-block-pullquote blockquote,
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper > .wp-block-group__inner-container > .wp-block-pullquote blockquote {
margin: 0;
padding: 0;
border: 0;
max-width: 24em;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper > .wp-block-pullquote p,
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper > .wp-block-group__inner-container > .wp-block-pullquote p {
margin: 0;
font: 500 clamp(1.15rem, 2.1vw, 1.7rem)/1.8 var(--jc-serif), serif;
letter-spacing: .04em;
color: #fff;
text-indent: 0;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper > .wp-block-pullquote::before,
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper > .wp-block-pullquote blockquote::before,
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper > .wp-block-pullquote p::before {
content: none;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper .wp-block-pullquote + :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) {
border-top: 0;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) figure.wp-block-table.jj-styles {
margin: clamp(24px, 3vw, 40px) calc(-1 * clamp(24px, 6vw, 96px)) 0;
max-width: none;
overflow-x: auto;
}
body.jja-body .jm-read .entry-content .jj-styles table {
width: 100%;
border-collapse: collapse;
table-layout: fixed;
font: 400 .76rem/1.75 var(--jc-font), sans-serif;
letter-spacing: .02em;
color: var(--jc-ink-primary);
}
body.jja-body .jm-read .entry-content .jj-styles th,
body.jja-body .jm-read .entry-content .jj-styles td {
padding: 12px 10px;
border: 0;
border-top: 1px solid rgba(23, 26, 21, .18);
vertical-align: top;
text-align: left;
overflow-wrap: anywhere;
}
body.jja-body .jm-read .entry-content .jj-styles th {
padding-top: 0;
border-top: 0;
border-bottom: 1px solid var(--jc-ink-primary);
font: 700 .66rem/1 var(--jc-mono), monospace;
letter-spacing: .14em;
color: var(--jc-ink-secondary);
}
body.jja-body .jm-read .entry-content .jj-styles th:nth-child(1), body.jja-body .jm-read .entry-content .jj-styles td:nth-child(1) { width: 17%; }
body.jja-body .jm-read .entry-content .jj-styles th:nth-child(2), body.jja-body .jm-read .entry-content .jj-styles td:nth-child(2) { width: 13%; }
body.jja-body .jm-read .entry-content .jj-styles th:nth-child(3), body.jja-body .jm-read .entry-content .jj-styles td:nth-child(3) { width: 22%; }
body.jja-body .jm-read .entry-content .jj-styles th:nth-child(4), body.jja-body .jm-read .entry-content .jj-styles td:nth-child(4) { width: 17%; }
body.jja-body .jm-read .entry-content .jj-styles th:nth-child(5), body.jja-body .jm-read .entry-content .jj-styles td:nth-child(5) { width: 20%; }
body.jja-body .jm-read .entry-content .jj-styles th:nth-child(6), body.jja-body .jm-read .entry-content .jj-styles td:nth-child(6) { width: 11%; }
body.jja-body .jm-read .entry-content .jj-styles td:nth-child(1) {
padding-left: 0;
}
body.jja-body .jm-read .entry-content .jj-styles td:nth-child(1) strong {
display: block;
margin: 0 0 4px;
font: 700 .95rem/1.5 var(--jc-serif), serif;
letter-spacing: .02em;
}
body.jja-body .jm-read .entry-content .jj-styles td:nth-child(5) strong {
font-weight: 700;
color: var(--jc-ink-secondary);
}
body.jja-body .jm-read .entry-content .jj-styles td:nth-child(6) {
padding-right: 0;
font-size: .72rem;
color: var(--jc-ink-secondary);
}
@media (max-width: 781px) {
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) figure.wp-block-table.jj-styles {
margin-left: -20px;
margin-right: -20px;
}
body.jja-body .jm-read .entry-content .jj-styles table,
body.jja-body .jm-read .entry-content .jj-styles tbody,
body.jja-body .jm-read .entry-content .jj-styles tr,
body.jja-body .jm-read .entry-content .jj-styles td {
display: block;
width: auto;
}
body.jja-body .jm-read .entry-content .jj-styles thead {
display: none;
}
body.jja-body .jm-read .entry-content .jj-styles tr {
padding: 16px 20px;
border-top: 1px solid rgba(23, 26, 21, .18);
}
body.jja-body .jm-read .entry-content .jj-styles td {
padding: 4px 0;
border: 0;
}
body.jja-body .jm-read .entry-content .jj-styles td:nth-child(n+2)::before {
display: block;
margin: 6px 0 0;
font: 700 .62rem/1.6 var(--jc-mono), monospace;
letter-spacing: .14em;
color: var(--jc-ink-secondary);
}
body.jja-body .jm-read .entry-content .jj-styles td:nth-child(2)::before { content: "色"; }
body.jja-body .jm-read .entry-content .jj-styles td:nth-child(3)::before { content: "顔・グリル"; }
body.jja-body .jm-read .entry-content .jj-styles td:nth-child(4)::before { content: "足まわり"; }
body.jja-body .jm-read .entry-content .jj-styles td:nth-child(5)::before { content: "内装・その他"; }
body.jja-body .jm-read .entry-content .jj-styles td:nth-child(6)::before { content: "判定の目印"; }
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).jj-cols {
column-count: 1;
}
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).is-style-jj-full > .wp-block-group__inner-container:has(> figure) > figure:not(.jj-filler):not(.wp-block-table),
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).is-style-jj-full:not(:has(> .wp-block-group__inner-container)):has(> figure) > figure:not(.jj-filler):not(.wp-block-table) {
margin: clamp(24px, 3vw, 40px) calc(-1 * clamp(24px, 6vw, 96px));
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).is-style-jj-full > .wp-block-group__inner-container:has(> figure) > figure img,
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).is-style-jj-full:not(:has(> .wp-block-group__inner-container)):has(> figure) > figure img {
aspect-ratio: auto;
object-fit: contain;
width: 100%;
height: auto;
}
@media (max-width: 781px) {
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).is-style-jj-full > .wp-block-group__inner-container:has(> figure) > figure:not(.jj-filler):not(.wp-block-table),
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).is-style-jj-full:not(:has(> .wp-block-group__inner-container)):has(> figure) > figure:not(.jj-filler):not(.wp-block-table) {
margin-left: -20px;
margin-right: -20px;
}
}
body.jja-body .jm-read .entry-content .wp-block-table.jj-styles tr:nth-child(even) td {
background: transparent;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).is-style-jj-lead h2 {
max-width: 18em;
}
body.jja-body .jm-read .entry-content .jj-styles table,
body.jja-body .jm-read .entry-content .jj-styles tbody {
display: block;
width: auto;
}
body.jja-body .jm-read .entry-content .jj-styles thead {
display: none;
}
body.jja-body .jm-read .entry-content .jj-styles tr {
display: grid;
grid-template-columns: minmax(11em, 15em) minmax(0, 1fr);
column-gap: clamp(24px, 3vw, 48px);
align-items: start;
padding: clamp(18px, 2vw, 26px) 0;
border-top: 1px solid rgba(23, 26, 21, .18);
}
body.jja-body .jm-read .entry-content .jj-styles tbody tr:first-child {
border-top: 0;
padding-top: 0;
}
body.jja-body .jm-read .entry-content .jj-styles td {
display: block;
width: auto;
padding: 0;
border: 0;
}
body.jja-body .jm-read .entry-content .jj-styles th:nth-child(1), body.jja-body .jm-read .entry-content .jj-styles td:nth-child(1),
body.jja-body .jm-read .entry-content .jj-styles th:nth-child(2), body.jja-body .jm-read .entry-content .jj-styles td:nth-child(2),
body.jja-body .jm-read .entry-content .jj-styles th:nth-child(3), body.jja-body .jm-read .entry-content .jj-styles td:nth-child(3),
body.jja-body .jm-read .entry-content .jj-styles th:nth-child(4), body.jja-body .jm-read .entry-content .jj-styles td:nth-child(4),
body.jja-body .jm-read .entry-content .jj-styles th:nth-child(5), body.jja-body .jm-read .entry-content .jj-styles td:nth-child(5),
body.jja-body .jm-read .entry-content .jj-styles th:nth-child(6), body.jja-body .jm-read .entry-content .jj-styles td:nth-child(6) {
width: auto;
}
body.jja-body .jm-read .entry-content .jj-styles td:nth-child(1) {
grid-column: 1;
grid-row: 1 / span 9;
padding: 0;
font-size: .76rem;
line-height: 1.75;
color: var(--jc-ink-secondary);
}
body.jja-body .jm-read .entry-content .jj-styles td:nth-child(n+2) {
grid-column: 2;
display: grid;
grid-template-columns: 6em minmax(0, 1fr);
column-gap: 12px;
padding: 3px 0;
font-size: .78rem;
color: var(--jc-ink-primary);
}
body.jja-body .jm-read .entry-content .jj-styles td:empty {
display: none;
}
body.jja-body .jm-read .entry-content .jj-styles td:nth-child(n+2)::before {
display: block;
margin: 0;
padding-top: .2em;
font: 700 .62rem/1.6 var(--jc-mono), monospace;
letter-spacing: .14em;
color: var(--jc-ink-secondary);
}
body.jja-body .jm-read .entry-content .jj-styles td:nth-child(2)::before { content: "色"; }
body.jja-body .jm-read .entry-content .jj-styles td:nth-child(3)::before { content: "顔・グリル"; }
body.jja-body .jm-read .entry-content .jj-styles td:nth-child(4)::before { content: "足まわり"; }
body.jja-body .jm-read .entry-content .jj-styles td:nth-child(5)::before { content: "内装"; }
body.jja-body .jm-read .entry-content .jj-styles td:nth-child(6)::before { content: "ルーフ"; }
body.jja-body .jm-read .entry-content .jj-styles td:nth-child(7)::before { content: "その他"; }
body.jja-body .jm-read .entry-content .jj-styles td:nth-child(8)::before { content: "作例"; }
body.jja-body .jm-read .entry-content .jj-styles td:nth-child(9)::before { content: "判定の目印"; }
body.jja-body .jm-read .entry-content .jj-styles td:nth-child(9) {
margin-top: 10px;
padding: 2px 0 2px 14px;
border-left: 2px solid var(--jc-accent, #a8760a);
font-size: .74rem;
color: var(--jc-ink-secondary);
}
@media (max-width: 781px) {
body.jja-body .jm-read .entry-content .jj-styles tr {
display: block;
padding: 16px 20px;
}
body.jja-body .jm-read .entry-content .jj-styles td {
padding: 0;
border: 0;
}
body.jja-body .jm-read .entry-content .jj-styles td:nth-child(1) {
margin: 0 0 8px;
}
body.jja-body .jm-read .entry-content .jj-styles td:nth-child(n+2) {
display: grid;
padding: 3px 0;
}
body.jja-body .jm-read .entry-content .jj-styles td:nth-child(n+2)::before {
margin: 0;
}
body.jja-body .jm-read .entry-content .jj-styles td:nth-child(5)::before { content: "内装"; }
body.jja-body .jm-read .entry-content .jj-styles td:nth-child(6)::before { content: "ルーフ"; }
}
@media (max-width: 781px) {
body.jja-body .jm-read .entry-content .jj-styles td:nth-child(n+2):empty {
display: none;
}
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) h2 {
padding-bottom: 0;
border-bottom: 0;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full)::before {
position: static;
display: block;
width: max-content;
margin: 0 0 clamp(12px, 1.6vw, 24px) -.04em;
line-height: .85;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):is(:nth-of-type(even),.jj-num-right)::before {
margin-left: auto;
margin-right: -.04em;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) figure:not(.jj-filler),
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).is-style-jj-full > .wp-block-group__inner-container:has(> figure) > figure:not(.jj-filler):not(.wp-block-table),
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).is-style-jj-full:not(:has(> .wp-block-group__inner-container)):has(> figure) > figure:not(.jj-filler):not(.wp-block-table),
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) figure.wp-block-table.jj-styles {
margin-left: 0;
margin-right: 0;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) figcaption {
margin-left: 0;
margin-right: 0;
}
@media (max-width: 781px) {
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) figure:not(.jj-filler),
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).is-style-jj-full > .wp-block-group__inner-container:has(> figure) > figure:not(.jj-filler):not(.wp-block-table),
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).is-style-jj-full:not(:has(> .wp-block-group__inner-container)):has(> figure) > figure:not(.jj-filler):not(.wp-block-table),
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) figure.wp-block-table.jj-styles {
margin-left: 0;
margin-right: 0;
}
body.jja-body .jm-read .entry-content .jj-styles tr {
padding-left: 0;
padding-right: 0;
}
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper > .wp-block-pullquote,
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper > .wp-block-group__inner-container > .wp-block-pullquote {
margin: 0;
padding: clamp(32px, 4vw, 56px) clamp(24px, 6vw, 96px);
background: none;
color: var(--jc-ink-primary);
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper > .wp-block-pullquote blockquote,
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper > .wp-block-group__inner-container > .wp-block-pullquote blockquote {
max-width: 26em;
padding: .2em 0 .2em 28px;
border-left: 2px solid var(--jc-accent, #a8760a);
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper > .wp-block-pullquote p,
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper > .wp-block-group__inner-container > .wp-block-pullquote p {
font: 700 clamp(1.25rem, 2.2vw, 1.8rem)/1.75 var(--jc-serif), serif;
color: var(--jc-ink-primary);
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper .wp-block-pullquote + :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) {
border-top: 1px solid rgba(23, 26, 21, .18);
}
body.jja-body .jm-read .entry-content .jj-styles tbody tr td:first-child::before {
content: "";
display: block;
width: 108px;
height: 78px;
margin: 0 0 10px -6px;
background: center / contain no-repeat;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).jj-cols::before {
column-span: all;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).is-style-jj-lead::before {
font-size: var(--jj-num);
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):is(:nth-of-type(even),.jj-num-right) > .wp-block-group__inner-container > :not(figure):not(.wp-block-pullquote):not(.jj-aside),
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):is(:nth-of-type(even),.jj-num-right):not(:has(> .wp-block-group__inner-container)) > :not(figure):not(.wp-block-pullquote):not(.jj-aside) {
margin-left: 0;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):nth-of-type(odd):not(.jj-num-right) > .wp-block-group__inner-container > :not(figure):not(.wp-block-pullquote):not(.jj-aside),
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):nth-of-type(odd):not(.jj-num-right):not(:has(> .wp-block-group__inner-container)) > :not(figure):not(.wp-block-pullquote):not(.jj-aside) {
margin-left: clamp(4em, 18%, 12em);
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).jj-cols > .wp-block-group__inner-container > :not(figure):not(.wp-block-pullquote):not(.jj-aside),
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).jj-cols:not(:has(> .wp-block-group__inner-container)) > :not(figure):not(.wp-block-pullquote):not(.jj-aside),
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).is-style-jj-full > .wp-block-group__inner-container > :not(figure):not(.wp-block-pullquote):not(.jj-aside),
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).is-style-jj-full:not(:has(> .wp-block-group__inner-container)) > :not(figure):not(.wp-block-pullquote):not(.jj-aside) {
margin-left: 0;
}
@media (max-width: 781px) {
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):nth-of-type(odd):not(.jj-num-right) > .wp-block-group__inner-container > :not(figure):not(.wp-block-pullquote):not(.jj-aside),
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):nth-of-type(odd):not(.jj-num-right):not(:has(> .wp-block-group__inner-container)) > :not(figure):not(.wp-block-pullquote):not(.jj-aside) {
margin-left: 0;
}
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).is-style-jj-lead > .wp-block-group__inner-container > h2 + p:not(figure):not(.wp-block-pullquote):not(.jj-aside),
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).is-style-jj-lead:not(:has(> .wp-block-group__inner-container)) > h2 + p:not(figure):not(.wp-block-pullquote):not(.jj-aside) {
max-width: calc(36em * .9 / 1.08);
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) h2 {
padding-bottom: 12px;
border-bottom: 1px solid var(--jc-ink-primary);
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full),
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper .wp-block-pullquote + :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) {
border-top: 0;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) h2::before {
content: none;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper {
background: rgba(255, 255, 255, .72);
}
body.jja-body .jm-read .entry-content .wp-block-table.jj-styles tbody tr:last-child td {
border-bottom: 0;
}
body.jja-body .jm-read .entry-content .wp-block-table.jj-styles td + td {
border-left: 0;
}
body.jja-body .jm-read .entry-content .wp-block-table.jj-styles td + td:nth-child(9) {
border-left: 2px solid var(--jc-accent, #a8760a);
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).jj-cols > .wp-block-group__inner-container > figure:not(.jj-filler),
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).jj-cols:not(:has(> .wp-block-group__inner-container)) > figure:not(.jj-filler),
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).jj-cols > .wp-block-group__inner-container:has(> figure) > figure:not(.jj-filler),
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).jj-cols:not(:has(> .wp-block-group__inner-container)):has(> figure) > figure:not(.jj-filler) {
column-span: all;
break-inside: avoid;
width: 100%;
max-width: none;
margin: clamp(16px, 2vw, 28px) 0 clamp(24px, 3vw, 40px);
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).jj-cols > .wp-block-group__inner-container:has(> figure) > figure img,
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).jj-cols:not(:has(> .wp-block-group__inner-container)):has(> figure) > figure img {
aspect-ratio: auto;
object-fit: contain;
width: 100%;
height: auto;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).jj-cols > .wp-block-group__inner-container:has(> figure),
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).jj-cols:not(:has(> .wp-block-group__inner-container)):has(> figure) {
display: block;
grid-template-columns: none;
grid-template-areas: none;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) > .wp-block-group__inner-container > figure:not(.jj-filler):not(.wp-block-table),
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not(:has(> .wp-block-group__inner-container)) > figure:not(.jj-filler):not(.wp-block-table),
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).is-style-jj-full > .wp-block-group__inner-container:has(> figure) > figure:not(.jj-filler):not(.wp-block-table),
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).is-style-jj-full:not(:has(> .wp-block-group__inner-container)):has(> figure) > figure:not(.jj-filler):not(.wp-block-table),
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).jj-cols > .wp-block-group__inner-container:has(> figure) > figure:not(.jj-filler),
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).jj-cols:not(:has(> .wp-block-group__inner-container)):has(> figure) > figure:not(.jj-filler) {
width: 100%;
max-width: 640px;
margin-left: 0;
margin-right: auto;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-opener:has(.jm-opener__img) .jm-opener__rail::after {
height: 0;
border-top: 1px solid rgba(244, 241, 233, .5);
border-bottom: 0;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):has(.jm-opener__img) {
background: transparent;
}
html:has(body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-opener__img) {
background: #1a1612;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):has(.jm-opener__img)::before {
content: "";
position: fixed;
inset: 0;
z-index: -1;
background:
linear-gradient(rgba(14, 11, 8, .5), rgba(14, 11, 8, .5)),
var(--jj-hero) center / cover no-repeat;
pointer-events: none;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-opener:has(.jm-opener__img) {
isolation: auto;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-opener:has(.jm-opener__img) .jm-opener__img {
background-image: none !important;
visibility: hidden;
}
body.jja-body.jc-article-page:has(.jm-opener__img) .jm-read .entry-content .is-style-jj-sec.jj-paper {
background: rgba(255, 255, 255, .94);
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):has(.jm-opener__img) .jm-read .entry-content > :is(.is-style-jj-note,.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not(.alignfull) {
background: rgba(255, 255, 255, .94);
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):has(.jm-opener__img) .jm-folio {
color: rgba(244, 241, 233, .74);
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):has(.jm-opener__img) .jm-folio::before {
height: 0;
border-top: 1px solid rgba(244, 241, 233, .5);
border-bottom: 0;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):has(.jm-opener__img) .jm-related,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):has(.jm-opener__img) .jj-foot {
background: var(--jj-cat, var(--jc-bg, #f4f1e9));
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):has(.jm-opener__img) .jm-related {
margin-top: clamp(48px, 7vh, 96px);
padding-top: clamp(48px, 7vh, 96px);
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):has(.jm-opener__img) .jm-read .entry-content .jj-sources {
padding: 24px clamp(20px, 3vw, 36px);
border-top: 0;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):has(.jm-opener__img) .jj-bar.is-solid {
background-color: rgba(255, 255, 255, .55);
-webkit-backdrop-filter: saturate(1.2) blur(14px);
backdrop-filter: saturate(1.2) blur(14px);
border-bottom-color: transparent;
}
body.jja-body.jc-article-page:has(.jm-opener__img) .jm-read .entry-content .is-style-jj-sec.jj-paper,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):has(.jm-opener__img) .jm-read .entry-content > :is(.is-style-jj-note,.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not(.alignfull) {
background: rgba(255, 255, 255, .72);
-webkit-backdrop-filter: blur(16px) saturate(1.1);
backdrop-filter: blur(16px) saturate(1.1);
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):has(.jm-opener__img) .jj-bar.is-solid {
background-color: rgba(255, 255, 255, .38);
-webkit-backdrop-filter: blur(16px) saturate(1.1);
backdrop-filter: blur(16px) saturate(1.1);
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):has(.jm-opener__img) .jj-bar.is-solid {
background-color: transparent;
-webkit-backdrop-filter: none;
backdrop-filter: none;
border-bottom-color: transparent;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):has(.jm-opener__img) .jj-bar.is-solid,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):has(.jm-opener__img) .jj-bar.is-solid a,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):has(.jm-opener__img) .jj-bar.is-solid .jj-bar__logo,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):has(.jm-opener__img) .jj-bar.is-solid .jj-trigger {
color: #f4f1e9;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):has(.jm-opener__img) .jj-bar.is-solid .jj-trigger__mark i {
background: #f4f1e9;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):has(.jm-opener__img) .jj-bar::before,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):has(.jm-opener__img) .jj-bar.is-solid::before {
display: block;
content: "";
position: absolute;
inset: 0 0 -48px 0;
z-index: -1;
opacity: 1;
background: linear-gradient(180deg, rgba(8, 9, 6, .72) 0%, rgba(8, 9, 6, .48) 55%, rgba(8, 9, 6, 0) 100%);
pointer-events: none;
}
body.jja-body.jc-article-page:has(.jm-opener__img) .jm-read .entry-content .is-style-jj-sec.jj-paper,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):has(.jm-opener__img) .jm-read .entry-content > :is(.is-style-jj-note,.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not(.alignfull) {
background: rgba(255, 255, 255, .8);
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):has(.jm-opener__img) .jj-bar::before,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):has(.jm-opener__img) .jj-bar.is-solid::before {
inset: 0;
background: linear-gradient(180deg, rgba(8, 9, 6, .72) 0%, rgba(8, 9, 6, .5) 60%, rgba(8, 9, 6, 0) 100%);
}
body.jja-body.jc-article-page:has(.jm-opener__img) .jm-read .entry-content .is-style-jj-sec.jj-paper,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):has(.jm-opener__img) .jm-read .entry-content > :is(.is-style-jj-note,.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not(.alignfull) {
-webkit-backdrop-filter: blur(16px) contrast(.35) brightness(1.9) saturate(.9);
backdrop-filter: blur(16px) contrast(.35) brightness(1.9) saturate(.9);
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):has(.jm-opener__img) .jm-folio {
display: none;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):has(.jm-opener__img) .jm-related:empty {
display: none;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):has(.jm-opener__img) .jm-opener__rail > span:first-child,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):has(.jm-opener__img) .jm-opener__rail > span:first-child + i {
display: none;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).is-style-jj-full .wp-block-group__inner-container figure.wp-block-table.jj-styles td:first-child img,
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) .wp-block-group__inner-container figure.wp-block-table.jj-styles td:first-child img,
body.jja-body .jm-read .entry-content .jj-styles td:first-child img {
display: block;
width: 108px !important;
height: 78px !important;
max-width: none;
margin: 0 0 10px -6px;
object-fit: contain;
}
body.jja-body .jm-read .entry-content .jj-styles tbody tr td:first-child:has(img)::before {
content: none;
}
body.jja-body .jm-read .entry-content .jj-styles tbody tr td:first-child::before {
content: none;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):has(.jm-opener__img) .jm-read .entry-content > .jj-sources:not(.jj-paper):not(.alignfull) {
background: none;
-webkit-backdrop-filter: none;
backdrop-filter: none;
color: rgba(244, 241, 233, .82);
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):has(.jm-opener__img) .jm-read .entry-content > .jj-sources:not(.jj-paper):not(.alignfull) h3 {
color: #f4f1e9;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):has(.jm-opener__img) .jm-read .entry-content > .jj-sources:not(.jj-paper):not(.alignfull) .wp-block-list,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):has(.jm-opener__img) .jm-read .entry-content > .jj-sources:not(.jj-paper):not(.alignfull) li,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):has(.jm-opener__img) .jm-read .entry-content > .jj-sources:not(.jj-paper):not(.alignfull) p,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):has(.jm-opener__img) .jm-read .entry-content > .jj-sources:not(.jj-paper):not(.alignfull) a {
color: rgba(244, 241, 233, .82);
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):has(.jm-opener__img) .jm-read .entry-content > .jj-sources:not(.jj-paper):not(.alignfull) li::marker {
color: rgba(244, 241, 233, .5);
}
body.jja-body.jc-article-page:has(.jm-opener__img) .jm-read .entry-content .is-style-jj-sec.jj-paper,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):has(.jm-opener__img) .jm-read .entry-content > :is(.is-style-jj-note,.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not(.alignfull) {
background: rgba(255, 255, 255, .88);
-webkit-backdrop-filter: none;
backdrop-filter: none;
}
body.jja-body.jc-article-page:has(.jm-opener__img) .jm-read .entry-content .is-style-jj-sec.jj-paper,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):has(.jm-opener__img) .jm-read .entry-content > :is(.is-style-jj-note,.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not(.alignfull) {
background: rgba(255, 255, 255, .92);
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).is-style-jj-full > .wp-block-group__inner-container > div:not(.wp-block-pullquote):not(.jj-aside),
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).is-style-jj-full > .wp-block-group__inner-container > table:not(.wp-block-pullquote):not(.jj-aside),
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).is-style-jj-full:not(:has(> .wp-block-group__inner-container)) > div:not(.wp-block-pullquote):not(.jj-aside),
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).is-style-jj-full:not(:has(> .wp-block-group__inner-container)) > table:not(.wp-block-pullquote):not(.jj-aside) {
max-width: none;
margin-left: calc(-1 * clamp(24px, 6vw, 96px));
margin-right: calc(-1 * clamp(24px, 6vw, 96px));
}
@media (max-width: 781px) {
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).is-style-jj-full > .wp-block-group__inner-container > div:not(.wp-block-pullquote):not(.jj-aside),
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).is-style-jj-full:not(:has(> .wp-block-group__inner-container)) > div:not(.wp-block-pullquote):not(.jj-aside) {
margin-left: -20px;
margin-right: -20px;
}
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) > .wp-block-group__inner-container > h3,
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not(:has(> .wp-block-group__inner-container)) > h3 {
margin: clamp(30px, 3.4vw, 46px) 0 clamp(12px, 1.4vw, 18px);
font: 800 clamp(1.05rem, 1.5vw, 1.3rem)/1.6 var(--jc-serif), serif;
letter-spacing: .02em;
color: var(--jc-ink-primary);
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) > .wp-block-group__inner-container > h3 span,
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not(:has(> .wp-block-group__inner-container)) > h3 span {
display: block;
margin: 6px 0 0;
font: 400 .74rem/1.7 var(--jc-font), sans-serif;
letter-spacing: .06em;
color: var(--jc-ink-secondary);
}
body.jja-body .jm-read .entry-content .jj-embed {
position: relative;
}
body.jja-body .jm-read .entry-content .jj-embed:not(:has(iframe)):not(:has(video)):not(:has(embed)):not(:has(object)) {
display: none;
}
body.jja-body .jm-read .entry-content .jj-embed :is(iframe, video, embed, object) {
display: block;
width: 100%;
height: auto;
max-width: 100%;
aspect-ratio: 4 / 3;
border: 0;
background: rgba(23, 26, 21, .06);
}
body.jja-body .jm-read .entry-content :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) .jj-embed :is(iframe, video, embed, object) {
aspect-ratio: 4 / 5;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) .jj-embed:not(.jj-filler) :is(iframe, video, embed, object) {
aspect-ratio: 16 / 10;
}
@media (max-width: 781px) {
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) .jj-embed:not(.jj-filler) :is(iframe, video, embed, object) {
aspect-ratio: 4 / 3;
}
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) > .wp-block-group__inner-container > figure.jj-embed:not(.jj-filler):not(.wp-block-table),
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not(:has(> .wp-block-group__inner-container)) > figure.jj-embed:not(.jj-filler):not(.wp-block-table) {
max-width: 392px;
margin-left: 0;
margin-right: auto;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).jj-cols > .wp-block-group__inner-container > figure.jj-embed:not(.jj-filler),
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).jj-cols:not(:has(> .wp-block-group__inner-container)) > figure.jj-embed:not(.jj-filler) {
column-span: none;
width: 100%;
max-width: 392px;
margin: clamp(16px, 2vw, 28px) 0 clamp(24px, 3vw, 40px);
}
@media (max-width: 781px) {
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) > .wp-block-group__inner-container > figure.jj-embed:not(.jj-filler):not(.wp-block-table),
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not(:has(> .wp-block-group__inner-container)) > figure.jj-embed:not(.jj-filler):not(.wp-block-table) {
max-width: none;
}
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-read .entry-content > .jj-sources {
grid-column: 1 / -1;
width: 100%;
max-width: 1160px;
margin-inline: auto;
}
@media (max-width: 899px) {
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-read .entry-content > .jj-sources {
grid-column: 2;
max-width: none;
}
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):has(.jm-opener__img) .jm-fmt--interview .jm-read .entry-content {
background: rgba(255, 255, 255, .92);
}
body.jja-body .jm-fmt--interview .jm-read .entry-content > figure,
body.jja-body .jm-fmt--interview .jm-read .entry-content .alignleft,
body.jja-body .jm-fmt--interview .jm-read .entry-content .alignright {
background: none;
padding: 0;
border: 0;
border-radius: 0;
box-shadow: none;
transform: none;
}
body.jja-body .jm-fmt--interview .jm-read .entry-content > figure::before,
body.jja-body .jm-fmt--interview .jm-read .entry-content > figure::after,
body.jja-body .jm-fmt--interview .jm-read .entry-content .alignleft::before,
body.jja-body .jm-fmt--interview .jm-read .entry-content .alignleft::after,
body.jja-body .jm-fmt--interview .jm-read .entry-content .alignright::before,
body.jja-body .jm-fmt--interview .jm-read .entry-content .alignright::after {
content: none;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content h2 {
font-size: clamp(1.5rem, 1.9vw, 1.8rem);
line-height: 1.5;
letter-spacing: .08em;
font-weight: 800;
margin: 0 0 0 clamp(28px, 3vw, 44px);
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content h2 > span:not(.jj-upright) {
display: block;
margin: 10px 0 0;
font-size: .62em;
font-weight: 500;
letter-spacing: .1em;
line-height: 1.8;
color: var(--jc-ink-secondary);
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content > p,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content p {
margin: 0 0 0 3em;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content p.jj-q + p.jj-q {
margin-left: 1.8em;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):has(.jm-opener__img) .jm-fmt--interview .jm-read .entry-content {
background: #fff;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content {
padding: clamp(28px, 4.5vh, 56px) 20px;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content > p:not(.jj-q):not(.is-style-jj-info) {
font-size: .92em;
color: var(--jc-ink-secondary);
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content > p.jj-q {
font-size: 1em;
color: var(--jc-ink-primary);
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content > p.jj-q > b {
display: block;
margin: 0 0 .5em;
font: 700 .78em/1 var(--jc-font), sans-serif;
letter-spacing: .24em;
color: var(--jc-accent);
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jj-vnav button {
width: 34px;
font-size: 0;
cursor: pointer;
transition: opacity .2s;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jj-vnav button::after {
position: absolute;
top: 50%;
transform: translateY(-50%);
writing-mode: horizontal-tb;
font: 400 1.5rem/1 var(--jc-serif), serif;
color: var(--jc-ink-secondary);
opacity: .45;
text-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 16px #fff;
transition: opacity .2s;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jj-vnav button:hover::after,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jj-vnav button:focus-visible::after {
opacity: 1;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jj-vnav button.jj-vnav__next {
background: linear-gradient(90deg, #fff 0, rgba(255, 255, 255, .9) 45%, rgba(255, 255, 255, 0) 100%);
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jj-vnav button.jj-vnav__next::after {
content: "\2039";
left: 5px;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jj-vnav button.jj-vnav__prev {
background: linear-gradient(270deg, #fff 0, rgba(255, 255, 255, .9) 45%, rgba(255, 255, 255, 0) 100%);
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jj-vnav button.jj-vnav__prev::after {
content: "\203A";
right: 5px;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jj-vnav button span {
display: none;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content {
font-feature-settings: "vpal" 1, "vkrn" 1;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content h2 {
letter-spacing: .01em;
font-feature-settings: "vpal" 1, "vkrn" 1;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content h2 > span:not(.jj-upright) {
margin: 20px 0 0;
font: 500 .46em/2 var(--jc-font), sans-serif;
letter-spacing: .08em;
color: var(--jc-ink-secondary);
font-feature-settings: "vpal" 1;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content h2 {
margin-left: clamp(34px, 3.4vw, 52px);
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content h2 {
border-top: 2px solid var(--jc-accent);
padding-top: 22px;
text-wrap: balance;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-fmt--interview .jm-read .entry-content h2::before {
content: none;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):has(.jm-opener__img) .jj-foot {
background: none;
border-top: 1px solid rgba(244, 241, 233, .22);
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):has(.jm-opener__img) .jj-foot,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):has(.jm-opener__img) .jj-foot a {
color: #f4f1e9;
}
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):has(.jm-opener__img) .jj-foot__note,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):has(.jm-opener__img) .jj-foot__cr {
color: rgba(244, 241, 233, .74);
}
.jj-event .jj-event-sheet {
max-width: 820px;
margin-left: auto;
margin-right: auto;
padding: clamp(26px, 3vw, 36px) clamp(24px, 3.2vw, 40px) clamp(22px, 2.6vw, 30px);
}
.jj-event .jj-event-sheet__date strong { font-size: clamp(2rem, 3.4vw, 2.6rem); }
.jj-event .jj-event-sheet__date span   { font-size: clamp(.95rem, 1.3vw, 1.15rem); }
.jj-event .jj-event-sheet__date        { width: auto; min-width: 130px; }
.jj-event .jj-event-sheet__title h1    { font-size: clamp(1.4rem, 2.4vw, 1.95rem); text-wrap: balance; }
.jj-event .jj-event-sheet__when        { font-size: .82rem; }
.jj-event .jj-event-place__en {
font-size: .72rem;
letter-spacing: .24em;
opacity: .7;
}
.jj-event .jj-event-place__v { font-size: 1.12rem; }
.jj-event .jj-event-sheet__facts { display: none; }
.jj-event .jj-event-sheet__header { padding-bottom: clamp(16px, 1.8vw, 22px); }
.jj-event .jj-event-place         { padding-bottom: clamp(16px, 1.8vw, 22px); }
.jj-event .jj-event-official {
border-top: 0;
margin-top: 0;
padding-top: clamp(18px, 2vw, 26px);
}
body.jja-body {
--jj-num: clamp(4.5rem, 9vw, 7.5rem);
--jj-drop: 800 2.8em/1 var(--jc-serif), serif;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) h2 {
font: 800 clamp(1.3rem, 2vw, 1.75rem)/1.4 var(--jc-serif), serif;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).is-style-jj-lead h2 {
font: 800 clamp(1.6rem, 2.7vw, 2.25rem)/1.35 var(--jc-serif), serif;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).is-style-jj-lead h2 + p {
font-size: 1rem;
}
body.jja-body {
--jj-num: clamp(3.4rem, 6.5vw, 5.25rem);
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) {
padding-top: clamp(26px, 3vw, 40px);
padding-bottom: clamp(26px, 3vw, 40px);
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) h2 {
margin-bottom: clamp(16px, 1.8vw, 24px);
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full)::before {
margin-bottom: clamp(6px, .8vw, 12px);
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).is-style-jj-lead h2 {
margin-bottom: clamp(18px, 2vw, 26px);
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) p {
line-height: 1.8;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) > .wp-block-group__inner-container > :not(figure):not(.wp-block-pullquote):not(.jj-aside),
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not(:has(> .wp-block-group__inner-container)) > :not(figure):not(.wp-block-pullquote):not(.jj-aside) {
max-width: 46em;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper .wp-block-list {
max-width: 46em;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).is-style-jj-lead h2 + p {
max-width: 38em;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) {
padding-top: clamp(20px, 2.2vw, 28px);
padding-bottom: clamp(20px, 2.2vw, 28px);
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full)::before {
position: absolute;
top: -.06em;
right: auto;
left: .04em;
z-index: 0;
margin: 0;
width: auto;
font-size: clamp(6rem, 13vw, 11rem);
line-height: .8;
pointer-events: none;
user-select: none;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):is(:nth-of-type(even),.jj-num-right)::before {
right: .04em;
left: auto;
margin: 0;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).jj-cols::before {
column-span: none;
}
body.jja-body {
--jj-num: clamp(7rem, 15vw, 12rem);
--jj-num-ink: rgba(23, 26, 21, .13);
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not(.is-style-jj-lead):not(.is-style-jj-full):not(.jj-cols):not(.jj-1col):not(:has(figure)):not(:has(table)):not(:has(.wp-block-html)):not(:has(.wp-block-columns)) {
display: block;
column-count: 2;
column-gap: clamp(28px, 4vw, 56px);
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not(.is-style-jj-lead):not(.is-style-jj-full):not(.jj-cols):not(.jj-1col):not(:has(figure)):not(:has(table)):not(:has(.wp-block-html)):not(:has(.wp-block-columns)) > .wp-block-group__inner-container > :not(figure):not(.wp-block-pullquote):not(.jj-aside),
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not(.is-style-jj-lead):not(.is-style-jj-full):not(.jj-cols):not(.jj-1col):not(:has(figure)):not(:has(table)):not(:has(.wp-block-html)):not(:has(.wp-block-columns)):not(:has(> .wp-block-group__inner-container)) > :not(figure):not(.wp-block-pullquote):not(.jj-aside) {
max-width: none;
margin-left: 0;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not(.is-style-jj-lead):not(.is-style-jj-full):not(.jj-cols):not(.jj-1col):not(:has(figure)):not(:has(table)):not(:has(.wp-block-html)):not(:has(.wp-block-columns)) h2,
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not(.is-style-jj-lead):not(.is-style-jj-full):not(.jj-cols):not(.jj-1col):not(:has(figure)):not(:has(table)):not(:has(.wp-block-html)):not(:has(.wp-block-columns)) .wp-block-buttons {
column-span: all;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not(.is-style-jj-lead):not(.is-style-jj-full):not(.jj-cols):not(.jj-1col):not(:has(figure)):not(:has(table)):not(:has(.wp-block-html)):not(:has(.wp-block-columns)) h2 {
max-width: 34em;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not(.is-style-jj-lead):not(.is-style-jj-full):not(.jj-cols):not(.jj-1col):not(:has(figure)):not(:has(table)):not(:has(.wp-block-html)):not(:has(.wp-block-columns)) p {
break-inside: avoid;
}
@media (max-width: 781px) {
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not(.is-style-jj-lead):not(.is-style-jj-full):not(.jj-cols):not(.jj-1col):not(:has(figure)):not(:has(table)):not(:has(.wp-block-html)):not(:has(.wp-block-columns)) {
column-count: 1;
}
}
body.jja-body .jjg .entry-content .jj-media {
--ink: #111111;
--sub: #55554f;
--faint: #7c7c76;
--paper: #f4f1e9;
--gold: var(--jc-accent, #b89b5a);
--line: #d9d9d9;
--white: #f4f1e9;
background: var(--paper);
color: var(--ink);
font-family: var(--jc-serif);
line-height: 2;
}
body.jja-body .jjg .entry-content .jj-media *,
body.jja-body .jjg .entry-content .jj-media *::before,
body.jja-body .jjg .entry-content .jj-media *::after {
box-sizing: border-box;
}
body.jja-body .jjg .entry-content .jj-media h1,
body.jja-body .jjg .entry-content .jj-media h2,
body.jja-body .jjg .entry-content .jj-media h3,
body.jja-body .jjg .entry-content .jj-media p {
margin-top: 0;
}
body.jja-body .jjg .entry-content .jj-media h1,
body.jja-body .jjg .entry-content .jj-media h2,
body.jja-body .jjg .entry-content .jj-media h3 {
border: 0;
padding: 0;
background: none;
}
body.jja-body .jjg .entry-content .jj-media a {
color: inherit;
}
body.jja-body .jjg .entry-content .jj-media__inner {
width: min(1200px, calc(100% - 160px));
margin: 0 auto;
}
body.jja-body .jjg .entry-content .jj-media__eyebrow {
display: flex;
align-items: center;
gap: 18px;
margin-bottom: 38px;
font-family: var(--jc-logo);
font-size: 11px;
font-weight: 600;
letter-spacing: .22em;
}
body.jja-body .jjg .entry-content .jj-media__eyebrow::after {
content: "";
width: 52px;
height: 1px;
background: var(--gold);
}
body.jja-body .jjg .entry-content .jj-media__num {
display: block;
margin-bottom: 24px;
color: var(--gold);
font-family: var(--jc-logo);
font-size: clamp(56px, 7vw, 94px);
font-weight: 400;
line-height: .8;
}
body.jja-body .jjg .entry-content .jj-media__lead {
font-family: var(--jc-serif);
font-size: clamp(28px, 4vw, 52px);
font-weight: 400;
line-height: 1.5;
letter-spacing: .03em;
}
body.jja-body .jjg .entry-content .jj-media__body {
max-width: 620px;
font-size: 14px;
line-height: 2.15;
}
body.jja-body .jjg .entry-content .jj-media-hero {
position: relative;
min-height: min(828px, calc(100vh - 80px));
display: flex;
align-items: center;
overflow: hidden;
background: var(--paper);
color: var(--ink);
}
body.jja-body .jjg .entry-content .jj-media-hero::before {
content: "";
position: absolute;
inset: 0;
background: var(--jjm-hero) left 40% center / cover no-repeat;
filter: saturate(1.2) sepia(.2) brightness(1.08) contrast(1.02);
-webkit-mask-image:
linear-gradient(to right, #000 0%, #000 30%, rgba(0,0,0,.72) 44%, rgba(0,0,0,.22) 56%, rgba(0,0,0,0) 68%),
linear-gradient(to top, rgba(0,0,0,0) 0%, rgba(0,0,0,.45) 8%, #000 22%);
-webkit-mask-composite: source-in;
mask-image:
linear-gradient(to right, #000 0%, #000 30%, rgba(0,0,0,.72) 44%, rgba(0,0,0,.22) 56%, rgba(0,0,0,0) 68%),
linear-gradient(to top, rgba(0,0,0,0) 0%, rgba(0,0,0,.45) 8%, #000 22%);
mask-composite: intersect;
}
body.jja-body .jjg .entry-content .jj-media-hero__content {
position: relative;
box-sizing: border-box;
width: min(1200px, calc(100% - 160px));
margin: 0 auto;
padding: 0 0 0 640px;
}
body.jja-body .jjg .entry-content .jj-media-hero__label {
display: flex;
align-items: center;
gap: 16px;
margin-bottom: 34px;
font-family: var(--jc-logo);
font-size: 12px;
letter-spacing: .26em;
color: var(--sub);
}
body.jja-body .jjg .entry-content .jj-media-hero__label::after {
content: "";
flex: 0 0 46px;
height: 1px;
background: var(--gold);
}
body.jja-body .jjg .entry-content .jj-media-hero h1 {
margin: 0;
font-family: var(--jc-serif);
font-size: clamp(34px, 4.2vw, 60px);
font-weight: 600;
line-height: 1.45;
letter-spacing: .01em;
color: var(--ink);
}
body.jja-body .jjg .entry-content .jj-media-hero h1::after {
content: "";
display: block;
width: 64px;
height: 1px;
margin-top: 34px;
background: var(--ink);
}
body.jja-body .jjg .entry-content .jj-media-hero__intro {
max-width: 560px;
margin: 30px 0 0;
font-family: var(--jc-serif);
font-size: 15px;
line-height: 2.1;
letter-spacing: .03em;
color: var(--sub);
}
body.jja-body .jjg .entry-content .jj-media-edit {
padding: 72px 0 90px;
}
body.jja-body .jjg .entry-content .jj-media-edit__top,
body.jja-body .jjg .entry-content .jj-media-connect__head,
body.jja-body .jjg .entry-content .jj-media-collab__head,
body.jja-body .jjg .entry-content .jj-media-policy__layout,
body.jja-body .jjg .entry-content .jj-media-contact__layout {
position: relative;
display: grid;
grid-template-columns: 625px 1fr;
gap: 0 40px;
align-items: start;
margin-bottom: 72px;
}
body.jja-body .jjg .entry-content .jj-media-edit__top > div:first-child,
body.jja-body .jjg .entry-content .jj-media-connect__head > div:first-child,
body.jja-body .jjg .entry-content .jj-media-collab__head > div:first-child,
body.jja-body .jjg .entry-content .jj-media-policy__layout > div:first-child,
body.jja-body .jjg .entry-content .jj-media-contact__layout > div:first-child,
body.jja-body .jjg .entry-content .jj-media-works__head {
position: relative;
padding-left: 200px;
}
body.jja-body .jjg .entry-content .jj-media__num {
position: absolute;
left: -10px;
top: -16px;
margin: 0;
font-family: var(--jc-serif);
font-size: 170px;
font-weight: 500;
line-height: 1;
letter-spacing: .02em;
color: transparent;
-webkit-text-stroke: 1px #dcdcdc;
}
body.jja-body .jjg .entry-content .jj-media__eyebrow {
display: flex;
align-items: center;
gap: 14px;
margin-bottom: 0;
padding-top: 40px;
font-family: var(--jc-logo);
font-size: 12px;
font-weight: 400;
letter-spacing: .26em;
color: var(--faint);
}
body.jja-body .jjg .entry-content .jj-media__eyebrow::after {
content: "";
flex: 0 0 46px;
height: 1px;
background: var(--gold);
}
body.jja-body .jjg .entry-content .jj-media__lead,
body.jja-body .jjg .entry-content .jj-media-policy__text h2,
body.jja-body .jjg .entry-content .jj-media-contact__layout h2 {
margin: 18px 0 0;
font-family: var(--jc-serif);
font-size: clamp(26px, 3vw, 40px);
font-weight: 600;
line-height: 1.52;
letter-spacing: .01em;
}
body.jja-body .jjg .entry-content .jj-media-edit__intro,
body.jja-body .jjg .entry-content .jj-media__body,
body.jja-body .jjg .entry-content .jj-media-policy__text,
body.jja-body .jjg .entry-content .jj-media-contact__layout > dl {
max-width: none;
padding: 44px 0 0 40px;
border-left: 1px solid var(--line);
}
body.jja-body .jjg .entry-content .jj-media-edit__intro,
body.jja-body .jjg .entry-content .jj-media__body,
body.jja-body .jjg .entry-content .jj-media-policy__text,
body.jja-body .jjg .entry-content .jj-media-contact__layout > dl p {
max-width: none;
margin: 0 0 1.4em;
font-family: var(--jc-serif);
font-size: 15px;
line-height: 2.05;
letter-spacing: .03em;
}
body.jja-body .jjg .entry-content .jj-media__body p:last-child,
body.jja-body .jjg .entry-content .jj-media-edit__intro p:last-child {
margin-bottom: 0;
}
body.jja-body .jjg .entry-content .jj-media-categories {
display: grid;
grid-template-columns: repeat(6, minmax(0, 1fr));
border-top: 1px solid var(--line);
}
body.jja-body .jjg .entry-content .jj-media-category {
box-sizing: border-box;
min-height: 0;
padding: 22px 24px 0;
border-right: 1px solid var(--line);
border-bottom: 0;
}
body.jja-body .jjg .entry-content .jj-media-category:first-child {
padding-left: 0;
}
body.jja-body .jjg .entry-content .jj-media-category:last-child {
padding-right: 0;
border-right: 0;
}
body.jja-body .jjg .entry-content .jj-media-category br {
display: none;
}
body.jja-body .jjg .entry-content .jj-media-category__en {
display: block;
margin-bottom: 8px;
font-family: var(--jc-logo);
font-size: 11px;
font-weight: 400;
letter-spacing: .22em;
color: var(--gold);
}
body.jja-body .jjg .entry-content .jj-media-category__jp {
display: block;
margin-bottom: 0;
font-family: var(--jc-serif);
font-size: 20px;
font-weight: 500;
letter-spacing: .06em;
color: var(--ink);
}
body.jja-body .jjg .entry-content .jj-media-category p {
margin: 10px 0 0;
font-family: var(--jc-serif);
font-size: 12.5px;
line-height: 1.9;
color: var(--sub);
}
body.jja-body .jjg .entry-content .jj-media-reader {
position: relative;
background: var(--paper);
color: var(--ink);
}
body.jja-body .jjg .entry-content .jj-media-reader__content {
width: min(1200px, calc(100% - 160px));
margin: 0 auto;
padding: 72px 0 90px;
}
body.jja-body .jjg .entry-content .jj-media-reader h2 {
max-width: 425px;
margin-bottom: 26px;
font-family: var(--jc-serif);
font-size: clamp(26px, 3vw, 40px);
font-weight: 600;
line-height: 1.52;
letter-spacing: .01em;
}
body.jja-body .jjg .entry-content .jj-media-reader p {
max-width: 494px;
margin: 0;
font-family: var(--jc-serif);
font-size: 15px;
line-height: 2.05;
letter-spacing: .03em;
color: var(--sub);
}
body.jja-body .jjg .entry-content p.jj-media-reader__note {
max-width: 494px;
margin: 28px 0 0;
padding-top: 18px;
border-top: 1px solid var(--line);
font-family: var(--jc-serif);
font-size: 12.5px;
line-height: 1.9;
letter-spacing: .03em;
color: var(--faint);
}
body.jja-body .jjg .entry-content .jj-media-connect {
padding: 72px 0 90px;
background: var(--paper);
}
body.jja-body .jjg .entry-content .jj-media-connect__head {
display: grid;
grid-template-columns: 625px 1fr;
gap: 0 40px;
margin-bottom: 72px;
}
body.jja-body .jjg .entry-content .jj-media-connect__diagram {
border-top: 1px solid var(--ink);
}
body.jja-body .jjg .entry-content .jj-media-connect__center {
padding: 0 0 14px;
background: none;
border-bottom: 1px solid var(--gold);
color: var(--gold);
text-align: left;
font-family: var(--jc-logo);
font-size: 12px;
letter-spacing: .28em;
}
body.jja-body .jjg .entry-content .jj-media-connect__items {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
margin-top: 18px;
}
body.jja-body .jjg .entry-content .jj-media-connect__item {
box-sizing: border-box;
padding: 22px 24px 24px 0;
border-right: 1px solid var(--line);
text-align: left;
color: var(--ink);
}
body.jja-body .jjg .entry-content .jj-media-connect__item:first-child {
padding-left: 0;
}
body.jja-body .jjg .entry-content .jj-media-connect__item:last-child {
padding-right: 0;
border-right: 0;
}
body.jja-body .jjg .entry-content .jj-media-connect__item br {
display: none;
}
body.jja-body .jjg .entry-content .jj-media-connect__item p {
margin: 10px 0 0;
font-family: var(--jc-serif);
font-size: 12.5px;
line-height: 1.9;
color: var(--sub);
}
body.jja-body .jjg .entry-content .jj-media-collab {
padding: 72px 0 90px;
background: var(--paper);
}
body.jja-body .jjg .entry-content .jj-media-collab__head {
display: grid;
grid-template-columns: 625px 1fr;
gap: 0 40px;
margin-bottom: 72px;
}
body.jja-body .jjg .entry-content .jj-media-collab__grid {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
border-top: 1px solid var(--ink);
}
body.jja-body .jjg .entry-content .jj-media-collab__item {
padding: 22px 34px 24px 0;
border-bottom: 1px solid var(--line);
}
body.jja-body .jjg .entry-content .jj-media-collab__item:not(:nth-child(3n+1)) {
padding-left: 34px;
border-left: 1px solid var(--line);
}
body.jja-body .jjg .entry-content .jj-media-collab__item strong {
display: block;
margin-bottom: 15px;
font-family: var(--jc-logo);
font-size: 12px;
letter-spacing: .13em;
}
body.jja-body .jjg .entry-content .jj-media-collab__item p {
margin: 0;
font-size: 13px;
color: #55534c;
}
body.jja-body .jjg .entry-content .jj-media-works {
padding: 72px 0 90px;
background: var(--paper);
}
body.jja-body .jjg .entry-content .jj-media-works__head {
margin-bottom: 72px;
}
body.jja-body .jjg .entry-content .jj-media-works__grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 18px;
}
body.jja-body .jjg .entry-content .jj-media-work {
display: block;
text-decoration: none;
}
body.jja-body .jjg .entry-content .jj-media-work__image {
aspect-ratio: 4 / 3;
margin-bottom: 22px;
overflow: hidden;
background: #d8d4ca;
}
body.jja-body .jjg .entry-content .jj-media-work__image img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform .45s ease;
}
body.jja-body .jjg .entry-content .jj-media-work:hover .jj-media-work__image img {
transform: scale(1.025);
}
body.jja-body .jjg .entry-content .jj-media-work__cat {
display: block;
margin-bottom: 10px;
color: var(--gold);
font-family: var(--jc-logo);
font-size: 10px;
font-weight: 600;
letter-spacing: .17em;
}
body.jja-body .jjg .entry-content .jj-media-work h3 {
margin: 0;
font-family: var(--jc-serif);
font-size: 17px;
font-weight: 400;
line-height: 1.8;
}
body.jja-body .jjg .entry-content .jj-media-policy {
padding: 72px 0 90px;
background: var(--paper);
}
body.jja-body .jjg .entry-content .jj-media-policy__layout {
display: grid;
grid-template-columns: 625px 1fr;
gap: 0 40px;
}
body.jja-body .jjg .entry-content .jj-media-policy__layout,
body.jja-body .jjg .entry-content .jj-media-contact__layout {
margin-bottom: 0;
}
body.jja-body .jjg .entry-content .jj-media-policy__text {
padding-top: 40px;
border-top: 1px solid var(--ink);
}
body.jja-body .jjg .entry-content .jj-media-policy__text h2 {
margin: 0 0 30px;
font-family: var(--jc-serif);
font-size: clamp(26px, 3vw, 40px);
font-weight: 600;
line-height: 1.52;
letter-spacing: .01em;
}
body.jja-body .jjg .entry-content .jj-media-policy__text p {
margin: 0 0 1.4em;
font-size: 15px;
line-height: 2.05;
letter-spacing: .03em;
}
body.jja-body .jjg .entry-content .jj-media-contact {
padding: 72px 0 90px;
background: var(--paper);
color: var(--ink);
}
body.jja-body .jjg .entry-content .jj-media-contact .jj-media__num {
color: transparent;
-webkit-text-stroke: 1px #dcdcdc;
}
body.jja-body .jjg .entry-content .jj-media-contact {
border-top: 1px solid var(--gold);
}
body.jja-body .jjg .entry-content .jj-media-contact__layout {
display: grid;
grid-template-columns: 625px 1fr;
gap: 0 40px;
}
body.jja-body .jjg .entry-content .jj-media-contact h2 {
margin: 18px 0 28px;
font-family: var(--jc-serif);
font-size: clamp(26px, 3vw, 40px);
font-weight: 600;
line-height: 1.52;
letter-spacing: .01em;
}
body.jja-body .jjg .entry-content .jj-media-contact__intro {
color: var(--sub);
font-family: var(--jc-serif);
font-size: 15px;
line-height: 2.05;
letter-spacing: .03em;
}
body.jja-body .jjg .entry-content .jj-media-contact__info {
padding-top: 30px;
border-top: 1px solid var(--ink);
}
body.jja-body .jjg .entry-content .jj-media-contact__row {
display: grid;
grid-template-columns: 110px 1fr;
gap: 20px;
padding: 14px 0;
border-bottom: 1px solid var(--line);
font-size: 12px;
}
body.jja-body .jjg .entry-content .jj-media-contact__row dt {
color: var(--gold);
font-size: 10px;
letter-spacing: .12em;
}
body.jja-body .jjg .entry-content .jj-media-contact__row dd {
margin: 0;
}
body.jja-body .jjg .entry-content .jj-media-contact__note {
max-width: 800px;
margin: 80px 0 0;
padding-top: 25px;
border-top: 1px solid var(--line);
color: var(--faint);
font-size: 10px;
line-height: 1.8;
}
@media (max-width: 760px) {
body.jja-body .jjg .entry-content .jj-media__inner,
body.jja-body .jjg .entry-content .jj-media-hero__content,
body.jja-body .jjg .entry-content .jj-media-reader__content {
width: calc(100% - 36px);
}
body.jja-body .jjg .entry-content .jj-media-hero {
min-height: 72vh;
}
body.jja-body .jjg .entry-content .jj-media-hero__content {
padding: 100px 0 60px;
}
body.jja-body .jjg .entry-content .jj-media-edit,
body.jja-body .jjg .entry-content .jj-media-connect,
body.jja-body .jjg .entry-content .jj-media-collab,
body.jja-body .jjg .entry-content .jj-media-works,
body.jja-body .jjg .entry-content .jj-media-policy,
body.jja-body .jjg .entry-content .jj-media-contact {
padding: 85px 0;
}
body.jja-body .jjg .entry-content .jj-media-edit__top,
body.jja-body .jjg .entry-content .jj-media-connect__head,
body.jja-body .jjg .entry-content .jj-media-collab__head,
body.jja-body .jjg .entry-content .jj-media-policy__layout,
body.jja-body .jjg .entry-content .jj-media-contact__layout {
grid-template-columns: 1fr;
gap: 45px;
}
body.jja-body .jjg .entry-content .jj-media-categories {
grid-template-columns: 1fr 1fr;
}
body.jja-body .jjg .entry-content .jj-media-category:nth-child(3n+2),
body.jja-body .jjg .entry-content .jj-media-category:nth-child(3n+3) {
padding-left: 0;
border-left: 0;
}
body.jja-body .jjg .entry-content .jj-media-category:nth-child(even) {
padding-left: 20px;
border-left: 1px solid var(--line);
}
body.jja-body .jjg .entry-content .jj-media-reader {
min-height: 540px;
}
body.jja-body .jjg .entry-content .jj-media-connect__items {
grid-template-columns: repeat(2, 1fr);
}
body.jja-body .jjg .entry-content .jj-media-connect__item:nth-child(4n+1) {
border-left: 0;
}
body.jja-body .jjg .entry-content .jj-media-connect__item:nth-child(odd) {
border-left: 1px solid var(--line);
}
body.jja-body .jjg .entry-content .jj-media-collab__grid {
grid-template-columns: 1fr 1fr;
}
body.jja-body .jjg .entry-content .jj-media-collab__item:not(:nth-child(3n+1)) {
padding-left: 0;
border-left: 0;
}
body.jja-body .jjg .entry-content .jj-media-collab__item:nth-child(even) {
padding-left: 20px;
border-left: 1px solid var(--line);
}
body.jja-body .jjg .entry-content .jj-media-collab__item {
min-height: 0;
padding: 22px 16px 22px 0;
}
body.jja-body .jjg .entry-content .jj-media-works__grid {
grid-template-columns: 1fr;
gap: 50px;
}
body.jja-body .jjg .entry-content .jj-media-contact__row {
grid-template-columns: 85px 1fr;
}
}
body.jja-body .jjg .entry-content .jj-media {
position: relative !important;
width: 100vw !important;
max-width: none !important;
margin-left: calc(50% - 50vw) !important;
margin-right: calc(50% - 50vw) !important;
padding: 0 !important;
background: var(--paper) !important;
color: var(--ink) !important;
overflow: hidden !important;
}
body.jja-body .jjg .entry-content .jj-media .jj-media-hero {
background-color: var(--paper) !important;
}
body.jja-body .jjg .entry-content .jj-media .jj-media-edit {
background: var(--paper) !important;
}
body.jja-body .jjg .entry-content .jj-media .jj-media-connect {
background: var(--paper) !important;
}
body.jja-body .jjg .entry-content .jj-media .jj-media-collab {
background: var(--paper) !important;
}
body.jja-body .jjg .entry-content .jj-media .jj-media-works {
background: var(--paper) !important;
}
body.jja-body .jjg .entry-content .jj-media .jj-media-policy {
background: var(--paper) !important;
}
body.jja-body .jjg .entry-content .jj-media .jj-media-contact {
background: var(--paper) !important;
}
body.jja-body .jjg .entry-content .jj-media p,
body.jja-body .jjg .entry-content .jj-media h1,
body.jja-body .jjg .entry-content .jj-media h2,
body.jja-body .jjg .entry-content .jj-media h3,
body.jja-body .jjg .entry-content .jj-media span,
body.jja-body .jjg .entry-content .jj-media div,
body.jja-body .jjg .entry-content .jj-media dt,
body.jja-body .jjg .entry-content .jj-media dd {
text-shadow: none !important;
}
body.jja-body .jjg .entry-content .jj-media .jj-media-edit__top {
display: grid !important;
grid-template-columns: 625px 1fr !important;
}
body.jja-body .jjg .entry-content .jj-media .jj-media-categories {
display: grid !important;
grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
}
body.jja-body .jjg .entry-content .jj-media .jj-media-connect__head {
display: grid !important;
grid-template-columns: 625px 1fr !important;
}
body.jja-body .jjg .entry-content .jj-media .jj-media-connect__items {
display: grid !important;
grid-template-columns: repeat(4, 1fr) !important;
}
body.jja-body .jjg .entry-content .jj-media .jj-media-collab__head {
display: grid !important;
grid-template-columns: 625px 1fr !important;
}
body.jja-body .jjg .entry-content .jj-media .jj-media-collab__grid {
display: grid !important;
grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}
body.jja-body .jjg .entry-content .jj-media .jj-media-works__grid {
display: grid !important;
grid-template-columns: repeat(3, 1fr) !important;
}
body.jja-body .jjg .entry-content .jj-media .jj-media-policy__layout,
body.jja-body .jjg .entry-content .jj-media .jj-media-contact__layout {
display: grid !important;
grid-template-columns: 625px 1fr !important;
}
body.jja-body .jjg .entry-content .jj-media section {
width: 100% !important;
max-width: none !important;
margin-left: 0 !important;
margin-right: 0 !important;
}
body.jja-body .jjg .entry-content .jj-media figure,
body.jja-body .jjg .entry-content .jj-media p,
body.jja-body .jjg .entry-content .jj-media h1,
body.jja-body .jjg .entry-content .jj-media h2,
body.jja-body .jjg .entry-content .jj-media h3,
body.jja-body .jjg .entry-content .jj-media dl {
max-width: none;
}
body.jja-body .jjg .entry-content .jj-media-reader h2 {
max-width: 425px;
}
body.jja-body .jjg .entry-content .jj-media-reader p {
max-width: 494px;
}
@media (max-width: 760px) {
body.jja-body .jjg .entry-content .jj-media .jj-media-edit__top,
body.jja-body .jjg .entry-content .jj-media .jj-media-connect__head,
body.jja-body .jjg .entry-content .jj-media .jj-media-collab__head,
body.jja-body .jjg .entry-content .jj-media .jj-media-policy__layout,
body.jja-body .jjg .entry-content .jj-media .jj-media-contact__layout {
grid-template-columns: 1fr !important;
}
body.jja-body .jjg .entry-content .jj-media .jj-media-categories {
grid-template-columns: repeat(2, 1fr) !important;
}
body.jja-body .jjg .entry-content .jj-media .jj-media-connect__items {
grid-template-columns: repeat(2, 1fr) !important;
}
body.jja-body .jjg .entry-content .jj-media .jj-media-works__grid {
grid-template-columns: 1fr !important;
}
body.jja-body .jjg .entry-content .jj-media .jj-media-collab__grid {
grid-template-columns: 1fr 1fr !important;
}
}
body.jja-body .jjg .entry-content .jj-media-contact h2 { color: var(--ink); }
body.jja-body .jjg .entry-content .jj-media-reader h2 { color: var(--ink); }
body.jja-body .jjg .jm-read {
max-width: none;
margin: 0;
padding: 0;
background: none;
}
body.jja-body .jjg .jm-read .entry-content { display: block; }
body.jja-body:has(.jjg) .jj-wall { display: none; }
body.jja-body:has(.jjg) { background: #f4f1e9; }
body.jja-body:has(.jjg) .jj-bar {
background: rgba(244, 241, 233, .94);
border-bottom: 1px solid rgba(23, 23, 20, .1);
}
body.jja-body:has(.jjg) .jj-bar :is(a, strong, span, .jj-bar__logo) { color: #111111; }
body.jja-body.jj-cat-page:has(.jjg) .jj-bar.is-solid .jj-bar__logo,
body.jja-body.jj-cat-page:has(.jjg) .jj-bar.is-solid .jj-trigger,
body.jja-body:has(.jjg) .jj-bar .jj-bar__logo,
body.jja-body:has(.jjg) .jj-bar .jj-trigger { color: #111111; }
body.jja-body.jj-cat-page:has(.jjg) .jj-bar.is-solid .jj-trigger i,
body.jja-body:has(.jjg) .jj-trigger i { background: #111111; }
@media (max-width: 760px) {
body.jja-body .jjg .entry-content .jj-media-hero {
display: block;
min-height: 0;
padding-top: 65vh;
}
body.jja-body .jjg .entry-content .jj-media-hero::before {
inset: 0 0 auto 0;
height: 62vh;
background-position: center;
-webkit-mask-image: linear-gradient(to top, rgba(0,0,0,0) 0%, rgba(0,0,0,.45) 6%, #000 20%);
mask-image: linear-gradient(to top, rgba(0,0,0,0) 0%, rgba(0,0,0,.45) 6%, #000 20%);
}
body.jja-body .jjg .entry-content .jj-media-hero__content {
width: calc(100% - 36px);
padding: 0 0 70px;
}
body.jja-body .jjg .entry-content .jj-media-hero h1::after {
margin-top: 26px;
}
body.jja-body .jjg .entry-content .jj-media-edit__top > div:first-child,
body.jja-body .jjg .entry-content .jj-media-connect__head > div:first-child,
body.jja-body .jjg .entry-content .jj-media-collab__head > div:first-child,
body.jja-body .jjg .entry-content .jj-media-policy__layout > div:first-child,
body.jja-body .jjg .entry-content .jj-media-contact__layout > div:first-child,
body.jja-body .jjg .entry-content .jj-media-works__head {
padding-left: 0;
}
body.jja-body .jjg .entry-content .jj-media__num {
position: static;
display: block;
margin: 0 0 6px;
font-size: 96px;
}
body.jja-body .jjg .entry-content .jj-media__eyebrow {
padding-top: 0;
}
body.jja-body .jjg .entry-content .jj-media-edit__intro,
body.jja-body .jjg .entry-content .jj-media__body,
body.jja-body .jjg .entry-content .jj-media-policy__text,
body.jja-body .jjg .entry-content .jj-media-contact__layout > dl {
padding: 0;
border-left: 0;
}
body.jja-body .jjg .entry-content .jj-media-categories {
grid-template-columns: 1fr 1fr;
}
body.jja-body .jjg .entry-content .jj-media-category {
padding: 22px 20px 22px 0;
border-right: 1px solid var(--line);
border-bottom: 1px solid var(--line);
}
body.jja-body .jjg .entry-content .jj-media-category:nth-child(even) {
padding-right: 0;
padding-left: 20px;
border-right: 0;
}
body.jja-body .jjg .entry-content .jj-media-category:first-child {
padding-left: 0;
}
body.jja-body .jjg .entry-content .jj-media-category:last-child {
padding-left: 20px;
padding-right: 0;
border-right: 0;
}
}
body.jja-body .jjg .entry-content .jj-media .jj-media-connect__head .jj-media__body {
padding-top: 52px;
}
body.jja-body .jjg .entry-content .jj-media .jj-media-connect__head .jj-media__body p {
margin: 0 0 1.2em;
font-family: var(--jc-serif);
font-size: 15px;
line-height: 2.05;
letter-spacing: .03em;
color: var(--ink);
word-break: auto-phrase;
text-wrap: pretty;
}
body.jja-body .jjg .entry-content .jj-media .jj-media-connect__head .jj-media__body p:last-child {
margin-bottom: 0;
}
body.jja-body .jjg .entry-content .jj-media .jj-media-connect__scenes {
display: grid !important;
grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
gap: 0 28px;
margin: 0;
padding-top: 28px;
border-top: 1px solid var(--ink);
}
body.jja-body .jjg .entry-content .jj-media .jj-media-connect__scene {
margin: 0;
padding: 0;
}
body.jja-body .jjg .entry-content .jj-media .jj-media-connect__photo {
aspect-ratio: 3 / 4;
overflow: hidden;
background: #d8d4ca;
}
body.jja-body .jjg .entry-content .jj-media .jj-media-connect__photo img {
display: block;
width: 100%;
height: 100%;
max-width: none;
object-fit: cover;
object-position: center;
transition: transform .45s ease;
}
body.jja-body .jjg .entry-content .jj-media .jj-media-connect__scene:hover .jj-media-connect__photo img {
transform: scale(1.025);
}
body.jja-body .jjg .entry-content .jj-media .jj-media-connect__scene figcaption {
margin: 0;
padding: 22px 0 0;
border-top: 1px solid var(--gold);
margin-top: 18px;
}
body.jja-body .jjg .entry-content .jj-media .jj-media-connect__scene figcaption::before { content: none; display: none; }
body.jja-body .jjg .entry-content .jj-media .jj-media-connect__en {
display: block;
margin-bottom: 8px;
font-family: var(--jc-logo);
font-size: 11px;
font-weight: 400;
letter-spacing: .22em;
color: var(--gold);
}
body.jja-body .jjg .entry-content .jj-media .jj-media-connect__jp {
display: block;
margin-bottom: 12px;
font-family: var(--jc-serif);
font-size: 22px;
font-weight: 500;
line-height: 1.6;
letter-spacing: .06em;
color: var(--ink);
}
body.jja-body .jjg .entry-content .jj-media .jj-media-connect__text {
display: block;
font-family: var(--jc-serif);
font-size: 13.5px;
line-height: 2;
letter-spacing: .03em;
color: var(--sub);
word-break: auto-phrase;
text-wrap: pretty;
}
@media (max-width: 1024px) {
body.jja-body .jjg .entry-content .jj-media .jj-media-connect__scenes {
gap: 0 18px;
}
body.jja-body .jjg .entry-content .jj-media .jj-media-connect__photo {
aspect-ratio: 4 / 5;
}
body.jja-body .jjg .entry-content .jj-media .jj-media-connect__head .jj-media__body {
padding-top: 0;
}
}
@media (max-width: 767px) {
body.jja-body .jjg .entry-content .jj-media .jj-media-connect__scenes {
grid-template-columns: 1fr !important;
gap: 48px 0;
padding-top: 24px;
}
body.jja-body .jjg .entry-content .jj-media .jj-media-connect__photo {
aspect-ratio: 4 / 3;
}
body.jja-body .jjg .entry-content .jj-media .jj-media-connect__jp {
font-size: 20px;
}
}
body.jja-body .jjg .entry-content .jj-media .jj-media-collab__scene {
margin: 0;
padding: 0;
background: #d8d4ca;
}
body.jja-body .jjg .entry-content .jj-media .jj-media-collab__scene img {
display: block;
width: 100%;
height: auto;
max-width: none;
}
body.jja-body .jjg .entry-content .jj-media .jj-media-collab__scene figcaption::before { content: none; display: none; }
body.jja-body .jjg .entry-content .jj-media .jj-media-collab__grid--over {
position: relative;
grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
margin: 40px 0 0;
padding: 0;
border-top: 1px solid var(--ink);
}
body.jja-body .jjg .entry-content .jj-media .jj-media-collab__grid--over .jj-media-collab__item {
padding: 22px 18px 4px;
border-bottom: 0;
border-left: 1px solid var(--line);
}
body.jja-body .jjg .entry-content .jj-media .jj-media-collab__grid--over .jj-media-collab__item:first-child {
padding-left: 0;
border-left: 0;
}
body.jja-body .jjg .entry-content .jj-media .jj-media-collab__grid--over .jj-media-collab__item strong {
margin-bottom: 10px;
font-size: 11px;
letter-spacing: .12em;
}
body.jja-body .jjg .entry-content .jj-media .jj-media-collab__grid--over .jj-media-collab__item p {
font-size: 12px;
line-height: 1.8;
}
@media (max-width: 1024px) {
body.jja-body .jjg .entry-content .jj-media .jj-media-collab__grid--over {
grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
margin: 32px 0 0;
}
body.jja-body .jjg .entry-content .jj-media .jj-media-collab__grid--over .jj-media-collab__item {
padding: 18px 16px 16px;
border-bottom: 1px solid var(--line);
}
body.jja-body .jjg .entry-content .jj-media .jj-media-collab__grid--over .jj-media-collab__item:nth-child(3n+1) { padding-left: 0; border-left: 0; }
}
@media (max-width: 760px) {
body.jja-body .jjg .entry-content .jj-media .jj-media-collab__grid--over {
grid-template-columns: 1fr 1fr !important;
margin: 24px 0 0;
}
body.jja-body .jjg .entry-content .jj-media .jj-media-collab__grid--over .jj-media-collab__item,
body.jja-body .jjg .entry-content .jj-media .jj-media-collab__grid--over .jj-media-collab__item:nth-child(3n+1) {
padding: 16px 12px 14px 0;
border-left: 0;
}
body.jja-body .jjg .entry-content .jj-media .jj-media-collab__grid--over .jj-media-collab__item:nth-child(even) {
padding-left: 14px;
border-left: 1px solid var(--line);
}
}
@media (min-width: 761px) and (max-width: 1199px) {
body.jja-body .jjg .entry-content .jj-media-hero__content {
width: calc(100% - 80px);
padding-left: 46%;
}
}
@media (min-width: 761px) and (max-width: 1024px) {
body.jja-body .jjg .entry-content .jj-media .jj-media-edit__top,
body.jja-body .jjg .entry-content .jj-media .jj-media-connect__head,
body.jja-body .jjg .entry-content .jj-media .jj-media-collab__head,
body.jja-body .jjg .entry-content .jj-media .jj-media-policy__layout,
body.jja-body .jjg .entry-content .jj-media .jj-media-contact__layout {
grid-template-columns: 1fr !important;
gap: 36px 0;
}
body.jja-body .jjg .entry-content .jj-media .jj-media-edit__intro,
body.jja-body .jjg .entry-content .jj-media .jj-media__body,
body.jja-body .jjg .entry-content .jj-media .jj-media-policy__text,
body.jja-body .jjg .entry-content .jj-media .jj-media-contact__layout > dl {
padding: 0;
border-left: 0;
}
}
body.jja-body .jjg .entry-content .jj-media .jj-media-hero__intro,
body.jja-body .jjg .entry-content .jj-media .jj-media__body p,
body.jja-body .jjg .entry-content .jj-media .jj-media-edit__intro p,
body.jja-body .jjg .entry-content .jj-media .jj-media-category p,
body.jja-body .jjg .entry-content .jj-media .jj-media-reader p,
body.jja-body .jjg .entry-content .jj-media .jj-media-collab__item p,
body.jja-body .jjg .entry-content .jj-media .jj-media-policy__text p,
body.jja-body .jjg .entry-content .jj-media .jj-media-contact__layout > div:first-child p {
word-break: auto-phrase;
text-wrap: pretty;
}
body.jja-body .jjg .entry-content .jj-media .jj-media-works__ja {
margin: 10px 0 0;
font-family: var(--jc-serif);
font-size: 13px;
letter-spacing: .2em;
color: var(--sub);
}
@media (min-width: 761px) and (max-width: 1024px) {
body.jja-body .jjg .entry-content .jj-media .jj-media-categories {
grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}
body.jja-body .jjg .entry-content .jj-media .jj-media-category,
body.jja-body .jjg .entry-content .jj-media .jj-media-category:first-child,
body.jja-body .jjg .entry-content .jj-media .jj-media-category:last-child {
padding: 22px 20px 22px;
border-right: 1px solid var(--line);
border-bottom: 1px solid var(--line);
}
body.jja-body .jjg .entry-content .jj-media .jj-media-category:nth-child(3n+1) { padding-left: 0; }
body.jja-body .jjg .entry-content .jj-media .jj-media-category:nth-child(3n) { padding-right: 0; border-right: 0; }
body.jja-body .jjg .entry-content .jj-media .jj-media-edit__intro,
body.jja-body .jjg .entry-content .jj-media .jj-media__body,
body.jja-body .jjg .entry-content .jj-media .jj-media-policy__text {
padding-left: 200px;
}
}
@media (min-width: 1025px) {
body.jja-body .jjg .entry-content .jj-media-reader__content {
display: grid;
grid-template-columns: 494px 1fr;
gap: 0 80px;
align-items: start;
}
}
body.jja-body .jjg .entry-content .jj-media-reader__data {
opacity: .62;
padding-top: 26px;
border-top: 1px solid var(--ink);
}
body.jja-body .jjg .entry-content .jj-media-reader p.jj-rd__head {
display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 16px;
max-width: none; margin: 0 0 22px;
}
body.jja-body .jjg .entry-content .jj-media-reader p.jj-rd__head b {
font-family: var(--jc-logo); font-weight: 400; font-size: 12px; letter-spacing: .26em; color: var(--ink);
}
body.jja-body .jjg .entry-content .jj-media-reader p.jj-rd__head span {
padding: 2px 10px; border: 1px dashed var(--faint);
font-family: var(--jc-serif); font-size: 11.5px; letter-spacing: .08em; color: var(--sub);
}
body.jja-body .jjg .entry-content .jj-media-reader .jj-rd__grid {
display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 32px;
}
body.jja-body .jjg .entry-content .jj-media-reader .jj-rd__card { padding: 18px 0 20px; border-bottom: 1px solid var(--line); }
body.jja-body .jjg .entry-content .jj-media-reader p.jj-rd__t {
display: flex; align-items: baseline; gap: 10px;
max-width: none; margin: 0 0 12px;
font-family: var(--jc-serif); font-size: 13.5px; line-height: 1.5; color: var(--ink);
}
body.jja-body .jjg .entry-content .jj-media-reader p.jj-rd__t small {
font-family: var(--jc-logo); font-size: 10px; letter-spacing: .22em; color: var(--gold);
}
body.jja-body .jjg .entry-content .jj-media-reader p.jj-rd__big {
max-width: none; margin: 4px 0 0;
font-family: var(--jc-serif); font-size: 40px; line-height: 1.2; color: var(--ink);
}
body.jja-body .jjg .entry-content .jj-media-reader p.jj-rd__big span { margin-left: 8px; font-family: var(--jc-logo); font-size: 12px; letter-spacing: .2em; color: var(--sub); }
body.jja-body .jjg .entry-content .jj-media-reader p.jj-rd__big--sub { font-size: 26px; }
body.jja-body .jjg .entry-content .jj-media-reader .jj-rd__bars { list-style: none; margin: 0; padding: 0; }
body.jja-body .jjg .entry-content .jj-media-reader .jj-rd__bars li {
display: grid; grid-template-columns: 74px 1fr 34px; align-items: center; gap: 10px;
margin: 0; padding: 4px 0;
font-size: 11.5px; line-height: 1.4; color: var(--sub);
}
body.jja-body .jjg .entry-content .jj-media-reader .jj-rd__bars li::before { content: none; }
body.jja-body .jjg .entry-content .jj-media-reader .jj-rd__lab { font-family: var(--jc-serif); white-space: nowrap; }
body.jja-body .jjg .entry-content .jj-media-reader .jj-rd__bar { display: block; height: 6px; background: rgba(17, 17, 17, .06); }
body.jja-body .jjg .entry-content .jj-media-reader .jj-rd__bar i { display: block; height: 100%; background: var(--gold); opacity: .55; }
body.jja-body .jjg .entry-content .jj-media-reader .jj-rd__val { text-align: right; font-family: var(--jc-serif); color: var(--faint); }
@media (max-width: 1024px) {
body.jja-body .jjg .entry-content .jj-media-reader__data { margin-top: 48px; }
}
@media (max-width: 600px) {
body.jja-body .jjg .entry-content .jj-media-reader .jj-rd__grid { grid-template-columns: 1fr; }
}
@media (min-width: 1025px) {
body.jja-body .jjg .entry-content .jj-media .jj-media-edit__intro,
body.jja-body .jjg .entry-content .jj-media .jj-media__body {
border-top: 1px solid var(--ink);
}
}
@media (min-width: 761px) {
body.jja-body .jjg .entry-content .jj-media .jj-media-policy__layout {
grid-template-columns: 1fr !important;
gap: 96px 0;
}
body.jja-body .jjg .entry-content .jj-media .jj-media-policy__text {
padding: 64px 0 0 200px;
border-left: 0;
border-top: 1px solid var(--ink);
}
body.jja-body .jjg .entry-content .jj-media .jj-media-policy__text h2 {
margin: 0 0 40px;
font-size: clamp(38px, 5vw, 66px);
line-height: 1.45;
letter-spacing: .02em;
}
body.jja-body .jjg .entry-content .jj-media .jj-media-policy__text p {
font-size: 16px;
}
}
body.jja-body.jj-cat-page:not(.jj-is-eventpage) .jj-foot__sns .jj-sns,
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)):not(:has(.jm-opener__img)) .jj-foot__sns .jj-sns {
filter: invert(1);
}
body.jja-body .jjg .entry-content .jj-media .jj-media-contact__row dd a {
color: inherit;
text-decoration: underline;
text-decoration-thickness: 1px;
text-underline-offset: 4px;
}
body.jja-body .jjg .entry-content .jj-media .jj-media-contact__row dd a:hover { color: var(--gold); }
body.jja-body .jj-topnav a.jj-topnav__top span { display: none; }
body.jja-body .jm-read .entry-content .is-style-jj-points {
margin: clamp(28px, 4vh, 48px) 0;
padding: clamp(18px, 2.2vw, 26px) 0;
border-top: 1px solid var(--jc-line, #d9d9d9);
border-bottom: 1px solid var(--jc-line, #d9d9d9);
}
body.jja-body .jm-read .entry-content .is-style-jj-points::before {
content: "ポイント";
display: block;
margin: 0 0 .9em;
font-family: var(--jc-mono), monospace;
font-size: .62rem;
font-weight: 700;
letter-spacing: .2em;
color: var(--jc-accent);
}
body.jja-body .jm-read .entry-content .is-style-jj-points .wp-block-list {
margin: 0;
padding-left: 1.1em;
list-style: none;
}
body.jja-body .jm-read .entry-content .is-style-jj-points .wp-block-list li {
position: relative;
margin: 0 0 .7em;
text-indent: 0;
font-family: var(--jc-serif), serif;
font-size: .94rem;
line-height: 1.95;
letter-spacing: .03em;
}
body.jja-body .jm-read .entry-content .is-style-jj-points .wp-block-list li::before {
content: "";
position: absolute;
left: -1.1em;
top: .82em;
width: 10px;
height: 1px;
background: var(--jc-accent);
}
body.jja-body .jm-read .entry-content .is-style-jj-points .wp-block-list li:last-child {
margin-bottom: 0;
}
body.jja-body .jm-read .entry-content .is-style-jj-points p {
margin: 0 0 .7em;
text-indent: 0;
font-family: var(--jc-serif), serif;
font-size: .94rem;
line-height: 1.95;
}
body.jja-body .jm-read .entry-content .is-style-jj-points p:last-child { margin-bottom: 0; }
body.jja-body .jm-read .entry-content .is-style-jj-pr {
margin: 0 0 clamp(26px, 3.4vh, 40px);
padding: .85em 1.1em;
border: 1px solid var(--jc-line, #d9d9d9);
display: flex;
align-items: baseline;
gap: .9em;
}
body.jja-body .jm-read .entry-content .is-style-jj-pr::before {
content: "PR";
flex: 0 0 auto;
font-family: var(--jc-mono), monospace;
font-size: .62rem;
font-weight: 700;
letter-spacing: .2em;
color: var(--jc-accent);
}
body.jja-body .jm-read .entry-content .is-style-jj-pr p {
margin: 0;
text-indent: 0;
font-family: var(--jc-serif), serif;
font-size: .82rem;
line-height: 1.8;
letter-spacing: .03em;
color: var(--jc-ink-secondary);
}
@media (max-width: 781px) {
body.jja-body .jm-read .entry-content .is-style-jj-pr {
display: block;
}
body.jja-body .jm-read .entry-content .is-style-jj-pr::before {
display: block;
margin: 0 0 .5em;
}
}
.jj-cathead {
padding: calc(var(--jj-abh, 0px) + clamp(56px, 7vh, 88px)) 0 clamp(10px, 1.6vh, 20px);
background: none;
}
.jj-cathead__inner {
grid-template-columns: auto auto 1fr;
align-items: center;
column-gap: 0;
}
.jj-cathead__en {
grid-column: 1; grid-row: 1;
font-size: clamp(1.9rem, 4.2vw, 3rem);
}
.jj-cathead__ja {
grid-column: 2; grid-row: 1;
margin: 0;
padding: .5em 0 .5em 22px;
margin-left: 22px;
border-left: 1px solid rgba(244, 241, 233, .3);
font-size: clamp(.9rem, 1.5vw, 1.1rem);
letter-spacing: .26em;
line-height: 1.2;
}
.jj-cathead__lede {
grid-column: 1 / -1; grid-row: 2;
margin: 12px 0 0;
}
.jj-cathead__count { display: none; }
.jj-issues {
padding-top: 40px;
padding-bottom: 24px;
row-gap: 44px;
}
@media (min-width: 901px) {
.jj-issues {
grid-template-columns: repeat(6, minmax(0, 1fr));
--jj-gap: 18px;
column-gap: var(--jj-gap);
}
}
@media (min-width: 601px) and (max-width: 900px) {
.jj-issues { grid-template-columns: repeat(3, minmax(0, 1fr)); --jj-gap: 16px; column-gap: var(--jj-gap); }
}
@media (min-width: 901px) {
.jj-issue__sheet { padding: 12px; padding-bottom: 34px; }
.jj-issue__logo { font-size: .86rem; }
.jj-issue__mast { margin-bottom: 8px; }
.jj-issue__cat { margin-bottom: 6px; font-size: .46rem; letter-spacing: .18em; }
.jj-issue__cat span:first-child { font-size: .56rem; }
.jj-issue__title { font-size: .78rem; line-height: 1.5; -webkit-line-clamp: 3; }
.jj-issue__lede { display: none; }
.jj-issue__date { font-size: .5rem; }
}
body.jj-cat-page::before {
filter: contrast(.84) saturate(.9);
}
.jj-catfoot {
padding-top: 70px;
}
.jj-catfoot__grid {
--jj-plate-w: 152px;
grid-template-columns: repeat(7, var(--jj-plate-w));
}
@media (max-width: 1100px) {
.jj-catfoot__grid { grid-template-columns: repeat(4, var(--jj-plate-w)); }
}
@media (max-width: 760px) {
.jj-catfoot__grid { grid-template-columns: repeat(2, var(--jj-plate-w)); }
}
@media (max-width: 430px) {
.jj-catfoot__grid { grid-template-columns: var(--jj-plate-w); }
}
.jj-cat-page .jj-catfoot__item.is-current .jj-catfoot__en,
.jj-catfoot__item.is-current .jj-catfoot__en { color: var(--jc-accent); }
.jj-cat-page .jj-catfoot__item.is-current .jj-catfoot__ja,
.jj-catfoot__item.is-current .jj-catfoot__ja { color: rgba(240, 236, 225, .9); }
.jj-cat-page .jj-cathead__en { color: #111111; }
body.jja-body.jj-cat-page .jj-bar.is-solid .jj-bar__logo,
body.jja-body.jj-cat-page .jj-bar.is-solid .jj-trigger { color: #111111; }
body.jja-body.jj-cat-page .jj-bar.is-solid .jj-trigger__mark i { background: #111111; }
.jj-cat-page .jj-cathead__ja { color: #111111; }
.jj-cat-page .jj-cathead__lede { color: #111111; }
.jj-cathead__ja { border-left-color: rgba(17, 17, 17, .42); }
.jj-cat-page .jj-models__label { color: #111111; }
.jj-cat-page .jj-model { border-color: rgba(17, 17, 17, .34); color: #111111; }
.jj-cat-page .jj-model:hover { border-color: #111111; color: #111111; }
.jj-cat-page .jj-model.is-on { background: #111111; border-color: #111111; color: #f4f1e9; }
.jj-cat-page .jj-cat .page-numbers {
border-color: rgba(17, 17, 17, .34);
color: #111111;
}
.jj-cat-page .jj-cat .page-numbers:hover { border-color: #111111; color: #111111; }
.jj-cat-page .jj-cat .page-numbers.current {
background: #111111; border-color: #111111; color: #f4f1e9;
}
.jj-cat-page .jj-catfoot { border-top-color: rgba(17, 17, 17, .28); }
.jj-cat-page .jj-catfoot__head { color: #111111; }
.jj-cat-page .jj-catfoot__grid { border-top-color: rgba(17, 17, 17, .28); }
.jj-cat-page .jj-issues__none { color: #111111; }
body.jj-cat-page .jj-foot { color: #111111; }
body.jj-cat-page .jj-foot__note,
body.jj-cat-page .jj-foot__cr { opacity: .78; }
@media (min-width: 901px) {
.jj-issue:last-child:nth-child(6n + 1)::after {
right: calc(-500% - 5 * var(--jj-gap) - var(--jj-brk-r));
}
.jj-issue:last-child:nth-child(6n + 2)::after {
right: calc(-400% - 4 * var(--jj-gap) - var(--jj-brk-r));
}
.jj-issue:last-child:nth-child(6n + 3)::after {
right: calc(-300% - 3 * var(--jj-gap) - var(--jj-brk-r));
}
.jj-issue:last-child:nth-child(6n + 4)::after {
right: calc(-200% - 2 * var(--jj-gap) - var(--jj-brk-r));
}
.jj-issue:last-child:nth-child(6n + 5)::after {
right: calc(-100% - var(--jj-gap) - var(--jj-brk-r));
}
.jj-issue:last-child:nth-child(6n)::after {
right: calc(-1 * var(--jj-brk-r));
}
}
@media (min-width: 601px) and (max-width: 900px) {
.jj-issue:last-child:nth-child(3n + 1)::after {
right: calc(-200% - 2 * var(--jj-gap) - var(--jj-brk-r));
}
.jj-issue:last-child:nth-child(3n + 2)::after {
right: calc(-100% - var(--jj-gap) - var(--jj-brk-r));
}
.jj-issue:last-child:nth-child(3n)::after {
right: calc(-1 * var(--jj-brk-r));
}
}
@media (max-width: 600px) {
.jj-issue:last-child::after,
.jj-issue:last-child:nth-child(2n + 1)::after {
right: calc(-1 * var(--jj-brk-r));
}
}
@media (min-width: 901px) {
.jj-issues {
grid-template-columns: none;
grid-auto-flow: column;
grid-auto-columns: 230px;
--jj-gap: 30px;
column-gap: var(--jj-gap);
overflow-x: auto;
overscroll-behavior-x: contain;
scroll-snap-type: x proximity;
padding-bottom: 28px;
}
.jj-issue { scroll-snap-align: start; }
.jj-issue__sheet { padding: 15px; padding-bottom: 40px; }
.jj-issue__logo { font-size: 1.06rem; }
.jj-issue__mast { margin-bottom: 11px; }
.jj-issue__cat { margin-bottom: 8px; font-size: .54rem; letter-spacing: .2em; }
.jj-issue__cat span:first-child { font-size: .66rem; }
.jj-issue__title { font-size: .98rem; line-height: 1.5; -webkit-line-clamp: 3; }
.jj-issue__date { font-size: .58rem; }
.jj-issues .jj-issue::after {
left: calc(var(--jj-gap) / -2 - 1px);
right: calc(var(--jj-gap) / -2 - 1px);
background: url(front-m.png) center top / auto 100% repeat-x;
}
.jj-issues .jj-issue:first-child::after {
left: calc(-1 * var(--jj-brk-l));
background:
url(front-l.png) left top / auto 100% no-repeat,
url(front-m.png) center top / auto 100% repeat-x;
}
.jj-issues .jj-issue:last-child::after {
right: calc(-1 * var(--jj-brk-r));
background:
url(front-r.png) right top / auto 100% no-repeat,
url(front-m.png) center top / auto 100% repeat-x;
}
.jj-issues .jj-issue:first-child:last-child::after {
left: calc(-1 * var(--jj-brk-l));
background:
url(front-l.png) left top / auto 100% no-repeat,
url(front-r.png) right top / auto 100% no-repeat,
url(front-m.png) center top / auto 100% repeat-x;
}
.jj-issues .jj-issue:last-child:nth-child(1)::after {
right: calc(-300% - 3 * var(--jj-gap) - var(--jj-brk-r));
}
.jj-issues .jj-issue:last-child:nth-child(2)::after {
right: calc(-200% - 2 * var(--jj-gap) - var(--jj-brk-r));
}
.jj-issues .jj-issue:last-child:nth-child(3)::after {
right: calc(-100% - var(--jj-gap) - var(--jj-brk-r));
}
.jj-issues::-webkit-scrollbar { height: 6px; }
.jj-issues::-webkit-scrollbar-track { background: rgba(17, 17, 17, .12); }
.jj-issues::-webkit-scrollbar-thumb { background: rgba(17, 17, 17, .42); }
}
.jj-catfoot { padding-top: 10px; }
body.jja-body.jj-cat-page .jj-bar :is(a, strong, span, .jj-bar__logo) { color: #111111; }
body.jja-body.jj-cat-page .jj-bar .jj-trigger { color: #111111; }
body.jja-body.jj-cat-page .jj-bar .jj-trigger i { background: #111111; }
body.jja-body.jj-cat-page .jj-foot__note,
body.jja-body.jj-cat-page .jj-foot__cr { color: #111111; }
body.jja-body.jj-cat-page .jj-foot__sns a { color: #111111; }
.jj-event.jj-eventpage {
--jjx-ink: #f1ede4;
--jjx-ink-2: #cfcac0;
--jjx-ink-3: #9d988e;
--jjx-line: rgba(241, 237, 228, .16);
--jjx-gold: var(--jc-accent, #c9930f);
color: var(--jjx-ink);
padding-bottom: clamp(40px, 7vh, 80px);
}
.jj-event.jj-eventpage .jj-event-scrim {
background: linear-gradient(180deg,
rgba(14, 13, 11, .30) 0,
rgba(14, 13, 11, .18) 180px,
rgba(14, 13, 11, .36) 330px,
rgba(14, 13, 11, .56) 440px,
rgba(14, 13, 11, .62) 100%);
}
body.jja-body.jj-cat-page.jj-is-eventpage .jj-bar.is-solid {
background: transparent;
backdrop-filter: none;
-webkit-backdrop-filter: none;
border-bottom-color: transparent;
box-shadow: none;
}
body.jja-body.jj-cat-page.jj-is-eventpage .jj-bar.is-solid::before {
content: ""; display: block; opacity: 1;
position: absolute; inset: 0 0 -40px; z-index: -1; pointer-events: none;
background: linear-gradient(180deg, rgba(8, 8, 6, .82) 0%, rgba(8, 8, 6, .55) 55%, rgba(8, 8, 6, 0) 100%);
}
body.jja-body.jj-cat-page.jj-is-eventpage .jj-bar.is-solid :is(a, strong, .jj-bar__logo),
body.jja-body.jj-cat-page.jj-is-eventpage .jj-bar.is-solid .jj-trigger { color: #f4f1e9; }
body.jja-body.jj-cat-page.jj-is-eventpage .jj-bar.is-solid span { color: rgba(244, 241, 233, .78); }
body.jja-body.jj-cat-page.jj-is-eventpage .jj-bar.is-solid .jj-trigger i { background: #f4f1e9; }
body.jja-body.jj-cat-page.jj-is-eventpage .jj-bar .jj-topnav a[href*="/category/event/"] {
opacity: 1;
box-shadow: inset 0 -1px 0 var(--jc-accent, #c9930f);
}
body.jja-body.jj-cat-page.jj-is-eventpage .jj-foot__note,
body.jja-body.jj-cat-page.jj-is-eventpage .jj-foot__cr,
body.jja-body.jj-cat-page.jj-is-eventpage .jj-foot__sns a { color: rgba(244, 241, 233, .78); }
.jjx-hero {
padding: calc(clamp(12px, 1.8vh, 20px) * 2 + 44px) 0 clamp(36px, 5vh, 56px);
}
.jjx-hero__kick {
margin: 0 0 6px;
font-family: var(--jc-logo), sans-serif; font-weight: 400;
font-size: 13px; letter-spacing: .24em; line-height: 1;
color: #f4f1e9;
}
.jjx-hero__h {
display: flex; align-items: center; gap: 22px;
margin: 0;
color: #f7f3ea;
text-shadow: 0 2px 18px rgba(0, 0, 0, .35);
}
.jjx-hero__en {
font-family: var(--jc-logo), sans-serif; font-weight: 400;
font-size: clamp(56px, 6.2vw, 92px); line-height: .9; letter-spacing: .005em;
}
.jjx-hero__ja {
padding-left: 22px;
border-left: 1px solid rgba(244, 241, 233, .55);
font-family: var(--jc-serif), serif; font-weight: 400;
font-size: clamp(22px, 2.3vw, 34px); line-height: 1.4; letter-spacing: .12em;
}
.jjx-hero__lead {
margin: 22px 0 0;
font-family: var(--jc-serif), serif; font-weight: 400;
font-size: clamp(20px, 2vw, 28px); line-height: 1.5; letter-spacing: .12em;
color: #f7f3ea;
text-shadow: 0 2px 14px rgba(0, 0, 0, .4);
}
.jjx-hero__sub {
margin: 6px 0 0;
font-family: var(--jc-serif), serif;
font-size: clamp(13px, 1.15vw, 16px); line-height: 1.8; letter-spacing: .14em;
color: rgba(247, 243, 234, .9);
text-shadow: 0 1px 10px rgba(0, 0, 0, .45);
}
.jjx { scroll-margin-top: 72px; font-family: var(--jc-font), sans-serif; }
.jjx-wrap {
display: grid;
grid-template-columns: 250px minmax(0, 1fr);
column-gap: clamp(28px, 3vw, 44px);
align-items: start;
padding-top: 18px;
}
.jjx-rail {
padding-right: clamp(20px, 2vw, 28px);
border-right: 1px solid var(--jjx-line);
}
.jjx-box { padding: 0 0 20px; margin: 0 0 20px; border-bottom: 1px solid var(--jjx-line); }
.jjx-rh {
display: flex; align-items: baseline; gap: 10px;
margin: 0 0 14px;
font-weight: 400;
}
.jjx-rh b {
font-family: var(--jc-logo), sans-serif; font-weight: 400;
font-size: 14px; letter-spacing: .2em; line-height: 1;
color: var(--jjx-gold);
}
.jjx-rh span {
font-family: var(--jc-font), sans-serif;
font-size: 11px; letter-spacing: .12em; color: var(--jjx-ink-2);
}
.jjx-mnav {
display: flex; align-items: center; justify-content: space-between;
margin: 0 0 8px;
}
.jjx-mnav__now {
margin: 0;
font-family: var(--jc-font), sans-serif;
font-size: 15px; letter-spacing: .1em; color: var(--jjx-ink);
font-variant-numeric: tabular-nums;
}
.jjx-mnav__a {
display: inline-flex; align-items: center; justify-content: center;
width: 32px; height: 28px;
font-size: 20px; line-height: 1; color: var(--jjx-ink-2);
text-decoration: none;
}
.jjx-mnav__a:hover { color: var(--jjx-gold); }
.jjx-cal {
display: grid; grid-template-columns: repeat(7, 1fr);
row-gap: 2px;
text-align: center;
font-family: var(--jc-font), sans-serif;
font-variant-numeric: tabular-nums;
}
.jjx-cal__w { font-size: 11px; line-height: 24px; color: var(--jjx-ink-2); }
.jjx-cal__d {
position: relative;
display: flex; align-items: center; justify-content: center;
height: 28px;
font-size: 12px; color: var(--jjx-ink-3);
text-decoration: none;
}
.jjx-cal__d.has { color: var(--jjx-ink); }
.jjx-cal__d.has::after {
content: ""; position: absolute; left: 50%; bottom: 1px;
width: 4px; height: 4px; margin-left: -2px; border-radius: 50%;
background: var(--jjx-gold);
}
.jjx-cal__d.is-today::before {
content: ""; position: absolute; left: 50%; top: 50%;
width: 24px; height: 24px; margin: -13px 0 0 -12px; border-radius: 50%;
background: var(--jjx-gold); z-index: -1;
}
.jjx-cal__d.is-today { color: #141210; font-weight: 700; z-index: 0; }
.jjx-cal__d.is-today.has::after { bottom: -3px; }
a.jjx-cal__d:hover { color: var(--jjx-gold); }
.jj-event .jjx .jjm-map { display: block; width: 100%; height: auto; overflow: visible; }
.jj-event .jjx .jjm-a path { fill: rgba(241, 237, 228, .08); stroke: rgba(241, 237, 228, .22); stroke-width: 1.4; }
.jj-event .jjx .jjm-l1 path { fill: rgba(241, 237, 228, .16); }
.jj-event .jjx .jjm-l2 path { fill: rgba(241, 237, 228, .24); }
.jj-event .jjx .jjm-l3 path { fill: rgba(241, 237, 228, .33); }
.jj-event .jjx .jjm-a.is-on path { fill: rgba(201, 147, 15, .55); }
.jj-event .jjx a.jjm-a:hover path { fill: rgba(201, 147, 15, .35); }
.jj-event .jjx .jjm-map__box { fill: none; stroke: rgba(241, 237, 228, .22); stroke-width: 2; stroke-dasharray: 8 8; }
.jj-event .jjx .jjm-map__boxt { fill: var(--jjx-ink-3); font-size: 30px; text-anchor: middle; }
.jj-event .jjx .jjm-map__tag { fill: rgba(16, 15, 13, .86); stroke: rgba(241, 237, 228, .6); stroke-width: 2.5; }
.jj-event .jjx .jjm-l0 .jjm-map__tag { stroke: rgba(241, 237, 228, .22); }
.jj-event .jjx .jjm-a.is-on .jjm-map__tag { stroke: var(--jjx-gold); }
.jj-event .jjx a.jjm-t:hover .jjm-map__tag { stroke: var(--jjx-gold); }
.jj-event .jjx .jjm-t .jjm-map__n {
fill: var(--jjx-ink); stroke: none; paint-order: normal;
font-family: var(--jc-font), sans-serif; font-size: 52px; font-weight: 400; letter-spacing: .04em;
text-anchor: middle; dominant-baseline: central;
}
.jj-event .jjx .jjm-t.jjm-l0 .jjm-map__n { fill: var(--jjx-ink-3); }
.jj-event .jjx .jjm-t .jjm-map__c {
fill: var(--jjx-gold); stroke: none;
font-family: var(--jc-font), sans-serif; font-size: 52px; font-weight: 700;
}
.jjx-src { margin: 8px 0 0; font-size: 9px; letter-spacing: .04em; color: var(--jjx-ink-3); text-align: right; }
.jjx .jjm-klist { display: grid; gap: 2px; margin: 0; padding: 0; border: 0; background: none; }
.jjx .jjm-klist .jjm-klist__a {
display: flex; align-items: center; gap: 10px;
min-height: 30px; padding: 0; margin: 0;
border: 0; background: none;
font-family: var(--jc-font), sans-serif;
font-size: 12.5px; letter-spacing: .08em; color: var(--jjx-ink);
text-decoration: none;
}
.jjx .jjm-klist .jjm-klist__a i {
position: relative; flex: none;
width: 13px; height: 13px; margin: 0;
border: 1px solid rgba(241, 237, 228, .55); border-radius: 0;
background: none;
}
.jjx .jjm-klist .jjm-klist__a.is-on i { border-color: var(--jjx-gold); background: var(--jjx-gold); }
.jjx .jjm-klist .jjm-klist__a.is-on i::after {
content: ""; position: absolute; left: 3.5px; top: 0.5px;
width: 4px; height: 8px;
border: solid #141210; border-width: 0 1.5px 1.5px 0; transform: rotate(45deg);
}
.jjx .jjm-klist .jjm-klist__a b {
margin-left: auto;
font-family: var(--jc-font), sans-serif; font-weight: 400;
font-size: 11px; color: var(--jjx-ink-3);
}
.jjx .jjm-klist .jjm-klist__a:hover { color: var(--jjx-gold); }
.jjx-note { margin: 0; font-size: 11px; line-height: 1.8; letter-spacing: .04em; color: var(--jjx-ink-3); }
.jjx-sh {
display: flex; align-items: center; justify-content: space-between; gap: 16px;
flex-wrap: wrap;
margin: 0 0 16px;
}
.jjx-sh h2 { display: flex; align-items: baseline; gap: 16px; margin: 0; font-weight: 400; }
.jjx-sh h2 b {
font-family: var(--jc-logo), sans-serif; font-weight: 400;
font-size: 30px; line-height: 1; letter-spacing: .08em; color: var(--jjx-ink);
}
.jjx-sh h2 span {
font-family: var(--jc-font), sans-serif;
font-size: 12.5px; letter-spacing: .14em; color: var(--jjx-ink-2);
}
.jjx-sh__more {
font-family: var(--jc-font), sans-serif;
font-size: 11.5px; letter-spacing: .18em; color: var(--jjx-ink);
text-decoration: none;
}
.jjx-sh__more:hover { color: var(--jjx-gold); }
.jjx-pick { margin: 0 0 40px; }
.jjx-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.jjx-card {
position: relative; overflow: hidden;
display: flex; flex-direction: column;
min-height: 262px;
border: 1px solid var(--jjx-line);
background: rgba(18, 17, 15, .55);
transition: border-color .2s ease;
}
.jjx-card:hover { border-color: rgba(201, 147, 15, .7); }
.jjx-card__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.jjx-card.has-img::before {
content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
background: linear-gradient(180deg, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, .55) 58%, rgba(0, 0, 0, .9) 100%);
}
.jjx-card__pr {
position: absolute; left: 0; top: 0; z-index: 2;
padding: 5px 12px;
background: var(--jjx-gold); color: #141210;
font-size: 10.5px; letter-spacing: .2em; line-height: 1.2;
}
.jjx-card__body {
position: relative; z-index: 2;
display: flex; flex-direction: column; flex: 1;
padding: 22px 18px 18px;
}
.jjx-card.has-img .jjx-card__body { justify-content: flex-end; }
.jjx-card__big { margin: 0 0 auto; padding-bottom: 18px; line-height: 1; }
.jjx-card__big small {
display: block; margin-bottom: 8px;
font-family: var(--jc-logo), sans-serif;
font-size: 12px; letter-spacing: .22em; color: var(--jjx-gold);
}
.jjx-card__big strong {
font-family: var(--jc-logo), sans-serif; font-weight: 400;
font-size: 54px; letter-spacing: .01em; color: var(--jjx-ink);
}
.jjx-card__d {
margin: 0 0 8px;
font-size: 12px; letter-spacing: .08em; color: var(--jjx-ink);
font-variant-numeric: tabular-nums;
}
.jjx-card__t {
margin: 0;
font-family: var(--jc-font), sans-serif; font-weight: 500;
font-size: 15.5px; line-height: 1.5; letter-spacing: .06em;
}
.jjx-card__t a { color: var(--jjx-ink); text-decoration: none; }
.jjx-card__t a::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.jjx-card__p { margin: 6px 0 0; font-size: 11.5px; letter-spacing: .06em; color: var(--jjx-ink-2); }
.jjx-card__tags { display: flex; flex-wrap: wrap; gap: 6px; margin: 12px 0 0; }
.jjx-card .jj-event-embed { position: relative; z-index: 3; margin-top: 10px; }
.jjx-card--open { border-style: dashed; border-color: rgba(241, 237, 228, .38); background: rgba(18, 17, 15, .35); }
.jjx-card--open:hover { border-color: rgba(201, 147, 15, .7); }
.jjx-card--span2 { grid-column: span 2; }
.jjx-card--span3 { grid-column: span 3; }
.jjx-open__k {
margin: 0 0 auto; padding-bottom: 18px; line-height: 1;
font-family: var(--jc-logo), sans-serif; font-size: 54px; letter-spacing: .04em; color: rgba(241, 237, 228, .28);
}
.jjx-open__a {
align-self: flex-start; margin-top: 14px; padding: 7px 18px;
background: var(--jjx-gold); color: #141210; text-decoration: none;
font-size: 12px; font-weight: 700; letter-spacing: .14em;
}
.jjx-open__a::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.jjx-tag {
display: inline-block;
padding: 2px 10px;
border: 1px solid rgba(241, 237, 228, .62);
font-family: var(--jc-font), sans-serif;
font-size: 11px; line-height: 1.5; letter-spacing: .12em; color: var(--jjx-ink);
white-space: nowrap;
}
.jjx-tag.is-closed { border-color: rgba(241, 237, 228, .3); color: var(--jjx-ink-3); }
.jjx-list { scroll-margin-top: 72px; }
.jjx-list--sub { margin-top: 40px; }
.jjx-list--sub .jjx-sh h2 b { font-size: 22px; }
.jjx-why { margin: -6px 0 12px; font-size: 11.5px; line-height: 1.8; color: var(--jjx-ink-3); }
.jjx-filter { display: flex; gap: 10px; margin: 0; }
.jjx-sel { display: block; }
.jjx-sel--kind { display: none; }
.jjx-sel select {
-webkit-appearance: none; appearance: none;
min-width: 150px; height: 36px; padding: 0 34px 0 12px;
border: 1px solid rgba(241, 237, 228, .42); border-radius: 0;
background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23f1ede4' stroke-width='1.2'/%3E%3C/svg%3E") no-repeat right 12px center;
font-family: var(--jc-font), sans-serif;
font-size: 12.5px; letter-spacing: .08em; color: var(--jjx-ink);
cursor: pointer;
}
.jjx-sel select option { color: #141210; background: #f4f1e9; }
.jjx-rows { border-top: 1px solid var(--jjx-line); }
.jjx-row {
display: grid;
grid-template-columns: 150px 96px minmax(0, 1fr) minmax(0, 220px) 20px;
align-items: center; column-gap: 18px;
padding: 12px 6px;
border-bottom: 1px solid var(--jjx-line);
color: var(--jjx-ink); text-decoration: none;
scroll-margin-top: 80px;
transition: background-color .15s ease;
}
.jjx-rows.has-thumb .jjx-row { grid-template-columns: 92px 150px 96px minmax(0, 1fr) minmax(0, 220px) 20px; }
a.jjx-row:hover { background: rgba(241, 237, 228, .05); }
a.jjx-row:hover .jjx-row__go { color: var(--jjx-gold); transform: translateX(3px); }
.jjx-row:target { background: rgba(201, 147, 15, .12); }
.jjx-row__img { display: block; width: 92px; height: 50px; overflow: hidden; background: rgba(241, 237, 228, .06); }
.jjx-row__img img { width: 100%; height: 100%; object-fit: cover; }
.jjx-row__d { font-size: 12.5px; letter-spacing: .04em; font-variant-numeric: tabular-nums; }
.jjx-row__t { font-size: 14px; font-weight: 500; line-height: 1.5; letter-spacing: .06em; }
.jjx-row__s {
display: inline-block; margin-left: 8px; padding: 0 6px;
border: 1px solid currentColor;
font-style: normal; font-size: 10px; font-weight: 400; letter-spacing: .1em; line-height: 1.6;
color: var(--jjx-ink-2); vertical-align: 1px;
}
.jjx-row__p { font-size: 12px; letter-spacing: .06em; color: var(--jjx-ink-2); }
.jjx-row__go { font-size: 14px; color: var(--jjx-ink-2); text-align: right; transition: transform .15s ease, color .15s ease; }
.jjx-row.is-past { opacity: .5; }
.jjx-row.is-off .jjx-row__t { text-decoration: line-through; text-decoration-thickness: 1px; }
.jjx-empty { margin: 0; padding: 22px 0; border-top: 1px solid var(--jjx-line); border-bottom: 1px solid var(--jjx-line); font-size: 13px; color: var(--jjx-ink-2); }
.jjx-send {
--jjx-ink: #f1ede4;
--jjx-ink-2: #cfcac0;
--jjx-line: rgba(241, 237, 228, .16);
--jjx-gold: var(--jc-accent, #c9930f);
display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 10px 24px;
margin: 26px 0 0;
border: 22px solid transparent;
border-image: url(plate-black.webp) 56 fill / 22px stretch;
padding: 4px 8px;
filter: drop-shadow(0 10px 18px rgba(0, 0, 0, .35));
}
.jjx-send__h { margin: 0; display: flex; flex-direction: column; gap: 6px; line-height: 1; }
.jjx-send__h b { font-family: var(--jc-logo), sans-serif; font-weight: 400; font-size: 22px; letter-spacing: .1em; color: var(--jjx-gold); }
.jjx-send__h span { font-family: var(--jc-serif), serif; font-size: 13.5px; letter-spacing: .12em; color: var(--jjx-ink); }
.jjx-send__t { margin: 0; padding-left: 24px; border-left: 1px solid var(--jjx-line); font-size: 12.5px; line-height: 1.8; letter-spacing: .04em; color: var(--jjx-ink-2); }
.jjx-send__a {
display: inline-flex; align-items: center; justify-content: center;
min-width: 132px; height: 42px; padding: 0 24px;
border-radius: 999px; background: var(--jjx-gold); color: #141210;
font-family: var(--jc-font), sans-serif; font-weight: 700; font-size: 14px; letter-spacing: .16em; text-decoration: none;
transition: filter .15s ease, transform .15s ease;
}
.jjx-send__a:hover { filter: brightness(1.12); transform: translateY(-1px); }
@media (max-width: 900px) {
.jjx-send { order: 4; margin-top: 0; grid-template-columns: 1fr; border-width: 18px; border-image: url(plate-black.webp) 56 fill / 18px stretch; padding: 2px; }
.jjx-send__t { padding-left: 0; border-left: 0; }
.jjx-send__a { justify-self: stretch; }
}
@media (max-width: 1180px) and (min-width: 901px) {
.jjx-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.jjx-cards .jjx-card:nth-child(3) { display: none; }
.jjx-card--span2, .jjx-card--span3 { grid-column: auto; }
.jjx-card--open:first-child { grid-column: 1 / -1; }
.jjx-row, .jjx-rows.has-thumb .jjx-row { grid-template-columns: 136px 88px minmax(0, 1fr) 20px; }
.jjx-row__img { display: none; }
.jjx-row__p { grid-column: 3; font-size: 11.5px; }
}
@media (max-width: 900px) {
.jjx-hero { padding-top: 92px; padding-bottom: 32px; }
.jjx-hero__kick { font-size: 11px; }
.jjx-hero__h { gap: 14px; }
.jjx-hero__en { font-size: 58px; }
.jjx-hero__ja { padding-left: 14px; font-size: 22px; }
.jjx-hero__lead { margin-top: 16px; font-size: 19px; }
.jjx-hero__sub { font-size: 13px; }
.jj-event.jj-eventpage .jj-event-scrim {
background: linear-gradient(180deg,
rgba(14, 13, 11, .30) 0,
rgba(14, 13, 11, .20) 160px,
rgba(14, 13, 11, .40) 300px,
rgba(14, 13, 11, .60) 400px,
rgba(14, 13, 11, .66) 100%);
}
.jjx-wrap { display: flex; flex-direction: column; align-items: stretch; gap: 36px; padding-top: 4px; }
.jjx-main { display: contents; }
.jjx-pick { order: 1; margin-bottom: 0; }
.jjx-list { order: 2; }
.jjx-rail { order: 3; }
.jjx-list--sub { order: 4; margin-top: 0; }
.jjx-rail { padding: 0; border: 0; }
.jjx-box--area, .jjx-box--type { display: none; }
.jjx-sh h2 b { font-size: 26px; }
.jjx-cards {
display: grid; grid-template-columns: none;
grid-auto-flow: column; grid-auto-columns: 78%;
gap: 12px;
overflow-x: auto; overscroll-behavior-x: contain;
scroll-snap-type: x mandatory; scroll-padding: 0 var(--jj-pad, 18px);
margin: 0 calc(-1 * var(--jj-pad, 18px));
padding: 0 var(--jj-pad, 18px) 4px;
scrollbar-width: none;
}
.jjx-cards::-webkit-scrollbar { display: none; }
.jjx-card { min-height: 224px; scroll-snap-align: start; }
.jjx-card--span2, .jjx-card--span3 { grid-column: auto; }
.jjx-card__big strong { font-size: 46px; }
.jjx-list > .jjx-sh { display: block; }
.jjx-filter { margin-top: 14px; }
.jjx-sel, .jjx-sel--kind { display: block; flex: 1; min-width: 0; }
.jjx-sel select { width: 100%; min-width: 0; }
.jjx-row, .jjx-rows.has-thumb .jjx-row {
grid-template-columns: auto minmax(0, 1fr) 16px;
grid-template-areas: "d k go" "t t go" "p p go";
row-gap: 4px; column-gap: 10px;
padding: 13px 2px;
}
.jjx-row__img { display: none; }
.jjx-row__d { grid-area: d; }
.jjx-row__k { grid-area: k; }
.jjx-row__t { grid-area: t; font-size: 14.5px; }
.jjx-row__p { grid-area: p; font-size: 11.5px; }
.jjx-row__go { grid-area: go; align-self: center; }
}
.jj-eventpage--one {
--jjp-ink: #efeae0;
--jjp-ink-2: #c9c3b6;
--jjp-gold: #d2a24c;
--jjp-line: rgba(239, 234, 224, .16);
--jjp-gold-line: rgba(210, 162, 76, .55);
padding-bottom: 40px;
}
.jjp-back { max-width: 820px; margin: calc(clamp(12px, 1.8vh, 20px) * 2 + 56px) auto 16px; }
.jjp-back a {
display: inline-flex; align-items: center; gap: 18px;
color: #111; text-decoration: none;
}
.jjp-back__arrow { font-size: 22px; line-height: 1; }
.jjp-back__txt { display: grid; gap: 6px; }
.jjp-back__txt b {
font-family: var(--jc-logo), sans-serif; font-weight: 400;
font-size: 18px; line-height: 1; letter-spacing: .06em;
padding-bottom: 5px; border-bottom: 1.5px solid #111; min-width: 140px;
}
.jjp-back__txt span { font-family: var(--jc-font), sans-serif; font-size: 11px; letter-spacing: .12em; }
.jjp-back a:hover b { color: #6b4f16; border-color: #6b4f16; }
.jjp {
position: relative;
max-width: 820px; margin: 0 auto;
border: 34px solid transparent;
border-image: url(plate-black.webp) 56 fill / 34px stretch;
padding: 2px 10px 0;
color: var(--jjp-ink);
font-family: var(--jc-font), sans-serif;
filter: drop-shadow(0 16px 26px rgba(0, 0, 0, .38));
}
.jjp a { color: var(--jjp-ink); }
.jjp__off {
margin: 0 0 18px; padding: 8px 14px;
border: 1px solid #c8553f; color: #f2b3a5;
font-size: 14px; letter-spacing: .12em; text-align: center;
}
.jjp__head {
display: grid; grid-template-columns: 170px minmax(0, 1fr);
padding-bottom: 18px; border-bottom: 1px solid var(--jjp-gold-line);
}
.jjp__date {
margin: 0; padding-right: 20px;
border-right: 1px solid var(--jjp-line);
display: flex; flex-direction: column; justify-content: center;
line-height: 1;
}
.jjp__mon {
font-family: var(--jc-logo), sans-serif; font-size: 20px; letter-spacing: .04em; color: var(--jjp-ink);
}
.jjp__date strong {
margin-top: 6px;
font-family: var(--jc-logo), sans-serif; font-weight: 400;
font-size: 58px; letter-spacing: -.01em; color: #f6f2ea;
}
.jjp__date strong.is-wait { font-size: 22px; letter-spacing: .06em; font-family: var(--jc-serif), serif; }
.jjp__date small {
display: flex; align-items: baseline; gap: 12px; margin-top: 8px;
font-family: var(--jc-font), sans-serif; font-size: 14px; letter-spacing: .14em; color: var(--jjp-ink);
}
.jjp__date small i { font-style: normal; font-size: 10.5px; letter-spacing: .22em; color: var(--jjp-ink-2); }
.jjp__ttl { padding-left: 26px; display: flex; flex-direction: column; justify-content: center; }
.jjp__tag {
align-self: flex-start;
margin: 0 0 10px; padding: 3px 10px;
border: 1px solid var(--jjp-gold);
font-size: 11px; letter-spacing: .14em; color: var(--jjp-gold); line-height: 1.3;
}
.jjp__tag b { font-family: var(--jc-logo), sans-serif; font-weight: 400; font-size: 12px; letter-spacing: .12em; }
.jjp__ttl h1 {
margin: 0;
font-family: var(--jc-serif), serif; font-weight: 500;
font-size: clamp(20px, 2.4vw, 26px); line-height: 1.4; letter-spacing: .06em;
color: #f6f2ea;
}
.jjp__when { margin: 8px 0 0; font-family: var(--jc-serif), serif; font-size: 13.5px; letter-spacing: .08em; color: var(--jjp-ink); }
.jjp__marks { display: flex; gap: 8px; margin: 12px 0 0; }
.jjp__marks span { padding: 1px 10px; border: 1px solid var(--jjp-ink-2); font-size: 11px; letter-spacing: .14em; color: var(--jjp-ink-2); }
.jjp__k {
margin: 0 0 8px;
font-family: var(--jc-logo), sans-serif; font-size: 13px; letter-spacing: .16em; line-height: 1;
color: var(--jjp-gold);
}
.jjp__loc {
display: flex; align-items: center; justify-content: space-between; gap: 24px;
padding: 16px 0; border-bottom: 1px solid var(--jjp-gold-line);
}
.jjp__venue { margin: 0; font-family: var(--jc-serif), serif; font-size: 19px; line-height: 1.4; letter-spacing: .06em; color: #f6f2ea; }
.jjp__pref { margin: 2px 0 0; font-family: var(--jc-serif), serif; font-size: 13px; letter-spacing: .08em; color: var(--jjp-ink); }
.jjp__map {
flex: none; display: inline-flex; align-items: center; gap: 8px;
padding: 6px 0 6px 22px; border-left: 1px solid var(--jjp-line);
font-family: var(--jc-serif), serif; font-size: 13px; letter-spacing: .06em; text-decoration: none;
}
.jjp__map svg { width: 15px; height: 15px; fill: var(--jjp-gold); }
.jjp__map:hover { color: var(--jjp-gold); }
.jjp__details { padding: 16px 0 4px; }
.jjp__details dl { margin: 0; border-top: 1px solid var(--jjp-line); }
.jjp__details dl > div {
display: grid; grid-template-columns: 130px minmax(0, 1fr);
border-bottom: 1px solid var(--jjp-line);
}
.jjp__details dt {
margin: 0; padding: 7px 10px;
border-right: 1px solid var(--jjp-line);
font-family: var(--jc-serif), serif; font-size: 13px; letter-spacing: .08em; color: var(--jjp-gold);
}
.jjp__details dd {
margin: 0; padding: 7px 0 7px 20px;
font-family: var(--jc-serif), serif; font-size: 14px; line-height: 1.65; letter-spacing: .06em; color: var(--jjp-ink);
overflow-wrap: anywhere;
}
.jjp__details dd a { text-decoration: underline; text-underline-offset: 3px; }
.jjp__details dd a:hover { color: var(--jjp-gold); }
.jjp__ext { color: var(--jjp-ink-2); }
.jjp__chip { display: inline-block; padding: 0 10px; border: 1px solid var(--jjp-gold); color: var(--jjp-ink); font-size: 12px; letter-spacing: .14em; }
.jjp__note { margin: 12px 0 0; font-size: 12.5px; line-height: 1.8; color: var(--jjp-ink-2); }
.jjp .jj-event-embed { margin: 14px 0 0; }
.jjp .jj-event-embed__go {
background: transparent; color: var(--jjp-ink);
border: 1px solid var(--jjp-line); padding: 8px 14px; font-size: 13px; letter-spacing: .08em; cursor: pointer;
}
.jjp .jj-event-embed__note { color: var(--jjp-ink-2); }
.jjp__foot {
display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 6px 20px;
padding: 12px 0 0;
}
.jjp__foot p { margin: 0; font-size: 11px; line-height: 1.8; letter-spacing: .04em; color: var(--jjp-ink-2); }
.jjp__foot .jjp__chk { font-family: var(--jc-serif), serif; font-size: 12px; color: var(--jjp-ink); }
.jjp.is-off .jjp__date strong,
.jjp.is-off .jjp__ttl h1 { text-decoration: line-through; text-decoration-thickness: 2px; }
.jj-eventpage--one .jjx-send { max-width: 820px; margin: 28px auto 0; box-sizing: border-box; }
.jj-eventpage--one .jj-event-body { max-width: 820px; margin: 28px auto 0; }
.jjr { max-width: 820px; margin: 36px auto 0; color: #111; font-family: var(--jc-font), sans-serif; }
.jjr__head { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin: 0 0 14px; }
.jjr__head h2 { display: flex; align-items: baseline; gap: 16px; margin: 0; font-weight: 400; }
.jjr__head h2 b { font-family: var(--jc-logo), sans-serif; font-weight: 400; font-size: 20px; letter-spacing: .08em; line-height: 1; }
.jjr__head h2 span { font-size: 12px; letter-spacing: .12em; }
.jjr__more { font-size: 12px; letter-spacing: .12em; color: #111; text-decoration: none; border-bottom: 1px solid #111; padding-bottom: 2px; }
.jjr__list {
display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
border-top: 1.5px solid rgba(17, 17, 17, .55); border-bottom: 1.5px solid rgba(17, 17, 17, .55);
background: rgba(238, 235, 228, .62);
}
.jjr__item {
position: relative; display: flex; flex-direction: column; gap: 5px;
padding: 12px 34px 12px 14px; color: #111; text-decoration: none;
}
.jjr__item + .jjr__item { border-left: 1px solid rgba(17, 17, 17, .3); }
.jjr__top { display: flex; align-items: center; gap: 12px; }
.jjr__d { font-family: var(--jc-serif), serif; font-size: 13px; letter-spacing: .04em; font-variant-numeric: tabular-nums; }
.jjr__k { padding: 0 8px; border: 1px solid #111; font-size: 11px; letter-spacing: .1em; line-height: 1.6; }
.jjr__item strong { font-family: var(--jc-serif), serif; font-weight: 600; font-size: 15px; line-height: 1.5; letter-spacing: .06em; }
.jjr__p { font-family: var(--jc-serif), serif; font-size: 12px; letter-spacing: .04em; color: #333; }
.jjr__go { position: absolute; right: 12px; bottom: 12px; font-size: 14px; transition: transform .15s ease; }
.jjr__item:hover strong { text-decoration: underline; text-underline-offset: 3px; }
.jjr__item:hover .jjr__go { transform: translateX(3px); }
@media (max-width: 760px) {
.jjp-back { margin: 80px 0 12px; }
.jjp-back__txt b { font-size: 16px; min-width: 120px; }
.jjp {
border-width: 24px;
border-image: url(plate-black.webp) 56 fill / 24px stretch;
padding: 0;
}
.jjp__head { grid-template-columns: 1fr; gap: 12px; padding-bottom: 14px; }
.jjp__date { padding: 0 0 10px; border-right: 0; border-bottom: 1px solid var(--jjp-line); flex-direction: row; flex-wrap: wrap; justify-content: flex-start; align-items: baseline; gap: 4px 12px; }
.jjp__mon { font-size: 16px; }
.jjp__date strong { margin-top: 0; font-size: 40px; }
.jjp__date small { margin-top: 0; font-size: 12px; gap: 8px; }
.jjp__ttl { padding-left: 0; }
.jjp__ttl h1 { font-size: 19px; }
.jjp__when { font-size: 12.5px; }
.jjp__loc { flex-direction: column; align-items: flex-start; gap: 8px; padding: 14px 0; }
.jjp__venue { font-size: 16px; }
.jjp__map { padding: 0; border-left: 0; }
.jjp__details dl > div { grid-template-columns: 92px minmax(0, 1fr); }
.jjp__details dt { padding: 7px 6px 7px 0; font-size: 12px; letter-spacing: .02em; }
.jjp__details dd { padding: 7px 0 7px 12px; font-size: 13px; }
.jjr { margin-top: 28px; }
.jjr__head { align-items: flex-end; }
.jjr__head h2 { flex-direction: column; align-items: flex-start; gap: 6px; }
.jjr__head h2 b { font-size: 18px; white-space: nowrap; }
.jjr__head h2 span { font-size: 12px; }
.jjr__more { white-space: nowrap; font-size: 12px; }
.jjr__list { grid-template-columns: 1fr; }
.jjr__item + .jjr__item { border-left: 0; border-top: 1px solid rgba(17, 17, 17, .3); }
}
.jjf-page { padding-bottom: 40px; }
.jjf-crumb {
max-width: 860px; margin: calc(clamp(12px, 1.8vh, 20px) * 2 + 56px) auto 14px;
display: flex; flex-wrap: wrap; gap: 6px;
font-family: var(--jc-logo), sans-serif; font-size: 10.5px; letter-spacing: .1em; color: #111;
}
.jjf-crumb a { color: #111; text-decoration: none; }
.jjf-crumb a:hover { text-decoration: underline; }
.jjf-crumb span:last-child { font-family: var(--jc-font), sans-serif; }
.jjf {
max-width: 860px; margin: 0 auto;
border: 34px solid transparent;
border-image: url(plate-light.webp) 56 fill / 34px stretch;
padding: 4px 18px 0;
color: #1a1a18;
font-family: var(--jc-font), sans-serif;
filter: drop-shadow(0 14px 22px rgba(0, 0, 0, .3));
}
.jjf__head {
display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 18px;
padding: 0 0 14px; border-bottom: 1px solid rgba(26, 26, 24, .35);
}
.jjf__head h1 { display: flex; align-items: baseline; gap: 10px; margin: 0; font-weight: 400; }
.jjf__head h1 b { font-family: var(--jc-logo), sans-serif; font-weight: 400; font-size: 32px; line-height: 1; letter-spacing: .04em; }
.jjf__head h1 span { font-family: var(--jc-serif), serif; font-weight: 700; font-size: 26px; line-height: 1; letter-spacing: .06em; }
.jjf__head p { margin: 0; font-family: var(--jc-serif), serif; font-size: 13.5px; letter-spacing: .1em; }
.jjf .jje-form { max-width: none; margin: 0; padding: 0; background: none; border: 0; box-shadow: none; }
.jjf .jje-form__lead { margin: 14px 0 0; font-size: 12.5px; line-height: 1.9; letter-spacing: .04em; color: #2c2c29; }
.jjf .jje-form__lead strong { font-weight: 700; }
.jjf .jje-form__lead a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.jjf .jje-form__msg { margin: 16px 0 0; padding: 12px 14px; font-size: 13px; border: 1px solid rgba(26, 26, 24, .3); background: rgba(255, 255, 255, .6); }
.jjf .jje-form__f { margin: 16px 0 0; }
.jjf .jje-form__hp { position: absolute; left: -9999px; }
.jjf .jje-form__sec {
display: grid; grid-template-columns: 150px minmax(0, 1fr); grid-template-rows: auto 1fr;
column-gap: 0; padding: 18px 0;
border-top: 1px solid rgba(26, 26, 24, .28);
}
.jjf .jje-form__side { grid-column: 1; grid-row: 1; display: flex; flex-direction: column; line-height: 1; }
.jjf .jje-form__no {
font-family: var(--jc-logo), sans-serif; font-size: 52px; letter-spacing: .02em;
color: transparent; -webkit-text-stroke: 1px rgba(26, 26, 24, .4);
}
.jjf .jje-form__en { margin-top: 8px; font-family: var(--jc-logo), sans-serif; font-weight: 400; font-size: 17px; letter-spacing: .1em; }
.jjf .jje-form__ja {
grid-column: 1; grid-row: 2; align-self: start;
margin: 6px 0 0; font-family: var(--jc-serif), serif; font-weight: 400; font-size: 12.5px; letter-spacing: .1em; color: #333;
border: 0; padding: 0;
}
.jjf .jje-form__grid {
grid-column: 2; grid-row: 1 / 3;
display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 12px 16px;
padding-left: 22px; border-left: 1px solid rgba(26, 26, 24, .2);
}
.jjf .jje-form__row { grid-column: span 6; margin: 0; display: flex; flex-direction: column; gap: 4px; position: relative; }
.jjf .jje-form__row--title { grid-column: span 8; }
.jjf .jje-form__row--kind { grid-column: span 4; }
.jjf .jje-form__row--start,
.jjf .jje-form__row--end,
.jjf .jje-form__row--start_time,
.jjf .jje-form__row--end_time { grid-column: span 3; }
.jjf .jje-form__row--end::before {
content: "〜"; position: absolute; left: -14px; top: 27px; font-size: 12px; color: #444;
}
.jjf .jje-form__row--organizer,
.jjf .jje-form__row--note { grid-column: span 12; }
.jjf .jje-form__row label {
display: flex; align-items: center; gap: 6px; margin: 0;
font-size: 12px; font-weight: 700; letter-spacing: .06em; color: #1a1a18;
}
.jjf .jje-form__req {
display: inline-block; padding: 1px 5px; background: #9e2a1e; color: #fff;
font-size: 9.5px; font-weight: 700; letter-spacing: .08em; line-height: 1.4; border-radius: 1px;
}
.jjf .jje-form__row input,
.jjf .jje-form__row select,
.jjf .jje-form__row textarea {
width: 100%; box-sizing: border-box; margin: 0;
height: 34px; padding: 0 10px;
border: 1px solid #b4b1aa; border-radius: 2px;
background: rgba(255, 255, 255, .88);
font-family: var(--jc-font), sans-serif; font-size: 13px; color: #1a1a18;
}
.jjf .jje-form__row textarea { height: auto; min-height: 64px; padding: 8px 10px; line-height: 1.6; resize: vertical; }
.jjf .jje-form__row input:focus,
.jjf .jje-form__row select:focus,
.jjf .jje-form__row textarea:focus { outline: 2px solid rgba(201, 147, 15, .55); outline-offset: 0; border-color: #8a6a24; }
.jjf .jje-form__row input::placeholder { color: #9a978f; }
.jjf .jje-form__row--pickup { grid-column: span 12; }
.jjf .jje-form__check { display: flex; align-items: center; gap: 10px; min-height: 40px; padding: 0 12px; border: 1px solid #b4b1aa; border-radius: 2px; background: rgba(255, 255, 255, .88); }
.jjf .jje-form__check input { width: 18px; height: 18px; flex: none; padding: 0; margin: 0; accent-color: #1a1a18; }
.jjf .jje-form__check label { margin: 0; font-size: 13px; font-weight: 700; letter-spacing: .04em; color: #1a1a18; cursor: pointer; }
.jjf .jje-form__row small { font-size: 10.5px; line-height: 1.6; letter-spacing: .04em; color: #4d4b46; }
.jjf .jje-form__row small strong { color: #1a1a18; }
.jjf .jje-form__send { margin: 6px 0 0; padding: 18px 0 0; text-align: center; border-top: 1px solid rgba(26, 26, 24, .28); }
.jjf .jje-form__send button {
min-width: 180px; height: 44px; padding: 0 28px;
border: 0; border-radius: 999px;
background: linear-gradient(180deg, #2a2a28, #0d0d0c); color: #f4f1e9;
font-family: var(--jc-font), sans-serif; font-size: 14px; letter-spacing: .2em;
box-shadow: 0 6px 14px rgba(0, 0, 0, .3); cursor: pointer;
}
.jjf .jje-form__send button:hover { background: linear-gradient(180deg, #3a3a37, #151514); }
.jjf .jje-form__agree { margin: 6px 0 0; padding: 18px 0 0; text-align: center; border-top: 1px solid rgba(26, 26, 24, .28); font-size: 12px; line-height: 1.9; letter-spacing: .04em; color: #2c2c29; }
.jjf .jje-form__agree a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.jjf .jje-form__agree + .jje-form__send { margin: 0; padding: 12px 0 0; border-top: 0; }
@media (max-width: 760px) {
.jjf-crumb { margin: 80px 0 10px; }
.jjf {
border-width: 24px;
border-image: url(plate-light.webp) 56 fill / 24px stretch;
padding: 0;
}
.jjf__head h1 b { font-size: 26px; }
.jjf__head h1 span { font-size: 20px; }
.jjf__head p { font-size: 12px; }
.jjf .jje-form__sec { grid-template-columns: 1fr; grid-template-rows: auto; padding: 14px 0; }
.jjf .jje-form__side { grid-row: auto; flex-direction: row; align-items: baseline; gap: 10px; }
.jjf .jje-form__no { font-size: 32px; }
.jjf .jje-form__en { margin-top: 0; font-size: 15px; }
.jjf .jje-form__ja { grid-row: auto; margin: 2px 0 10px; }
.jjf .jje-form__grid { grid-column: 1; grid-row: auto; padding-left: 0; border-left: 0; gap: 10px; }
.jjf .jje-form__row,
.jjf .jje-form__row--title,
.jjf .jje-form__row--kind { grid-column: span 12; }
.jjf .jje-form__row--start,
.jjf .jje-form__row--end,
.jjf .jje-form__row--start_time,
.jjf .jje-form__row--end_time { grid-column: span 6; }
.jjf .jje-form__row--end::before { display: none; }
}
body.jja-body .jm-read .entry-content .jj-corners {
margin: clamp(24px, 3vw, 40px) 0 clamp(20px, 2.4vw, 32px);
}
body.jja-body .jm-read .entry-content .jj-corner + .jj-corner {
margin-top: clamp(32px, 4vw, 48px);
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).is-style-jj-full > .wp-block-group__inner-container > div.wp-block-group.jj-corners:not(.wp-block-pullquote),
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).is-style-jj-full:not(:has(> .wp-block-group__inner-container)) > div.wp-block-group.jj-corners:not(.wp-block-pullquote) {
margin-left: 0;
margin-right: 0;
max-width: none;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) .jj-corner h3 {
margin: 0;
padding-top: 12px;
border-top: 2px solid var(--jc-ink-primary);
font: 800 clamp(.95rem, 1.2vw, 1.05rem)/1.6 var(--jc-serif), serif;
letter-spacing: .04em;
color: var(--jc-ink-primary);
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) .jj-corner p {
margin: 6px 0 0;
font-size: .8rem;
line-height: 1.85;
color: var(--jc-ink-secondary);
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) .jj-corner figure.wp-block-table.jj-styles {
margin: 16px 0 0;
overflow: visible;
}
@media (min-width: 782px) {
body.jja-body .jm-read .entry-content .jj-corner:not(:has(> .wp-block-group__inner-container)),
body.jja-body .jm-read .entry-content .jj-corner > .wp-block-group__inner-container {
display: grid;
grid-template-columns: minmax(11em, 15em) minmax(0, 1fr);
column-gap: clamp(24px, 3vw, 48px);
align-items: baseline;
border-top: 2px solid var(--jc-ink-primary);
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) .jj-corner h3 {
grid-column: 1;
border-top: 0;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) .jj-corner p {
grid-column: 2;
margin: 0;
padding-top: 12px;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) .jj-corner figure.wp-block-table.jj-styles {
grid-column: 1 / -1;
margin-top: clamp(14px, 1.6vw, 22px);
}
}
body.jja-body .jm-read .entry-content .jj-corner + .jj-corner {
margin-top: clamp(36px, 4.4vw, 60px);
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) figure.wp-block-image.jj-map-wide,
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).is-style-jj-full > .wp-block-group__inner-container > figure.wp-block-image.jj-map-wide:not(.jj-filler) {
width: auto;
max-width: none;
margin-left: 0;
margin-right: 0;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) figure.wp-block-image.jj-map-wide img {
display: block;
width: 100%;
max-width: none;
height: auto;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) figure.wp-block-table.jj-summary {
margin: clamp(24px, 3vw, 40px) 0 0;
max-width: none;
overflow: visible;
}
body.jja-body .jm-read .entry-content .jj-summary table {
width: 100%;
border-collapse: collapse;
table-layout: fixed;
font: 400 .76rem/1.7 var(--jc-font), sans-serif;
letter-spacing: .02em;
color: var(--jc-ink-primary);
}
body.jja-body .jm-read .entry-content .jj-summary th,
body.jja-body .jm-read .entry-content .jj-summary td {
padding: 10px 12px 10px 0;
border: 0;
border-bottom: 1px solid rgba(23, 26, 21, .18);
background: transparent;
text-align: left;
vertical-align: top;
}
body.jja-body .jm-read .entry-content .wp-block-table.jj-summary tr:nth-child(even) td {
background: transparent;
}
body.jja-body .jm-read .entry-content .wp-block-table.jj-summary td + td {
border-left: 0;
}
body.jja-body .jm-read .entry-content .jj-summary thead th {
padding-top: 0;
border-bottom: 2px solid var(--jc-ink-primary);
font: 700 .62rem/1.6 var(--jc-mono), monospace;
letter-spacing: .14em;
color: var(--jc-ink-secondary);
}
body.jja-body .jm-read .entry-content .jj-summary td:first-child {
font: 700 .8rem/1.6 var(--jc-serif), serif;
}
body.jja-body .jm-read .entry-content .jj-summary :is(th, td):nth-child(1) { width: 19%; }
body.jja-body .jm-read .entry-content .jj-summary :is(th, td):nth-child(2) { width: 15%; }
body.jja-body .jm-read .entry-content .jj-summary :is(th, td):nth-child(3) { width: 18%; }
body.jja-body .jm-read .entry-content .jj-summary :is(th, td):nth-child(4) { width: 15%; }
body.jja-body .jm-read .entry-content .jj-summary :is(th, td):nth-child(5) { width: 10%; }
body.jja-body .jm-read .entry-content .jj-summary :is(th, td):nth-child(6) { width: 23%; }
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) figure.wp-block-table.jj-summary figcaption {
margin: 10px 0 0;
padding-top: 0;
border-top: 0;
font-size: .7rem;
color: var(--jc-ink-secondary);
}
@media (max-width: 781px) {
body.jja-body .jm-read .entry-content .jj-summary table,
body.jja-body .jm-read .entry-content .jj-summary tbody,
body.jja-body .jm-read .entry-content .jj-summary tr,
body.jja-body .jm-read .entry-content .jj-summary td {
display: block;
width: auto;
}
body.jja-body .jm-read .entry-content .jj-summary thead {
display: none;
}
body.jja-body .jm-read .entry-content .jj-summary tr {
padding: 14px 0;
border-bottom: 1px solid rgba(23, 26, 21, .18);
}
body.jja-body .jm-read .entry-content .jj-summary :is(th, td):nth-child(n) {
width: auto;
}
body.jja-body .jm-read .entry-content .jj-summary td {
padding: 2px 0;
border: 0;
}
body.jja-body .jm-read .entry-content .jj-summary td:first-child {
margin-bottom: 6px;
}
body.jja-body .jm-read .entry-content .jj-summary td:nth-child(n+2) {
display: grid;
grid-template-columns: 6em minmax(0, 1fr);
column-gap: 12px;
}
body.jja-body .jm-read .entry-content .jj-summary td:nth-child(n+2)::before {
font: 700 .62rem/1.9 var(--jc-mono), monospace;
letter-spacing: .14em;
color: var(--jc-ink-secondary);
}
body.jja-body .jm-read .entry-content .jj-summary td:nth-child(2)::before { content: "色"; }
body.jja-body .jm-read .entry-content .jj-summary td:nth-child(3)::before { content: "顔"; }
body.jja-body .jm-read .entry-content .jj-summary td:nth-child(4)::before { content: "タイヤ・車高"; }
body.jja-body .jm-read .entry-content .jj-summary td:nth-child(5)::before { content: "金属"; }
body.jja-body .jm-read .entry-content .jj-summary td:nth-child(6)::before { content: "象徴パーツ"; }
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(p, li, td, figcaption) {
word-break: normal;
overflow-wrap: anywhere;
text-wrap: wrap;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) > .wp-block-group__inner-container > figure.jj-stylemap:not(.jj-filler):not(.wp-block-table),
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full):not(:has(> .wp-block-group__inner-container)) > figure.jj-stylemap:not(.jj-filler):not(.wp-block-table),
body.jja-body .jm-read .entry-content .jj-stylemap {
width: auto !important;
max-width: none !important;
margin: clamp(20px, 2.6vw, 32px) 0 0;
}
body.jja-body .jm-read .entry-content .jj-stylemap__plane {
position: relative;
aspect-ratio: 16 / 10;
background: #f5f1e6;
color: var(--jc-ink-primary);
font: 700 .66rem/1.4 var(--jc-font), sans-serif;
letter-spacing: .04em;
overflow: hidden;
}
body.jja-body .jm-read .entry-content .jj-stylemap__axis {
position: absolute;
background: var(--jc-ink-primary);
}
body.jja-body .jm-read .entry-content .jj-stylemap__axis--x {
left: 13%;
right: 13%;
top: 50%;
height: 1px;
}
body.jja-body .jm-read .entry-content .jj-stylemap__axis--y {
top: 8%;
bottom: 8%;
left: 50%;
width: 1px;
}
body.jja-body .jm-read .entry-content .jj-stylemap__end {
position: absolute;
white-space: nowrap;
}
body.jja-body .jm-read .entry-content .jj-stylemap__end--top { top: 2%; left: 50%; transform: translateX(-50%); }
body.jja-body .jm-read .entry-content .jj-stylemap__end--bottom { bottom: 2%; left: 50%; transform: translateX(-50%); }
body.jja-body .jm-read .entry-content .jj-stylemap__end--left { left: 2%; top: 50%; transform: translateY(-50%); }
body.jja-body .jm-read .entry-content .jj-stylemap__end--right { right: 2%; top: 50%; transform: translateY(-50%); }
body.jja-body .jm-read .entry-content .jj-stylemap__origin {
position: absolute;
left: 50%;
top: 50%;
padding: 10px 0 0 10px;
font-weight: 400;
color: var(--jc-ink-secondary);
white-space: nowrap;
}
body.jja-body .jm-read .entry-content .jj-stylemap__origin::before {
content: "";
position: absolute;
left: -4px;
top: -4px;
width: 8px;
height: 8px;
border-radius: 50%;
background: var(--jc-ink-primary);
}
body.jja-body .jm-read .entry-content .jj-stylemap__car {
position: absolute;
left: var(--x, 50%);
top: var(--y, 50%);
width: 15%;
transform: translate(-50%, -50%);
text-align: center;
}
body.jja-body .jm-read .entry-content .jj-stylemap__car img {
display: block;
width: 100%;
max-width: none;
height: auto;
margin: 0;
}
body.jja-body .jm-read .entry-content .jj-stylemap__car b {
display: block;
margin-top: 2px;
font-weight: 700;
white-space: nowrap;
}
body.jja-body .jm-read .entry-content .jj-stylemap--plot .jj-stylemap__car {
opacity: .38;
filter: grayscale(1);
}
body.jja-body .jm-read .entry-content .jj-stylemap__line {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
fill: none;
stroke: var(--jc-accent, #a8760a);
stroke-width: 1.5;
stroke-dasharray: 5 4;
vector-effect: non-scaling-stroke;
}
body.jja-body .jm-read .entry-content .jj-stylemap__line polyline {
vector-effect: non-scaling-stroke;
}
body.jja-body .jm-read .entry-content .jj-stylemap__pt {
position: absolute;
left: var(--x, 50%);
top: var(--y, 50%);
padding-right: 14px;
transform: translate(-100%, -50%);
width: max-content;
max-width: 17%;
padding: 2px 14px 2px 4px;
background: #f5f1e6;
color: var(--jc-accent, #a8760a);
text-align: right;
line-height: 1.35;
}
body.jja-body .jm-read .entry-content .jj-stylemap__pt::after {
content: "";
position: absolute;
right: -5px;
top: 50%;
width: 10px;
height: 10px;
margin-top: -5px;
border-radius: 50%;
background: var(--jc-accent, #a8760a);
}
body.jja-body .jm-read .entry-content .jj-stylemap figcaption {
margin: 8px 0 0;
}
@media (max-width: 781px) {
body.jja-body .jm-read .entry-content .jj-stylemap__plane {
aspect-ratio: 1 / 1.2;
font-size: .54rem;
letter-spacing: 0;
}
body.jja-body .jm-read .entry-content .jj-stylemap__axis--x { left: 3%; right: 3%; }
body.jja-body .jm-read .entry-content .jj-stylemap__axis--y { top: 6%; bottom: 6%; }
body.jja-body .jm-read .entry-content .jj-stylemap__end--left,
body.jja-body .jm-read .entry-content .jj-stylemap__end--right {
top: calc(50% + 4px);
transform: none;
}
body.jja-body .jm-read .entry-content .jj-stylemap__car {
width: 25%;
}
body.jja-body .jm-read .entry-content .jj-stylemap__car b {
white-space: normal;
line-height: 1.25;
}
body.jja-body .jm-read .entry-content .jj-stylemap__pt {
max-width: 30%;
}
}
body.jja-body .jm-read .entry-content .jj-stylemap__area {
position: absolute;
font: 800 clamp(.9rem, 1.6vw, 1.3rem)/1 var(--jc-serif), serif;
letter-spacing: .08em;
color: rgba(23, 26, 21, .28);
pointer-events: none;
}
body.jja-body .jm-read .entry-content .jj-stylemap__area--tl { left: 3%; top: 4%; }
body.jja-body .jm-read .entry-content .jj-stylemap__area--tr { right: 3%; top: 4%; }
body.jja-body .jm-read .entry-content .jj-stylemap__area--bl { left: 3%; bottom: 4%; }
body.jja-body .jm-read .entry-content .jj-stylemap__area--br { right: 3%; bottom: 4%; }
body.jja-body .jm-read .entry-content .jj-stylemap--plot .jj-stylemap__area {
display: none;
}
body.jja-body .jm-read .entry-content .jj-stylemap__plane {
word-break: auto-phrase;
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) .jj-corner h3 span {
display: block;
margin-top: 4px;
font: 400 .7rem/1.6 var(--jc-font), sans-serif;
letter-spacing: .04em;
color: var(--jc-ink-secondary);
}
@media (max-width: 781px) {
body.jja-body .jm-read .entry-content .jj-stylemap__end--left,
body.jja-body .jm-read .entry-content .jj-stylemap__end--right {
top: calc(50% + 4px);
bottom: auto;
}
}
body.jja-body .jm-read .entry-content .jj-stylemap,
body.jja-body .jm-read .entry-content .jj-corner {
--jj-a-retro: #7fa9a1;
--jj-a-vintage: #6e7348;
--jj-a-city: #8b8e91;
--jj-a-outdoor: #b39663;
}
body.jja-body .jm-read .entry-content .jj-stylemap__zone {
position: absolute;
width: 50%;
height: 50%;
opacity: .14;
pointer-events: none;
}
body.jja-body .jm-read .entry-content .jj-stylemap__zone--tl { left: 0; top: 0; background: var(--jj-a-retro, #7fa9a1); }
body.jja-body .jm-read .entry-content .jj-stylemap__zone--tr { right: 0; top: 0; background: var(--jj-a-vintage, #6e7348); }
body.jja-body .jm-read .entry-content .jj-stylemap__zone--bl { left: 0; bottom: 0; background: var(--jj-a-city, #8b8e91); }
body.jja-body .jm-read .entry-content .jj-stylemap__zone--br { right: 0; bottom: 0; background: var(--jj-a-outdoor, #b39663); }
body.jja-body .jm-read .entry-content .jj-stylemap__area--tl { color: var(--jj-a-retro, #7fa9a1); }
body.jja-body .jm-read .entry-content .jj-stylemap__area--tr { color: var(--jj-a-vintage, #6e7348); }
body.jja-body .jm-read .entry-content .jj-stylemap__area--bl { color: var(--jj-a-city, #8b8e91); }
body.jja-body .jm-read .entry-content .jj-stylemap__area--br { color: var(--jj-a-outdoor, #b39663); }
body.jja-body .jm-read .entry-content .jj-stylemap__area {
opacity: .85;
}
body.jja-body .jm-read .entry-content .jj-corner--retro { --jj-a: var(--jj-a-retro, #7fa9a1); }
body.jja-body .jm-read .entry-content .jj-corner--vintage { --jj-a: var(--jj-a-vintage, #6e7348); }
body.jja-body .jm-read .entry-content .jj-corner--city { --jj-a: var(--jj-a-city, #8b8e91); }
body.jja-body .jm-read .entry-content .jj-corner--outdoor { --jj-a: var(--jj-a-outdoor, #b39663); }
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full) .jj-corner[class*="jj-corner--"] h3 {
border-top-color: var(--jj-a, currentColor);
border-top-width: 4px;
}
@media (min-width: 782px) {
body.jja-body .jm-read .entry-content .jj-corner[class*="jj-corner--"]:not(:has(> .wp-block-group__inner-container)),
body.jja-body .jm-read .entry-content .jj-corner[class*="jj-corner--"] > .wp-block-group__inner-container {
border-top: 4px solid var(--jj-a, currentColor);
}
}
body.jja-body .jm-read .entry-content .jj-styles td:nth-child(2)::before { content: "色"; }
body.jja-body .jm-read .entry-content .jj-styles td:nth-child(3)::before { content: "素材"; }
body.jja-body .jm-read .entry-content .jj-styles td:nth-child(4)::before { content: "つや"; }
body.jja-body .jm-read .entry-content .jj-styles td:nth-child(5)::before { content: "古び方"; }
body.jja-body .jm-read .entry-content .jj-styles td:nth-child(6)::before { content: "主なパーツ"; }
body.jja-body .jm-read .entry-content .jj-styles td:nth-child(7)::before { content: "作例"; }
body.jja-body .jm-read .entry-content .jj-stylemap figcaption::before,
body.jja-body .jm-read .entry-content .is-style-jj-note figcaption::before {
content: none;
}
@media (min-width: 782px) {
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).wp-block-group::before {
left: clamp(7px, 3.5vw, 56px);
}
body.jja-body .jm-read .entry-content .is-style-jj-sec.jj-paper :is(.is-style-jj-section,.is-style-jj-lead,.is-style-jj-full).wp-block-group:is(:nth-of-type(even),.jj-num-right)::before {
right: clamp(7px, 3.5vw, 56px);
left: auto;
}
}
.jm-disc {
display: flex; flex-direction: column; gap: 6px;
margin: 20px 0 0;
font-family: var(--jc-font), sans-serif;
font-size: .72rem; line-height: 1.75; letter-spacing: .02em;
color: var(--jc-ink-secondary, #4a4f45);
}
.jm-disc__row { display: flex; align-items: baseline; gap: 10px; margin: 0; }
.jm-disc__tag {
flex: none;
padding: 1px 7px;
border: 1px solid currentColor;
font-size: .62rem; font-weight: 700; letter-spacing: .18em; line-height: 1.5;
}
.jm-disc__row--pr .jm-disc__tag {
border-color: transparent;
background: var(--jc-ink-primary, #141210); color: #f4f1e9;
}
.jm-disc a { color: inherit; text-underline-offset: .2em; }
@media (min-width: 900px) {
.jm-opener__inner:has(.jm-disc) .jm-opener__title,
.jm-opener__inner:has(.jm-disc) .jm-opener__lede { grid-row: 2; }
.jm-disc { grid-column: 2 / 12; grid-row: 3; margin-top: 24px; }
}
@media (min-width: 900px) and (max-width: 1180px) {
.jm-disc { grid-column: 1 / 9; }
}
@media (min-width: 900px) {
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-opener:has(.jm-opener__img) .jm-opener__inner:has(.jm-disc) .jm-opener__lede { grid-row: 3; }
body.jja-body.jc-article-page:not(:has(.jj-flip)):not(:has(.jm-mag)) .jm-opener:has(.jm-opener__img) .jm-disc { grid-row: 4; }
}
body.jja-body.jc-article-page .jm-opener:has(.jm-opener__img) .jm-disc { color: rgba(244, 241, 233, .9); }
body.jja-body.jc-article-page .jm-opener:has(.jm-opener__img) .jm-disc__row--pr .jm-disc__tag {
background: #f4f1e9; color: #141210;
}
.jj-pr-tag {
display: inline-block; flex: none;
margin-left: 8px; padding: 2px 7px;
background: var(--jc-accent, #c9930f); color: #141210;
font-family: var(--jc-font, sans-serif), sans-serif;
font-size: .56rem; font-weight: 700; letter-spacing: .2em; line-height: 1.2;
text-shadow: none; vertical-align: middle;
}
.jjx-send .jjx-send__a {
min-width: 150px; height: 44px;
border: 1px solid var(--jjx-gold); border-radius: 0;
background: transparent; color: var(--jjx-gold);
font-weight: 400; font-size: 15px; letter-spacing: .3em; text-indent: .3em;
transition: background-color .15s ease, color .15s ease;
}
.jjx-send .jjx-send__a:hover,
.jjx-send .jjx-send__a:focus-visible {
background: var(--jjx-gold); color: #141210;
filter: none; transform: none;
}
body.jja-body.jj-cat-page.jj-is-eventpage.jj-is-info .jj-bar .jj-topnav a[href*="/category/event/"],
body.jja-body.jj-cat-page.jj-is-eventpage.jj-is-contact .jj-bar .jj-topnav a[href*="/category/event/"] {
opacity: .82;
box-shadow: none;
}
body.jja-body.jj-cat-page.jj-is-eventpage.jj-is-info .jj-bar .jj-topnav a[href*="/category/event/"]:hover,
body.jja-body.jj-cat-page.jj-is-eventpage.jj-is-contact .jj-bar .jj-topnav a[href*="/category/event/"]:hover { opacity: 1; }
.jjf .jje-form__row.jjc-row--kind { grid-column: span 8; }
.jjf .jje-form__row.jjc-row--full { grid-column: span 12; }
@media (max-width: 760px) {
.jjf .jje-form__row.jjc-row--kind { grid-column: span 12; }
}
body.jja-body:has(.jj-doc--plain) .jj-wall { display: none; }
body.jja-body:has(.jj-doc--plain) { background: #f4f1e9; }
body.jja-body:has(.jj-doc--plain)::before { display: none; }
body.jja-body:has(.jj-doc--plain) .jj-bar {
background: rgba(244, 241, 233, .94);
border-bottom: 1px solid rgba(23, 23, 20, .1);
}
body.jja-body:has(.jj-doc--plain) .jj-bar :is(a, strong, span, .jj-bar__logo) { color: #111111; }
body.jja-body.jj-cat-page:has(.jj-doc--plain) .jj-bar.is-solid .jj-bar__logo,
body.jja-body.jj-cat-page:has(.jj-doc--plain) .jj-bar.is-solid .jj-trigger,
body.jja-body:has(.jj-doc--plain) .jj-bar .jj-bar__logo,
body.jja-body:has(.jj-doc--plain) .jj-bar .jj-trigger { color: #111111; }
body.jja-body.jj-cat-page:has(.jj-doc--plain) .jj-bar.is-solid .jj-trigger i,
body.jja-body:has(.jj-doc--plain) .jj-trigger i { background: #111111; }
body.jja-body .jj-doc--plain .jj-sheet { box-shadow: none; }
body.jja-body .jj-doc--plain .entry-content a { word-break: break-all; }
.jjf .jjf-info__head { display: block; padding-bottom: 16px; }
.jjf .jjf-info__kick { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; margin: 0 0 12px; }
.jjf .jjf-info__kick b { font-family: var(--jc-logo), sans-serif; font-weight: 400; font-size: 18px; line-height: 1; letter-spacing: .06em; }
.jjf .jjf-info__kick span { font-family: var(--jc-serif), serif; font-size: 13px; letter-spacing: .12em; }
.jjf .jjf-info__kick time { margin-left: auto; font-family: var(--jc-mono, monospace), monospace; font-size: 11px; letter-spacing: .1em; color: #4d4b46; }
.jjf .jjf-info__title { margin: 0; font-family: var(--jc-serif), serif; font-weight: 800; font-size: clamp(20px, 2.4vw, 26px); line-height: 1.5; letter-spacing: .04em; }
body.jja-body .jjf--info .jjf__body.jm-read { max-width: none; margin: 0; padding: 18px 0 26px; background: none; }
body.jja-body .jjf--info .jjf__body.jm-read .entry-content,
body.jja-body .jjf--info .jjf__body.jm-read .entry-content :is(p, li) { font-family: var(--jc-serif), serif; }
@media (min-width: 1101px) {
.jj-catfoot .jj-catfoot__grid { grid-template-columns: repeat(4, var(--jj-plate-w)); }
}