:root{--color-bg:#F6FAFD;--color-bg-alt:#E8F2F9;--color-ink:#17456B;--color-text:#2B3B47;--color-text-soft:#54697A;--color-accent:#2E93CE;--color-accent-soft:#A8D3EC;--color-accent-deep:#16628F;--color-line:#C6DDEC;--color-line-soft:#E2EFF7;--color-yellow:#F0B52A;--font-serif-jp:"Shippori Mincho","游明朝","Yu Mincho",serif;--font-sans-jp:"Noto Sans JP","游ゴシック",sans-serif;--font-serif-en:"Cormorant Garamond",serif}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--color-bg);color:var(--color-text);font-family:var(--font-sans-jp);font-size:17px;line-height:2;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
a:hover{color:var(--color-accent-deep)}
img{max-width:100%;display:block}
.wrap{max-width:1120px;margin:0 auto;padding:0 28px}
.ch-head{position:sticky;top:0;z-index:50;background:rgba(246,250,253,0.95);backdrop-filter:blur(8px);border-bottom:1px solid var(--color-line)}
.ch-head-in{max-width:1240px;margin:0 auto;padding:14px 28px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.ch-logo{font-family:var(--font-serif-jp);font-size:19px;letter-spacing:0.14em;color:var(--color-ink);line-height:1.25;white-space:nowrap}
.ch-logo small{display:block;font-family:var(--font-serif-en);font-size:9.5px;letter-spacing:0.28em;color:var(--color-text-soft)}
.ch-nav{display:flex;align-items:center;gap:22px;font-size:14.5px;flex-wrap:wrap;justify-content:flex-end}
.ch-nav a.is-current{color:var(--color-accent-deep);border-bottom:1px solid var(--color-accent)}
.ch-nav-cta{background:var(--color-ink);color:#fff!important;border-radius:999px;padding:9px 20px;font-size:13px;letter-spacing:0.04em}
.ch-nav-cta:hover{background:var(--color-accent-deep)}
.crumb{font-size:13px;color:var(--color-text-soft);padding:22px 0 0;display:flex;gap:8px;flex-wrap:wrap}
.crumb span{color:var(--color-line);}
.col-hero{padding:56px 0 44px;text-align:center;border-bottom:1px solid var(--color-line)}
.col-hero .label{font-family:var(--font-serif-en);font-size:13px;letter-spacing:0.35em;font-style:italic;color:var(--color-accent-deep);margin-bottom:14px}
.col-hero h1{font-family:var(--font-serif-jp);font-size:clamp(26px,3.4vw,38px);font-weight:600;color:var(--color-ink);letter-spacing:0.05em;line-height:1.55}
.col-hero p{margin:18px auto 0;max-width:660px;font-size:17px;line-height:2.1;text-align:left}
.filters{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:40px 0 36px}
.filters button{font-family:inherit;font-size:14.5px;color:var(--color-text);background:transparent;border:1px solid var(--color-line);border-radius:999px;padding:8px 20px;cursor:pointer;transition:0.2s}
.filters button:hover{border-color:var(--color-accent-soft)}
.filters button.on{background:var(--color-ink);border-color:var(--color-ink);color:#fff}
.col-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(310px,1fr));gap:22px;padding-bottom:80px}
.col-card{display:flex;flex-direction:column;gap:12px;background:#fff;border:1px solid var(--color-line);border-radius:4px;padding:26px 24px 24px;transition:0.25s}
.col-card:hover{border-color:var(--color-accent-soft);transform:translateY(-2px);box-shadow:0 10px 28px rgba(61,90,42,0.07)}
.col-card .cat{align-self:flex-start;font-size:12.5px;letter-spacing:0.08em;color:var(--color-accent-deep);background:var(--color-bg-alt);border-radius:999px;padding:4px 12px}
.col-card h2{font-family:var(--font-serif-jp);font-size:19px;font-weight:600;color:var(--color-ink);line-height:1.65;letter-spacing:0.02em}
.col-card p{font-size:15px;line-height:1.95;color:var(--color-text-soft);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.col-card .more{margin-top:auto;font-size:12.5px;color:var(--color-accent-deep);letter-spacing:0.06em}
.art{max-width:760px;margin:0 auto;padding:0 28px 90px}
.art-head{padding:34px 0 30px;border-bottom:1px solid var(--color-line)}
.art-head .cat{display:inline-block;font-size:12.5px;letter-spacing:0.08em;color:var(--color-accent-deep);background:var(--color-bg-alt);border-radius:999px;padding:4px 13px;margin-bottom:16px}
.art-head h1{font-family:var(--font-serif-jp);font-size:clamp(23px,3vw,32px);font-weight:600;color:var(--color-ink);line-height:1.6;letter-spacing:0.03em}
.toc{background:var(--color-bg-alt);border-radius:4px;padding:26px 28px;margin:34px 0 44px}
.toc-t{font-family:var(--font-serif-jp);font-size:14.5px;color:var(--color-ink);letter-spacing:0.1em;margin-bottom:12px}
.toc ol{margin:0;padding-left:1.3em;font-size:16px;line-height:2}
.toc li{margin-bottom:5px}
.toc a:hover{color:var(--color-accent-deep);text-decoration:underline}
.art-body h2{font-family:var(--font-serif-jp);font-size:clamp(20px,2.4vw,24px);font-weight:600;color:var(--color-ink);line-height:1.6;letter-spacing:0.03em;margin:56px 0 22px;padding-bottom:12px;border-bottom:1px solid var(--color-line);scroll-margin-top:90px}
.art-body h3{font-family:var(--font-serif-jp);font-size:17.5px;font-weight:600;color:var(--color-accent-deep);line-height:1.7;margin:38px 0 14px}
.art-body p{font-size:17.5px;line-height:2.15;margin-bottom:26px;text-wrap:pretty}
.art-body .point-list{list-style:none;margin:0 0 26px;display:grid;gap:14px}
.art-body .point-list li{background:#fff;border:1px solid var(--color-line);border-left:4px solid var(--color-accent);border-radius:4px;padding:18px 22px;font-size:16.5px;line-height:2}
.art-body .point-list strong{display:block;font-family:var(--font-serif-jp);font-size:17px;color:var(--color-ink);margin-bottom:4px}
.art-cta{background:var(--color-ink);color:#fff;border-radius:5px;padding:44px 40px;margin:64px 0 0;text-align:center}
.art-cta h2{font-family:var(--font-serif-jp);font-size:clamp(20px,2.5vw,25px);font-weight:600;line-height:1.6;margin-bottom:14px;letter-spacing:0.03em}
.art-cta p{font-size:16px;line-height:2.05;color:#D5E8F5;margin-bottom:26px}
.art-cta .btns{display:flex;flex-wrap:wrap;gap:14px;justify-content:center}
.art-cta a{border-radius:999px;padding:16px 32px;font-size:15.5px;letter-spacing:0.04em}
.art-cta .p{background:var(--color-yellow);color:#3D3218!important}
.art-cta .s{border:1px solid rgba(255,255,255,0.5);color:#fff!important}
.art-cta .p:hover{background:#F7CB5C}
.rel{margin-top:70px}
.rel-t{font-family:var(--font-serif-jp);font-size:18px;color:var(--color-ink);letter-spacing:0.08em;margin-bottom:20px;padding-bottom:12px;border-bottom:1px solid var(--color-line)}
.rel ul{list-style:none;display:grid;gap:2px}
.rel li a{display:flex;gap:14px;align-items:baseline;padding:16px 4px;border-bottom:1px solid var(--color-line-soft);font-size:16px;line-height:1.85}
.rel li a:hover{background:var(--color-bg-alt)}
.rel li .c{font-size:11px;color:var(--color-accent-deep);white-space:nowrap;background:var(--color-bg-alt);border-radius:999px;padding:3px 10px}
.back{margin-top:44px;text-align:center;font-size:13.5px;color:var(--color-accent-deep)}
.ch-foot{background:var(--color-ink);color:#D5E8F5;padding:52px 28px 34px;text-align:center;font-size:13.5px;line-height:2}
.ch-foot .fl{font-family:var(--font-serif-jp);font-size:20px;color:#fff;letter-spacing:0.16em;margin-bottom:8px}
.ch-foot .fl small{display:block;font-family:var(--font-serif-en);font-size:9.5px;letter-spacing:0.3em;color:var(--color-accent-soft);margin-top:5px}
.ch-foot nav a{font-size:13.5px}
.ch-foot .cp{color:#8FB2C9}
.ch-foot nav{display:flex;flex-wrap:wrap;gap:18px;justify-content:center;margin:22px 0 20px;font-size:12.5px}
.ch-foot nav a{color:#EAF3DC}
.ch-foot .cp{margin-top:18px;font-size:11px;color:#9FB784;letter-spacing:0.08em}
@media (max-width:840px){.ch-nav{gap:14px;font-size:12.5px}}
@media (max-width:640px){
 .ch-head-in{flex-direction:column;align-items:flex-start;gap:10px;padding:12px 20px}
 .ch-nav{gap:12px;font-size:12px;justify-content:flex-start}
 .ch-nav-cta{padding:7px 15px;font-size:12px}
 .wrap{padding:0 20px}
 .col-hero{padding:36px 0 30px}
 .col-grid{grid-template-columns:1fr;gap:16px;padding-bottom:56px}
 .art{padding:0 20px 60px}
 .art-body p{font-size:15.5px}
 .art-cta{padding:32px 22px}
 .art-cta .btns a{width:100%}
 .toc{padding:20px 20px}
}
.col-card{padding:0;overflow:hidden}
.col-card .thumb{aspect-ratio:16/9;overflow:hidden;background:var(--color-bg-alt)}
.col-card .thumb img{width:100%;height:100%;object-fit:cover;transition:transform 0.5s ease}
.col-card:hover .thumb img{transform:scale(1.04)}
.col-card .body{display:flex;flex-direction:column;gap:11px;padding:22px 24px 26px;flex:1}
.art-eyecatch{margin:0 0 34px;border-radius:5px;overflow:hidden;aspect-ratio:16/7}
.art-eyecatch img{width:100%;height:100%;object-fit:cover}
.art-lead{background:var(--color-bg-alt);border-left:4px solid var(--color-accent);border-radius:0 4px 4px 0;padding:24px 28px;margin:0 0 8px;font-size:17px;line-height:2.1}
.art-body h2{counter-increment:sec;position:relative}
.art-body{counter-reset:sec}
.art-body h2::before{content:counter(sec,decimal-leading-zero);display:inline-block;font-family:var(--font-serif-en);font-style:italic;font-size:0.72em;color:var(--color-accent);margin-right:14px;letter-spacing:0.04em}
.art-body h3{padding-left:15px;border-left:3px solid var(--color-accent-soft)}
@media (max-width:640px){.art-eyecatch{aspect-ratio:16/9;margin-bottom:26px}.art-lead{padding:20px 20px;font-size:16px}.col-card .body{padding:18px 20px 22px}}