:root{color:#14261f;background:#faf9f5;font-family:"Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN",sans-serif;line-break:strict;word-break:normal;font-synthesis:none}*{box-sizing:border-box;min-width:0}body{margin:0}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}a:focus-visible,button:focus-visible{outline:3px solid #d4a62f;outline-offset:5px}p{font-size:1.125rem;line-height:1.85}h1,h2,h3,p,figure{margin:0}img{display:block;max-width:100%}.skip{position:absolute;left:20px;top:-100px;z-index:50;padding:15px;background:white;color:black}.skip:focus{top:10px}.masthead{height:124px;padding:0 4.2%;display:flex;align-items:center;gap:36px;position:relative;z-index:3}.identity{display:flex;align-items:center;gap:13px;flex-shrink:0}.identity img{width:60px;height:60px;object-fit:contain}.identity b{font-family:"Hiragino Mincho ProN","Yu Mincho",serif;font-weight:600;font-size:2rem;letter-spacing:.12em;display:block;white-space:nowrap}.identity small{display:block;font-size:.65rem;letter-spacing:.3em;margin-top:7px}.identity em{font-style:normal;font-size:.875rem;writing-mode:vertical-rl;margin-left:6px;letter-spacing:.12em}.masthead nav{margin-left:auto;display:flex;gap:28px;font-size:1rem}.masthead nav a{padding:14px 0}.menu-button{border:1px solid currentColor;color:inherit;background:none;width:52px;height:52px;display:grid;align-content:center;gap:7px;padding:15px;border-radius:50%}.menu-button span{display:block;height:1px;background:currentColor}.hero{position:relative;isolation:isolate;min-height:720px;height:calc(100svh - 124px);max-height:1100px;overflow:hidden}.hero-photo{position:absolute;inset:0;z-index:-2}.hero-photo>img{width:100%;height:100%;object-fit:cover}.hero-photo figcaption{position:absolute;right:25px;bottom:22px;font-size:.75rem;letter-spacing:.06em;color:white;background:#18201acc;padding:5px 10px;z-index:3}.hero-copy{position:relative;z-index:1}.chapter{font-size:1rem;letter-spacing:.12em;margin-bottom:25px}h1{font-family:"Hiragino Mincho ProN","Yu Mincho",serif;font-weight:500;letter-spacing:.025em;line-height:1.45;font-size:clamp(3rem,5.4vw,6.3rem)}h1 span{display:block}.role{margin-top:30px;font-size:1rem;letter-spacing:.1em}.more{display:flex;align-items:center;justify-content:space-between;gap:35px;width:260px;max-width:100%;padding:18px 0;border-bottom:1px solid currentColor;margin-top:32px;font-size:1rem}.more span{font-size:1.5rem}.pha{position:absolute;width:132px;height:132px;z-index:2}.hero-bottom{position:absolute;bottom:28px;left:4.5%;display:flex;gap:65px;align-items:center;font-size:.75rem;letter-spacing:.2em}.hero-bottom a{font-size:1rem;letter-spacing:.08em;padding:12px 0}.black{background:#121413;color:#f8f6ee}.black .identity img{background:#faf9f5;border-radius:50%;padding:5px}.black .hero-photo{left:23%}.black .hero-photo:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#121413 0%,transparent 40%)}.black .hero-photo>img{object-position:65% 43%}.black .hero-copy{padding:115px 0 170px 6.5%}.black h1{font-size:clamp(3rem,5.2vw,6rem)}.black .pha{left:6.5%;bottom:100px;width:108px;height:108px}.black .hero-bottom{left:6.5%}.nature .masthead{background:#f9f8f1}.nature .hero{min-height:750px;color:#fff}.nature .hero-photo>img{object-position:50% 36%}.nature .hero-photo:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(13,28,14,.54),transparent 62%),linear-gradient(0deg,rgba(8,25,14,.6),transparent 45%)}.nature .hero-copy{position:absolute;left:5.5%;bottom:118px}.nature h1{font-size:clamp(3rem,5.5vw,6rem)}.nature .chapter{margin-bottom:20px}.nature .role{margin-top:20px}.nature .pha{right:4.5%;top:35px;width:146px;height:146px}.nature .hero-bottom{left:5.5%}.white{background:#f6f7f3;color:#142e4b}.white .hero{margin:0 4.2%;height:calc(100svh - 145px);min-height:740px;border-top:1px solid #bcc5c9}.white .hero-photo{inset:65px 0 85px 50%;background:#e9f0f4}.white .hero-photo>img{object-position:50% 30%}.white .hero-copy{padding:65px 0 230px 2%}.white h1{font-size:clamp(3rem,5vw,5.8rem)}.white .pha{left:39%;bottom:125px;width:125px;height:125px}.white .editorial-word{font-family:Georgia,serif;font-style:italic;position:absolute;left:2%;bottom:100px;font-size:clamp(4rem,8vw,8rem);line-height:1;color:#183c62}.white .hero-bottom{left:2%}.policies{padding:100px 6.5% 115px;background:#f5f4ed;color:#172b23}.section-heading{display:grid;grid-template-columns:1fr 2fr 1fr;align-items:end;gap:35px;margin-bottom:55px}.section-heading>span{font-size:.8rem;letter-spacing:.14em;align-self:start}.section-heading h2{font-family:"Hiragino Mincho ProN","Yu Mincho",serif;font-size:2.5rem;line-height:1.5;font-weight:500}.section-heading>a{padding:14px 0;justify-self:end}.policy-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0 35px}.policy-card{border-top:1px solid #a3ada6;padding:26px 0;display:grid;grid-template-columns:28px 1fr 20px;gap:12px;align-items:start}.policy-card>span{font-size:.8rem;padding-top:5px}.policy-card h3{font-size:1.125rem;font-weight:500;line-height:1.7}.policy-card b{font-weight:400}.black .policies{background:#1d2420;color:#f8f6ee}.white .policies{background:#e7edf0;color:#142e4b}footer{padding:60px 6.5%;display:flex;justify-content:space-between;gap:40px}footer strong{font-size:1.25rem;font-weight:500}footer p{margin-top:18px;font-size:1rem}footer a{display:inline-block;padding:8px 0;text-decoration:underline;text-underline-offset:5px}.review-note p{font-size:.875rem;margin-top:0}.review-note>a{display:block;font-size:1rem}dialog{border:0;padding:70px 45px 35px;width:min(520px,90vw);max-height:85svh;color:#172b23;background:#faf9f5}dialog::backdrop{background:#0009;backdrop-filter:blur(8px)}dialog .close{position:absolute;right:20px;top:15px;padding:10px;border:0;background:transparent}dialog nav{display:grid;margin-top:25px}dialog nav a{padding:17px 0;border-top:1px solid #c4ccc4;font-size:1.125rem}.gallery{background:#f3f2ed;color:#1d2c27}.gallery header{padding:35px 5%;display:flex;justify-content:space-between;align-items:center}.gallery header>p{font-size:.75rem;letter-spacing:.12em}.gallery main{padding:55px 5%}.gallery-intro{margin-bottom:55px}.gallery-intro>span{font-size:1rem}.gallery h1{font-size:4rem;margin:14px 0}.variants{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}.thumb{aspect-ratio:4/3;position:relative;overflow:hidden}.thumb img{width:100%;height:100%;object-fit:cover}.thumb>span{position:absolute;left:20px;top:15px;color:white;font-family:Georgia,serif;font-size:2rem;text-shadow:0 1px 8px #000}.variant-label{display:flex;align-items:center;gap:20px;padding:23px 0;border-bottom:1px solid #adb7af}.variant-label h2{font-size:1.5rem;font-weight:500}.variant-label p{font-size:1rem}.variant-label b{margin-left:auto}.gallery-note{margin-top:45px;font-size:1rem;max-width:650px}
@media(min-width:1600px){.black .hero-copy{padding-top:160px}.nature .hero-copy{bottom:150px}}
@media(max-width:1000px){.masthead nav{display:none}.menu-button{margin-left:auto}.identity em{display:none}.black .hero-copy{padding-left:5%}.black h1,.nature h1,.white h1{font-size:3.4rem}.section-heading{grid-template-columns:1fr 2fr}.section-heading>a{grid-column:2;justify-self:start}.policy-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.masthead{height:98px;padding:0 21px;gap:10px}.identity{gap:8px}.identity img{width:43px;height:43px}.identity b{font-size:1.5rem;letter-spacing:.08em}.identity small{font-size:.5rem;letter-spacing:.22em;margin-top:5px}.menu-button{width:44px;height:44px;padding:12px;flex-shrink:0}.hero{height:calc(100svh - 98px);min-height:690px;max-height:none}.chapter{font-size:.8rem;letter-spacing:.04em;margin-bottom:12px}.black h1,.nature h1,.white h1{font-size:2.55rem;line-height:1.4;letter-spacing:.01em}.role{font-size:.875rem;margin-top:17px}.more{font-size:1rem;margin-top:15px;padding:10px 0;width:230px}.hero-photo figcaption{font-size:.6rem;right:12px;bottom:12px}.hero-bottom{display:none}.black .hero-photo{inset:0 0 0 -28%}.black .hero-photo>img{object-position:66% 30%}.black .hero-photo:after{background:linear-gradient(0deg,#121413 0%,#121413df 22%,transparent 65%)}.black .hero-copy{position:absolute;bottom:42px;left:24px;padding:0}.black .pha{width:83px;height:83px;left:auto;right:20px;top:20px;bottom:auto}.nature .hero{min-height:740px}.nature .hero-photo{inset:0 -22% 0 -45%}.nature .hero-photo>img{object-position:60% 40%}.nature .hero-photo:after{background:linear-gradient(0deg,#092719e8 0%,#092719a6 22%,transparent 60%)}.nature .hero-copy{left:24px;bottom:45px}.nature .pha{width:100px;height:100px;right:18px;top:20px}.white .hero{margin:0 21px;height:auto;min-height:880px;overflow:hidden}.white .hero-copy{padding:28px 0 0}.white .hero-photo{inset:310px 0 60px 18px}.white .hero-photo>img{object-position:50% 20%}.white .pha{left:0;bottom:66px;width:95px;height:95px}.white .editorial-word{font-size:3.5rem;left:0;bottom:4px}.white .hero-photo figcaption{font-size:.6rem}.policies{padding:55px 24px 60px}.section-heading{display:block;margin-bottom:30px}.section-heading h2{font-size:2rem;margin-top:22px}.section-heading>a{display:inline-block;margin-top:18px}.policy-grid{grid-template-columns:1fr;gap:0}.policy-card{padding:21px 0}.policy-card h3{font-size:1.125rem}footer{display:block;padding:45px 24px}.review-note{margin-top:35px}.gallery header{padding:25px}.gallery header>p{display:none}.gallery main{padding:30px 25px}.gallery h1{font-size:3rem}.variants{grid-template-columns:1fr;gap:40px}.gallery-intro{margin-bottom:35px}}
.zoomed .masthead{height:auto;min-height:124px;flex-wrap:wrap;padding:22px}.zoomed .identity{flex-shrink:1}.zoomed .identity b{white-space:normal}.zoomed .identity img{width:45px;flex-shrink:0}.zoomed .masthead nav{display:none}.zoomed .hero{height:auto;min-height:0;margin:0}.zoomed .hero-photo,.zoomed .black .hero-photo,.zoomed .nature .hero-photo,.zoomed .white .hero-photo{position:relative;inset:auto;height:400px}.zoomed .hero-photo:after{display:none}.zoomed .hero-copy,.zoomed .black .hero-copy,.zoomed .nature .hero-copy,.zoomed .white .hero-copy{position:relative;inset:auto;padding:30px 24px 45px}.zoomed .nature .hero-copy{background:#183b29}.zoomed h1{font-size:2rem!important}.zoomed h1 span{display:inline}.zoomed .pha{position:relative!important;inset:auto!important;margin:0 24px 30px;width:120px!important;height:120px!important}.zoomed .hero-bottom,.zoomed .editorial-word{display:none}.zoomed .section-heading,.zoomed .policy-grid,.zoomed footer,.zoomed .variants,.zoomed .gallery header{display:block}.zoomed .identity em{display:none}.zoomed .gallery h1{font-size:2rem}.zoomed .variant-label{flex-wrap:wrap}.zoomed .more{width:auto}.zoomed footer a{overflow-wrap:anywhere}
@media(prefers-reduced-motion:no-preference){a{transition:opacity .2s}a:hover{opacity:.8}}
/* 写真の距離に合わせた最終構図 */
.identity em{writing-mode:horizontal-tb;font-size:.75rem;letter-spacing:.12em;margin:0 0 0 12px;white-space:nowrap}
@media(min-width:1001px){.nature .hero-copy{bottom:105px;right:5.5%}.nature h1 span{display:inline}.nature h1 span+span{margin-left:.35em}.nature h1{font-size:5.5vw}.nature .chapter{margin-bottom:8px}.nature .role{margin-top:15px}.nature .more{position:absolute;right:0;bottom:0}.nature .hero-photo:after{background:linear-gradient(0deg,#0c211ced 0%,#0c211c70 32%,transparent 65%)}.nature .hero-photo>img{object-position:50% 25%}}
@media(max-width:600px){.black .hero{min-height:710px}.black .hero-photo{inset:0;height:540px}.black .hero-photo>img{object-position:70% 35%}.black .hero-photo:after{background:linear-gradient(0deg,#121413,transparent 62%)}.black .hero-copy{bottom:32px}.black .pha{width:76px;height:76px;left:20px;right:auto;top:25px}.nature .hero{height:auto;min-height:760px;background:#173b2a}.nature .hero-photo{inset:0;height:445px}.nature .hero-photo>img{object-position:43% 40%}.nature .hero-photo:after{background:linear-gradient(0deg,#173b2a,transparent 35%)}.nature .hero-copy{top:475px;bottom:auto}.nature .pha{width:90px;height:90px;left:24px;right:auto;top:366px}.nature .hero-photo figcaption{bottom:auto;top:15px;right:10px}.white .hero{min-height:850px}.white .hero-photo{bottom:60px}.white .pha{bottom:65px}}
.zoomed .nature .hero-copy{top:auto}.zoomed .nature .hero-photo,.zoomed .black .hero-photo{height:400px}.zoomed .identity em{display:none}

/* PC：キャッチに対する文字階層。装飾以外を小さな固定値にしない。 */
@media (min-width:1001px){
  :root:not(.zoomed) .masthead{gap:24px}
  :root:not(.zoomed) .identity b{font-size:clamp(2.25rem,2.8vw,3rem)}
  :root:not(.zoomed) .identity small{font-size:.8rem;letter-spacing:.24em}
  :root:not(.zoomed) .identity em{font-size:1rem;margin-left:8px}
  :root:not(.zoomed) .identity img{width:70px;height:70px}
  :root:not(.zoomed) .masthead nav{font-size:clamp(1.125rem,1.3vw,1.375rem);gap:24px}
  :root:not(.zoomed) .chapter{font-size:clamp(1.25rem,1.65vw,1.75rem);letter-spacing:.07em;margin-bottom:22px}
  :root:not(.zoomed) .role{font-size:clamp(1.375rem,1.8vw,1.875rem);letter-spacing:.06em;margin-top:23px}
  :root:not(.zoomed) .more{font-size:clamp(1.25rem,1.5vw,1.5rem);width:310px;margin-top:26px;padding:15px 0}
  :root:not(.zoomed) .more span{font-size:1.9rem}
  :root:not(.zoomed) .hero-bottom{font-size:1rem;letter-spacing:.14em;gap:40px}
  :root:not(.zoomed) .hero-bottom a{font-size:1.25rem}
  :root:not(.zoomed) .black .hero-copy{padding-top:85px}
  :root:not(.zoomed) .black .pha{left:calc(6.5% + 345px);bottom:110px}
  :root:not(.zoomed) .nature .chapter{margin-bottom:10px}
  :root:not(.zoomed) .nature .role{margin-top:14px}
  :root:not(.zoomed) .white .editorial-word{font-size:clamp(4rem,6.5vw,6.5rem)}
  :root:not(.zoomed) .section-heading>span{font-size:1rem}
  :root:not(.zoomed) .section-heading h2{font-size:clamp(2.5rem,3.3vw,3.5rem)}
  :root:not(.zoomed) .section-heading>a{font-size:1.25rem}
  :root:not(.zoomed) .policy-card h3{font-size:1.375rem}
  :root:not(.zoomed) .policy-card>span{font-size:1rem}
  :root:not(.zoomed) footer p{font-size:1.125rem}
  :root:not(.zoomed) footer strong{font-size:1.5rem}
}
@media(min-width:1001px) and (max-width:1250px){
 :root:not(.zoomed) .identity em{display:none}
 :root:not(.zoomed) .masthead nav{gap:18px}
 :root:not(.zoomed) .nature .more{width:260px}
}

/* 写真から始まり、スクロール時だけGlassになるヘッダー */
:root:not(.zoomed) .masthead{position:fixed;inset:0 0 auto;height:112px;background:transparent;z-index:10;transition:background .25s,backdrop-filter .25s,box-shadow .25s}
:root:not(.zoomed) .has-scrolled .masthead{background:rgba(249,249,244,.78);backdrop-filter:blur(22px) saturate(140%);-webkit-backdrop-filter:blur(22px) saturate(140%);box-shadow:0 1px 0 #18271d20;color:#14261f}
:root:not(.zoomed) .black.has-scrolled .masthead{background:rgba(18,20,19,.74);color:#f8f6ee;box-shadow:0 1px 0 #ffffff24}
:root:not(.zoomed) .hero{height:100svh;min-height:850px;max-height:1200px;margin:0;border:0}
:root:not(.zoomed) .hero-photo{inset:0;height:100%}
:root:not(.zoomed) .black .hero-photo:after{background:linear-gradient(90deg,#121413ed,transparent 75%),linear-gradient(180deg,#12141399,transparent 22%)}
:root:not(.zoomed) .black .hero-photo>img{object-position:66% 35%}
:root:not(.zoomed) .black .hero-copy{padding-top:200px}
:root:not(.zoomed) .nature .masthead{color:#fff;text-shadow:0 1px 7px #0009}
:root:not(.zoomed) .nature .identity img{background:#faf9f5;border-radius:50%;padding:5px}
:root:not(.zoomed) .nature.has-scrolled .masthead{color:#14261f;text-shadow:none}
:root:not(.zoomed) .nature .hero-photo:after{background:linear-gradient(180deg,#102718bb,transparent 26%),linear-gradient(0deg,#0c211ced,#0c211c50 35%,transparent 65%)}
:root:not(.zoomed) .nature .pha{top:145px}
:root:not(.zoomed) .white .hero-photo{background:#fff}
:root:not(.zoomed) .white .hero-photo>img{object-fit:contain;object-position:right center}
:root:not(.zoomed) .white .hero-photo:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#f6f7f3 0%,#f6f7f3ed 25%,transparent 62%)}
:root:not(.zoomed) .white .hero-copy{padding:190px 0 230px 6.5%}
:root:not(.zoomed) .white .editorial-word{left:6.5%}
:root:not(.zoomed) .white .hero-bottom{left:6.5%}
:root:not(.zoomed) .white .pha{left:40%}
#policies{scroll-margin-top:130px}
@media(max-width:1000px){:root:not(.zoomed) .white .hero-copy{padding-top:180px}}
@media(max-width:600px){
 :root:not(.zoomed) .masthead{height:98px}
 :root:not(.zoomed) .hero{height:100svh;min-height:800px;max-height:none}
 :root:not(.zoomed) .hero-photo{inset:0;height:100%}
 :root:not(.zoomed) .black .hero-photo>img{object-position:69% 20%}
 :root:not(.zoomed) .black .hero-photo:after{background:linear-gradient(0deg,#121413 0%,#121413c9 25%,transparent 70%),linear-gradient(180deg,#12141388,transparent 20%)}
 :root:not(.zoomed) .black .hero-copy,:root:not(.zoomed) .nature .hero-copy,:root:not(.zoomed) .white .hero-copy{position:absolute;top:auto;bottom:40px;left:24px;right:20px;padding:0}
 :root:not(.zoomed) .black .pha{top:115px}
 :root:not(.zoomed) .nature .hero-photo>img{object-position:55% 30%}
 :root:not(.zoomed) .nature .hero-photo:after{background:linear-gradient(180deg,#102718aa,transparent 24%),linear-gradient(0deg,#173b2a 0%,#173b2adb 25%,transparent 67%)}
 :root:not(.zoomed) .nature .pha{left:24px;top:115px;width:80px;height:80px}
 :root:not(.zoomed) .white .hero-photo>img{object-fit:cover;object-position:53% 20%}
 :root:not(.zoomed) .white .hero-photo:after{background:linear-gradient(0deg,#f6f7f3 0%,#f6f7f3ed 25%,transparent 68%)}
 :root:not(.zoomed) .white .pha{left:24px;top:115px;width:80px;height:80px}
 :root:not(.zoomed) .white .editorial-word{display:none}
 :root:not(.zoomed) .hero-photo figcaption{top:auto;bottom:8px;right:12px}
}
@media(prefers-reduced-motion:reduce){.masthead{transition:none!important}}

/* 横長でも写真上端を保持し、頭頂部を縦方向に切り落とさない。 */
:root:not(.zoomed) .black .hero-photo>img{object-position:66% top}
:root:not(.zoomed) .nature .hero-photo>img{object-position:50% top}
:root:not(.zoomed) .white .hero-photo>img{object-position:right top}
@media(max-width:600px){
 :root:not(.zoomed) .black .hero-photo>img{object-position:69% top}
 :root:not(.zoomed) .nature .hero-photo>img{object-position:55% top}
 :root:not(.zoomed) .white .hero-photo>img{object-position:53% top}
}
@media(min-aspect-ratio:2/1) and (min-width:1001px){
 :root:not(.zoomed) .black .hero-photo{background:#121413}
 :root:not(.zoomed) .black .hero-photo>img,
 :root:not(.zoomed) .nature .hero-photo>img{object-fit:contain;object-position:right top}
 :root:not(.zoomed) .nature .hero-photo:before{content:"";position:absolute;inset:0;background:url('/facades/assets/nature.webp') center/cover;filter:blur(24px);transform:scale(1.05);z-index:-1}
}
@font-face{font-family:'Nozaka Brush';src:url('/facades/assets/yuji-boku-action.ttf') format('truetype');font-display:swap;font-style:normal;font-weight:400}
.lit-i{position:relative;display:inline-block;font-family:Arial,sans-serif;font-weight:500;letter-spacing:inherit}
.lit-i:after{content:'';position:absolute;width:.16em;height:.16em;min-width:2px;min-height:2px;left:.04em;top:.12em;border-radius:50%;background:#efc668}
:root:not(.zoomed) .black h1.light-catch{font-family:'Hiragino Kaku Gothic ProN',sans-serif;font-weight:600;font-size:clamp(1.6rem,2.8vw,3rem);letter-spacing:.04em;line-height:1.5}
.black .action-brush{font-family:'Nozaka Brush',serif;font-size:clamp(6rem,12vw,12rem);font-weight:400;line-height:1.15;letter-spacing:.04em;margin:15px 0 10px}
@media(max-width:600px){:root:not(.zoomed) .black h1.light-catch{font-size:1.4rem}.black .action-brush{font-size:5.8rem;margin:12px 0}.black .chapter{margin-bottom:14px}}
.zoomed .black h1.light-catch{font-family:sans-serif;font-size:1.3rem!important}.zoomed .black .action-brush{font-size:3rem}
/* 黒：情報を絞り、和英の名前と二段の主題をそれぞれ同幅に。 */
.black .name-lockup{width:clamp(180px,15vw,240px)}
.black .black-identity b,.black .black-identity small{display:flex;justify-content:space-between;letter-spacing:0;width:100%}
.black .black-identity b{font-size:clamp(2rem,2.8vw,3rem)}
.black .black-identity small{font-size:.8rem;margin-top:5px}
.black .office-title{display:block;font-size:.8rem;letter-spacing:.12em;margin-bottom:6px}
.black .action-lockup{width:clamp(270px,36vw,576px);max-width:100%}
:root:not(.zoomed) .black h1.light-catch{display:flex;justify-content:space-between;font-weight:400;letter-spacing:0;font-size:clamp(1.35rem,2.8vw,2.8rem)}
.black .action-brush{font-size:clamp(5.625rem,12vw,12rem);letter-spacing:0;text-align:justify;text-align-last:justify;line-height:1.2;margin:16px 0 0}
.black .nature-line{font-family:'Hiragino Mincho ProN','Yu Mincho',serif;font-size:clamp(1.25rem,1.9vw,1.875rem);letter-spacing:.09em;margin-top:35px}
:root:not(.zoomed) .black .hero-photo{background:#121413}
:root:not(.zoomed) .black .hero-photo>img{position:absolute;bottom:0;right:0;height:88%;width:100%;object-fit:contain;object-position:right bottom}
:root:not(.zoomed) .black .hero-copy{padding-top:235px}
:root:not(.zoomed) .black .pha{left:6.5%;bottom:105px}
@media(max-width:1000px){.black .name-lockup{width:180px}}
@media(max-width:600px){
 .black .name-lockup{width:145px}
 .black .black-identity b{font-size:1.5rem}
 .black .black-identity small{font-size:.6rem}
 .black .office-title{font-size:.65rem;margin-bottom:4px}
 :root:not(.zoomed) .black .hero-copy{padding:0}
 :root:not(.zoomed) .black .hero-photo>img{height:77%;width:160%;max-width:none;top:70px;bottom:auto;right:-18%;object-fit:cover;object-position:66% top}
 :root:not(.zoomed) .black .pha{top:115px;bottom:auto;left:24px}
 .black .action-lockup{width:270px}
 .black .action-brush{font-size:5.625rem}
 .black .nature-line{font-size:1.2rem;margin-top:24px}
}
.zoomed .black .name-lockup{width:auto;max-width:100%}
.zoomed .black .black-identity small{flex-wrap:wrap;gap:1px}
.zoomed .black .action-lockup{width:auto}
.zoomed .black .light-catch{display:block}
.zoomed .black .light-catch>span{display:inline}
.zoomed .black .action-brush{font-size:3rem;text-align:left;text-align-last:left}
:root:not(.zoomed) .black .hero-photo:before{content:'';position:absolute;inset:0;background:url('/facades/assets/black-warm.webp') center top/cover;filter:blur(25px) brightness(.32);transform:scale(1.04)}
:root:not(.zoomed) .black .hero-photo>img{mask-image:linear-gradient(90deg,transparent,#000 35%),linear-gradient(180deg,transparent,#000 7%);mask-composite:intersect;-webkit-mask-image:linear-gradient(90deg,transparent,#000 35%),linear-gradient(180deg,transparent,#000 7%);-webkit-mask-composite:source-in}
@media(max-width:600px){:root:not(.zoomed) .black .hero-photo>img{mask-image:linear-gradient(180deg,transparent,#000 7%);-webkit-mask-image:linear-gradient(180deg,transparent,#000 7%)}}

/* スマホ通常表示：ブラウザーのバーを除く最小表示高に表紙を収める。 */
@media(max-width:600px){
 :root:not(.zoomed) .black .hero{height:100svh;min-height:0;max-height:none}
 :root:not(.zoomed) .black .hero-copy{bottom:35px}
 :root:not(.zoomed) .black .hero-photo>img{top:58px;height:75%}
 :root:not(.zoomed) .black .action-brush{font-size:clamp(4rem,12svh,5.625rem);line-height:1.1;margin-top:12px}
 :root:not(.zoomed) .black .nature-line{margin-top:16px;font-size:1.125rem}
 :root:not(.zoomed) .black .pha{top:105px;width:66px;height:66px}
}
@media(max-width:600px) and (max-height:650px){
 :root:not(.zoomed) .black .masthead{height:82px}
 :root:not(.zoomed) .black .pha{top:90px;width:58px;height:58px}
 :root:not(.zoomed) .black .hero-copy{bottom:30px}
 :root:not(.zoomed) .black .nature-line{margin-top:10px;font-size:1rem}
 :root:not(.zoomed) .black h1.light-catch{font-size:1.2rem}
}
/* 黒のPHAは表紙の右下へ。生成写真の説明はフッターに集約。 */
:root:not(.zoomed) .black .pha{left:auto;right:28px;top:auto;bottom:28px}
@media(max-width:600px){
 :root:not(.zoomed) .black .pha{left:auto;right:16px;top:auto;bottom:20px;width:62px;height:62px}
 .black .nature-line{max-width:calc(100% - 64px)}
}
/* 黒スマホ：左上に二行のキャッチ、筆文字は均等割付を解除。 */
@media(max-width:600px){
 :root:not(.zoomed) .black .hero-copy{position:static;padding:0}
 :root:not(.zoomed) .black .action-lockup{width:auto}
 :root:not(.zoomed) .black h1.light-catch{position:absolute;left:24px;top:125px;display:grid;grid-template-columns:repeat(6,max-content);font-size:1.4rem;line-height:1.65;letter-spacing:.02em;justify-content:start;font-weight:400}
 :root:not(.zoomed) .black h1.light-catch>span:nth-child(5){grid-column:1}
 :root:not(.zoomed) .black .action-brush{position:absolute;left:24px;bottom:88px;font-size:clamp(4rem,11svh,5.3rem);letter-spacing:0;text-align:left;text-align-last:left;margin:0;line-height:1.2}
 :root:not(.zoomed) .black .nature-line{position:absolute;left:24px;right:84px;bottom:35px;margin:0;max-width:none}
 :root:not(.zoomed) .black .hero-photo>img{top:120px;height:71%;right:-29%;width:160%;object-position:66% top}
}
@media(max-width:600px) and (max-height:650px){
 :root:not(.zoomed) .black h1.light-catch{top:102px;font-size:1.25rem}
 :root:not(.zoomed) .black .hero-photo>img{top:100px}
 :root:not(.zoomed) .black .action-brush{bottom:80px}
}
@media(max-width:600px){:root:not(.zoomed) .black .hero-photo>img{width:140%;right:-8%}}
/* 灯の一文字を暖色に。スマホは左の余白に縦一行。 */
.black .fire-letter{color:#f2b66d}
@media(max-width:600px){
 :root:not(.zoomed) .black h1.light-catch{display:block;writing-mode:vertical-rl;text-orientation:upright;top:125px;left:26px;line-height:1.5;letter-spacing:.13em;font-size:1.5rem}
 :root:not(.zoomed) .black h1.light-catch>span{display:inline}
}
@media(max-width:600px) and (max-height:650px){
 :root:not(.zoomed) .black h1.light-catch{top:106px;font-size:1.3rem;letter-spacing:.08em}
}
/* キャッチは静かな明朝へ。筆文字とは役割と強さを分ける。 */
:root:not(.zoomed) .black h1.light-catch{font-family:'Hiragino Mincho ProN','Yu Mincho','YuMincho',serif;font-weight:400}
.black .fire-letter{color:#d9ad76}
@media(max-width:600px){
 :root:not(.zoomed) .black h1.light-catch{left:32px;top:126px;font-size:1.6rem;letter-spacing:.2em;line-height:1.4}
}
@media(max-width:600px) and (max-height:650px){
 :root:not(.zoomed) .black h1.light-catch{top:105px;left:28px;font-size:1.375rem;letter-spacing:.15em}
}
/* 名前ロゴ上の呼吸を確保。短いスマホでも肩書きを上端へ寄せない。 */
:root:not(.zoomed) .black .masthead{padding-top:14px}
@media(max-width:600px){:root:not(.zoomed) .black .masthead{padding-top:12px}}
:root:not(.zoomed) .black .masthead{height:132px}
@media(max-width:600px){:root:not(.zoomed) .black .masthead{height:110px}}
/* 道明マークとメニューボタンの外周・中心を同一寸法で揃える。 */
:root:not(.zoomed) .black .masthead{--header-control-size:70px;align-items:center}
:root:not(.zoomed) .black .identity img,
:root:not(.zoomed) .black .menu-button{width:var(--header-control-size);height:var(--header-control-size);flex-shrink:0;align-self:center}
:root:not(.zoomed) .black .menu-button{padding:22px}
@media(max-width:600px){
 :root:not(.zoomed) .black .masthead{--header-control-size:44px}
 :root:not(.zoomed) .black .menu-button{padding:12px}
}

/* 自然・白：黒で決めたロゴ寸法を共有し、表紙の構図は各案で設計する。 */
:is(.nature,.white) .name-lockup{width:clamp(180px,15vw,240px)}
:is(.nature,.white) .black-identity b,:is(.nature,.white) .black-identity small{display:flex;justify-content:space-between;letter-spacing:0;width:100%}
:is(.nature,.white) .black-identity b{font-size:clamp(2rem,2.8vw,3rem)}
:is(.nature,.white) .black-identity small{font-size:.8rem;margin-top:5px}
:is(.nature,.white) .office-title{display:block;font-size:.8rem;letter-spacing:.12em;margin-bottom:6px}
:root:not(.zoomed) :is(.nature,.white) .masthead{height:132px;padding-top:14px;--header-control-size:70px;align-items:center}
:root:not(.zoomed) :is(.nature,.white) .identity img,
:root:not(.zoomed) :is(.nature,.white) .menu-button{width:var(--header-control-size);height:var(--header-control-size);align-self:center;flex-shrink:0}
:root:not(.zoomed) :is(.nature,.white) .menu-button{padding:22px}
:root:not(.zoomed) :is(.nature,.white) .pha{left:auto;right:28px;top:auto;bottom:28px;width:108px;height:108px}
:is(.nature,.white) .facade-line{font-size:clamp(1.25rem,1.9vw,1.875rem);letter-spacing:.08em;line-height:1.7}
:root:not(.zoomed) .nature .hero-copy{left:6.5%;right:auto;bottom:145px}
:root:not(.zoomed) .nature h1.nature-catch{font-family:'Hiragino Mincho ProN','Yu Mincho',serif;font-size:clamp(4.5rem,8vw,8rem);font-weight:500;line-height:1.25;letter-spacing:.06em}
:root:not(.zoomed) .nature h1.nature-catch span{display:block;margin:0}
.nature .facade-line{margin-top:28px}
:root:not(.zoomed) .nature .hero-photo>img{object-position:center top}
:root:not(.zoomed) .nature .hero-photo:after{background:linear-gradient(90deg,#11251b99,transparent 66%),linear-gradient(180deg,#11251b99,transparent 25%),linear-gradient(0deg,#11251bcc,transparent 40%)}
:root:not(.zoomed) .white .hero-copy{padding:205px 0 0 6.5%}
:root:not(.zoomed) .white h1.white-catch{font-family:'Hiragino Mincho ProN','Yu Mincho',serif;font-weight:400;font-size:clamp(4.5rem,8vw,8rem);letter-spacing:.04em;line-height:1.3}
.white .facade-line{margin-top:38px}
.white .fire-letter{color:#a05b25}
:root:not(.zoomed) .white .hero-photo>img{position:absolute;right:0;bottom:0;width:100%;height:88%;object-fit:contain;object-position:right bottom}
:root:not(.zoomed) .white .hero-photo:after{background:linear-gradient(90deg,#f6f7f3,rgba(246,247,243,.9) 26%,transparent 65%)}
@media(max-width:1000px){
 :is(.nature,.white) .name-lockup{width:180px}
 :root:not(.zoomed) .white .hero-copy{padding-top:200px}
}
@media(max-width:600px){
 :root:not(.zoomed) :is(.nature,.white) .masthead{height:110px;padding-top:12px;--header-control-size:44px}
 :root:not(.zoomed) :is(.nature,.white) .menu-button{padding:12px}
 :is(.nature,.white) .name-lockup{width:145px}
 :is(.nature,.white) .black-identity b{font-size:1.5rem}
 :is(.nature,.white) .black-identity small{font-size:.6rem}
 :is(.nature,.white) .office-title{font-size:.65rem;margin-bottom:4px}
 :root:not(.zoomed) :is(.nature,.white) .hero{height:100svh;min-height:0;max-height:none}
 :root:not(.zoomed) :is(.nature,.white) .pha{left:auto;right:16px;top:auto;bottom:20px;width:62px;height:62px}
 :root:not(.zoomed) .nature .hero-copy{left:24px;right:24px;bottom:35px;top:auto;padding:0}
 :root:not(.zoomed) .nature h1.nature-catch{font-size:clamp(3.25rem,8.5svh,4.5rem);line-height:1.17;letter-spacing:.02em}
 :root:not(.zoomed) .nature h1.nature-catch span{display:inline}
 :root:not(.zoomed) .nature h1.nature-catch span+span{display:block}
 .nature .facade-line{font-size:1.125rem;letter-spacing:.02em;margin-top:22px;max-width:calc(100% - 68px)}
 :root:not(.zoomed) .nature .hero-photo>img{position:absolute;width:145%;max-width:none;height:78%;top:55px;right:-20%;object-fit:cover;object-position:40% top;mask-image:linear-gradient(180deg,transparent,#000 10%);-webkit-mask-image:linear-gradient(180deg,transparent,#000 10%)}
 :root:not(.zoomed) .nature .hero-photo{background:#173b2a}
 :root:not(.zoomed) .nature .hero-photo:before{content:'';position:absolute;inset:0;background:url('/facades/assets/nature.webp') center top/cover;filter:blur(24px) brightness(.65);transform:scale(1.05)}
 :root:not(.zoomed) .nature .hero-photo:after{background:linear-gradient(180deg,#11251b55,transparent 22%),linear-gradient(0deg,#173b2a 0%,#173b2acc 22%,transparent 65%)}
 :root:not(.zoomed) .white .hero-copy{position:static;padding:0}
 :root:not(.zoomed) .white h1.white-catch{position:absolute;top:135px;left:24px;font-size:clamp(2.75rem,6.5svh,3.5rem);line-height:1.3;letter-spacing:.04em}
 .white .facade-line{position:absolute;left:24px;right:84px;bottom:35px;font-family:'Hiragino Mincho ProN','Yu Mincho',serif;font-size:1.125rem;margin:0;letter-spacing:.04em}
 :root:not(.zoomed) .white .hero-photo>img{height:70%;width:125%;max-width:none;top:auto;bottom:38px;right:-27%;object-fit:contain;object-position:right bottom}
 :root:not(.zoomed) .white .hero-photo:after{background:linear-gradient(0deg,#f6f7f3 0%,transparent 28%),linear-gradient(90deg,#f6f7f3 0%,transparent 38%)}
 :root:not(.zoomed) .white .hero-photo{background:#f6f7f3}
}
@media(max-width:600px) and (max-height:650px){
 :root:not(.zoomed) .white h1.white-catch{top:120px;font-size:2.6rem}
 :root:not(.zoomed) .white .hero-photo>img{height:65%}
 :is(.nature,.white) .facade-line{font-size:1rem}
}
.zoomed :is(.nature,.white) .name-lockup{width:auto;max-width:100%}
.zoomed :is(.nature,.white) .black-identity small{flex-wrap:wrap;gap:1px}
.zoomed :is(.nature,.white) .facade-line{position:static;margin-top:24px;max-width:none}
@media(max-width:600px){
 :root:not(.zoomed) .nature .hero-photo>img{width:125%;height:auto;right:-5%;top:100px;object-fit:contain;object-position:center;mask-image:linear-gradient(180deg,transparent,#000 8%,#000 78%,transparent);-webkit-mask-image:linear-gradient(180deg,transparent,#000 8%,#000 78%,transparent)}
 :root:not(.zoomed) .white .hero-photo>img{mask-image:linear-gradient(180deg,transparent,#000 7%);-webkit-mask-image:linear-gradient(180deg,transparent,#000 7%)}
}
@media(max-width:600px){:root:not(.zoomed) .white .hero-photo>img{height:60%}}
@media(max-width:600px) and (max-height:650px){:root:not(.zoomed) .white .hero-photo>img{height:53%}:root:not(.zoomed) .white h1.white-catch{font-size:2.3rem;top:118px}}
/* 自然案を提供ポートレート基準の青いシャツ・明るい屋外へ更新。 */
.nature{background:#f3f7f5;color:#153b46}
:root:not(.zoomed) .nature .masthead{color:#153b46;text-shadow:none}
:root:not(.zoomed) .nature .hero{color:#153b46;background:#e8f3fa}
:root:not(.zoomed) .nature .hero-photo{background:#e8f3fa}
:root:not(.zoomed) .nature .hero-photo:before{display:none}
:root:not(.zoomed) .nature .hero-photo>img{object-fit:cover;object-position:60% top}
:root:not(.zoomed) .nature .hero-photo:after{background:linear-gradient(90deg,#f1f7f7f0 0%,#f1f7f7a6 27%,transparent 61%),linear-gradient(180deg,#e8f3fa99,transparent 18%)}
:root:not(.zoomed) .nature .hero-copy{top:235px;bottom:auto}
:root:not(.zoomed) .nature h1.nature-catch{font-family:'Hiragino Kaku Gothic ProN','Noto Sans JP',sans-serif;font-size:clamp(4rem,6.8vw,7rem);font-weight:500;letter-spacing:.02em;line-height:1.3}
.nature .facade-line{font-weight:400;font-size:clamp(1.25rem,1.8vw,1.7rem)}
@media(min-aspect-ratio:2/1) and (min-width:1001px){
 :root:not(.zoomed) .nature .hero-photo>img{object-fit:contain;object-position:right top}
}
@media(max-width:600px){
 :root:not(.zoomed) .nature .hero{background:#f3f7f5}
 :root:not(.zoomed) .nature .hero-photo{background:linear-gradient(#e8f3fa,#f3f7f5 80%)}
 :root:not(.zoomed) .nature .hero-photo>img{width:140%;right:-20%;top:105px;height:auto;object-fit:contain;mask-image:linear-gradient(180deg,transparent,#000 9%,#000 80%,transparent);-webkit-mask-image:linear-gradient(180deg,transparent,#000 9%,#000 80%,transparent)}
 :root:not(.zoomed) .nature .hero-photo:after{background:linear-gradient(0deg,#f3f7f5 0%,#f3f7f5a6 20%,transparent 45%)}
 :root:not(.zoomed) .nature .hero-copy{top:auto;bottom:35px}
 :root:not(.zoomed) .nature h1.nature-catch{font-size:clamp(2.75rem,7.4svh,4rem);font-weight:500;line-height:1.2}
 .nature .facade-line{font-size:1.125rem;margin-top:18px}
}
@media(max-width:600px) and (max-height:650px){
 :root:not(.zoomed) .nature .hero-photo>img{top:92px}
 .nature .facade-line{font-size:1rem}
}
@media(max-width:600px) and (min-height:800px){:root:not(.zoomed) .nature .hero-photo>img{width:165%;right:-28%;top:130px}}

/* 海のファサード：写真を画面端までつなぎ、空に見出しを置く。 */
:root:not(.zoomed) .nature .hero-photo:after{background:linear-gradient(90deg,rgba(234,244,248,.66),rgba(234,244,248,.2) 33%,transparent 58%),linear-gradient(180deg,rgba(223,239,249,.25),transparent 24%)}
@media(max-width:600px){
 :root:not(.zoomed) .nature .hero-photo>img{inset:0;width:100%;height:100%;object-fit:cover;object-position:66% center;mask-image:none;-webkit-mask-image:none}
 :root:not(.zoomed) .nature .hero-photo:after{background:linear-gradient(180deg,rgba(224,239,249,.48),transparent 32%,transparent 66%,rgba(12,30,30,.57))}
 :root:not(.zoomed) .nature .hero-copy{position:absolute;inset:0;padding:0;pointer-events:none}
 :root:not(.zoomed) .nature h1.nature-catch{position:absolute;top:128px;left:24px;font-size:clamp(2.65rem,7svh,3.5rem);line-height:1.22;letter-spacing:.04em}
 :root:not(.zoomed) .nature .facade-line{position:absolute;left:24px;bottom:34px;right:94px;max-width:none;margin:0;color:#fff;font-size:1.0625rem;letter-spacing:.06em;line-height:1.7;text-shadow:0 1px 10px #153b4655}
}
@media(max-width:600px) and (max-height:650px){
 :root:not(.zoomed) .nature h1.nature-catch{top:112px;font-size:2.5rem}
}

/* 自然：海の余白から人物へつながる縦組み。旧案の均等な二列を置き換える。 */
@font-face{font-family:'Nozaka Klee';src:url('/facades/assets/klee-nature.ttf') format('truetype');font-display:swap;font-weight:600;font-style:normal}
:root:not(.zoomed) .nature .hero{height:100svh;min-height:680px;max-height:1200px}
:root:not(.zoomed) .nature .hero-copy{inset:22% auto auto 8%;padding:0}
:root:not(.zoomed) .nature h1.nature-catch{display:flex;flex-direction:row-reverse;align-items:flex-start;gap:32px;font-family:'Nozaka Klee','Hiragino Mincho ProN',serif;font-weight:600;font-size:clamp(2rem,3.1vw,3.25rem);line-height:1.2;letter-spacing:.12em;color:#123943}
:root:not(.zoomed) .nature h1.nature-catch span{display:block;writing-mode:vertical-rl;text-orientation:upright;margin:0}
:root:not(.zoomed) .nature h1.nature-catch span+span{padding-top:100px;font-size:1.55em;letter-spacing:.09em}
:root:not(.zoomed) .nature .hero-bottom>span{display:none}
:root:not(.zoomed) .nature .hero-bottom{left:8%;bottom:25px}
@media(max-width:1000px) and (min-width:601px){
 :root:not(.zoomed) .nature .hero-photo>img{object-position:65% center}
 :root:not(.zoomed) .nature .hero-copy{left:6%;top:22%}
}
@media(max-width:600px){
 :root:not(.zoomed) .nature .hero{height:100svh;min-height:0;max-height:none}
 :root:not(.zoomed) .nature .hero-photo>img{object-position:73% center}
 :root:not(.zoomed) .nature .hero-photo:before{content:'';display:block;position:absolute;inset:0 0 auto;height:46%;z-index:1;transform:none;filter:none;background:linear-gradient(90deg,rgba(231,242,247,.65),rgba(231,242,247,.28) 26%,transparent 43%);mask-image:linear-gradient(#000 75%,transparent);-webkit-mask-image:linear-gradient(#000 75%,transparent)}
 :root:not(.zoomed) .nature .hero-photo:after{background:linear-gradient(180deg,rgba(224,239,249,.35),transparent 29%,transparent 76%,rgba(12,30,30,.32))}
 :root:not(.zoomed) .nature .hero-copy{inset:135px auto auto 27px}
 :root:not(.zoomed) .nature h1.nature-catch{position:static;font-size:1.55rem;gap:13px;letter-spacing:.08em;line-height:1.15}
 :root:not(.zoomed) .nature h1.nature-catch span+span{padding-top:73px;font-size:1.6em;letter-spacing:.08em}
}
@media(max-width:600px) and (max-height:700px){
 :root:not(.zoomed) .nature .hero-copy{top:120px;left:24px}
 :root:not(.zoomed) .nature h1.nature-catch{font-size:1.3rem;gap:12px}
 :root:not(.zoomed) .nature h1.nature-catch span+span{padding-top:52px}
}
@media(min-width:601px) and (max-height:750px){
 :root:not(.zoomed) .nature .hero{min-height:600px}
 :root:not(.zoomed) .nature .hero-copy{top:25%}
 :root:not(.zoomed) .nature h1.nature-catch{font-size:2rem}
 :root:not(.zoomed) .nature h1.nature-catch span+span{padding-top:70px}
}
@media(max-width:350px){
 :root:not(.zoomed) .nature .hero-copy{left:18px;top:117px}
 :root:not(.zoomed) .nature h1.nature-catch{font-size:1.125rem;gap:10px}
 :root:not(.zoomed) .nature h1.nature-catch span+span{padding-top:48px}
}
@media(min-aspect-ratio:2/1) and (min-width:1001px){
 :root:not(.zoomed) .nature .hero-photo>img{object-fit:cover;object-position:center 25%}
}

/* 白：言葉と表情を一枚の白地につなぐ。 */
.white{background:#fff;color:#142e4b}
:root:not(.zoomed) .white .hero{height:100svh;min-height:680px;max-height:1200px;background:#fff}
:root:not(.zoomed) .white .hero-photo{inset:0;background:#fff}
:root:not(.zoomed) .white .hero-photo>img{inset:auto 2% 0 auto;width:auto;max-width:none;height:82%;object-fit:contain;object-position:right bottom;mask-image:none;-webkit-mask-image:none}
:root:not(.zoomed) .white .hero-photo:after{background:none}
:root:not(.zoomed) .white .hero-copy{position:absolute;inset:25% auto auto 8%;padding:0}
:root:not(.zoomed) .white h1.white-catch{position:static;font-family:'Hiragino Mincho ProN','Yu Mincho',serif;font-size:clamp(4.5rem,8vw,8rem);line-height:1.23;font-weight:400;letter-spacing:.01em}
:root:not(.zoomed) .white h1.white-catch span:first-child{font-size:.67em;margin-bottom:18px;letter-spacing:.06em}
:root:not(.zoomed) .white h1.white-catch span+span{margin-left:.3em}
:root:not(.zoomed) .white .facade-line{position:static;margin-top:38px;font-family:'Hiragino Kaku Gothic ProN',sans-serif;font-size:clamp(1.125rem,1.6vw,1.5rem);letter-spacing:.06em;line-height:1.8}
:root:not(.zoomed) .white .hero-bottom{left:8%;bottom:25px}
:root:not(.zoomed) .white .hero-bottom>span{display:none}
.white .policies{background:#f2f5f7}
@media(min-width:601px) and (max-width:1000px){
 :root:not(.zoomed) .white .hero-copy{top:21%;left:6%}
 :root:not(.zoomed) .white .hero-photo>img{height:65%;right:-17%}
 :root:not(.zoomed) .white h1.white-catch{font-size:5.4rem}
}
@media(max-width:600px){
 :root:not(.zoomed) .white .hero{min-height:0;max-height:none}
 :root:not(.zoomed) .white .hero-copy{position:static;padding:0}
 :root:not(.zoomed) .white h1.white-catch{position:absolute;top:140px;left:24px;right:24px;font-size:clamp(3.3rem,14vw,4.4rem);line-height:1.18}
 :root:not(.zoomed) .white h1.white-catch span:first-child{font-size:.64em;margin-bottom:8px}
 :root:not(.zoomed) .white h1.white-catch span+span{margin-left:.35em}
 :root:not(.zoomed) .white .hero-photo>img{height:66%;right:-24%;bottom:0}
 :root:not(.zoomed) .white .facade-line{position:absolute;left:24px;right:90px;bottom:30px;margin:0;font-size:1rem;letter-spacing:.02em;line-height:1.8}
 :root:not(.zoomed) .white .hero:after{content:'';position:absolute;inset:auto 0 0;height:120px;background:linear-gradient(transparent,#fff);z-index:-1;pointer-events:none}
 :root:not(.zoomed) .white .hero-bottom{display:none}
 :root:not(.zoomed) .white .hero-bottom a{font-size:1rem}
}
@media(max-width:600px) and (max-height:700px){
 :root:not(.zoomed) .white h1.white-catch{top:125px}
 :root:not(.zoomed) .white h1.white-catch{font-size:3.15rem}
 :root:not(.zoomed) .white .hero-photo>img{height:62%;right:-18%}
}
@media(min-width:1001px) and (max-height:750px){
 :root:not(.zoomed) .white .hero{min-height:600px}
 :root:not(.zoomed) .white h1.white-catch{font-size:6rem}
 :root:not(.zoomed) .white .hero-copy{top:27%}
 :root:not(.zoomed) .white .hero-photo>img{height:78%;right:8%}
 :root:not(.zoomed) .white .facade-line{margin-top:24px}
}
@media(max-width:350px) and (max-height:700px){
 :root:not(.zoomed) .white h1.white-catch{font-size:2.85rem}
}

/* 鳥取の印と、署名を伴わない手書き風の試作コピー。 */
.place-mark{position:absolute;z-index:2;pointer-events:none;color:inherit}
.place-mark svg{display:block;width:100%;height:auto;fill:currentColor}
.place-name{font-family:Georgia,serif;font-size:1rem;letter-spacing:.17em;line-height:1.55;margin-top:10px;text-align:center}
.place-name span{display:block}
.place-values{border-top:1px solid currentColor;margin-top:18px;padding-top:15px;display:grid;gap:6px;font-size:.75rem;letter-spacing:.18em;font-weight:500}
.black main{position:relative}
.black .place-mark{left:6.5%;top:calc(clamp(850px,100svh,1200px) - 240px);bottom:auto;width:112px;color:#d6cbb9}
.black .place-values{display:none}
.nature .place-mark{left:8%;bottom:105px;width:122px;color:#143b45}
.nature .place-values{grid-template-columns:1fr 1fr;width:250px;gap:8px 18px}
.nature .place-name{font-size:.875rem}
.nature .place-name span{display:inline}
@font-face{font-family:'Nozaka Handnote';src:url('/facades/assets/klee-handnote.ttf') format('truetype');font-weight:600;font-style:normal;font-display:swap}
.white main{position:relative}
.hand-note{padding:35px 24px 50px;background:#fff;color:#19354b}
.hand-note p{font-family:'Nozaka Handnote',serif;font-weight:600;font-size:1.75rem;letter-spacing:.05em;line-height:1.55;text-align:left;text-align-last:left;transform:rotate(-5deg);width:max-content;max-width:100%;margin:0 auto}
.hand-note span{display:block}
.hand-note span:nth-child(2){padding-left:26px}
.hand-note span:nth-child(3){padding-left:48px}
@media(min-width:1200px){
 :root:not(.zoomed) .white .hand-note{position:absolute;left:23%;top:calc(min(100svh,1200px) * .69);z-index:2;padding:0;background:transparent;pointer-events:none}
 :root:not(.zoomed) .hand-note p{font-size:clamp(1.5rem,2.1vw,2rem);line-height:1.45}
}
@media(max-width:1000px){.black .place-mark{width:88px}.nature .place-mark{width:100px;bottom:100px}}
@media(min-width:601px) and (max-height:750px){
 .black .place-mark{left:6.5%;right:auto;top:calc(clamp(850px,100svh,1200px) - 240px);bottom:auto;width:92px}
 .nature .place-mark{bottom:95px;width:240px;display:flex;align-items:center;gap:20px}
 .nature .place-mark svg{width:90px;flex-shrink:0}
 .nature .place-name{margin:0;text-align:left}
 .nature .place-values{display:none}
 :root:not(.zoomed) .white .hand-note{top:calc(clamp(600px,100svh,1200px) * .67)}
}
@media(max-width:600px){
 .black .place-mark{position:relative;inset:auto;width:230px;margin:0 auto;padding:25px 0 32px;display:flex;align-items:center;gap:18px}
 .black .place-mark svg{width:100px;flex-shrink:0}
 .black .place-name{font-size:.8rem;margin:0}
 .nature .place-mark{left:24px;bottom:28px;width:70px;color:#fff;filter:drop-shadow(0 1px 4px #142b32)}
 .place-name{font-size:.65rem;letter-spacing:.12em;margin-top:6px}
 .nature .place-name{font-size:.65rem}
 .nature .place-name span{display:block}
 .place-values{display:none!important}
 .hand-note{padding-top:28px;padding-bottom:46px}
 .hand-note p{font-size:1.6rem}
}

.zoomed .place-mark{display:block;position:relative;inset:auto;width:110px;margin:24px;color:inherit;filter:none}
.zoomed .place-mark svg{width:100%}
.zoomed .place-name{font-size:.75rem;text-align:center;margin-top:10px}
.zoomed .place-values{display:none}
.zoomed .hand-note{position:static;padding:35px 24px 50px}
.zoomed .hand-note p{transform:none;font-size:1.125rem;max-width:100%;width:auto}
.zoomed .hand-note span{padding:0}

/* 共通の2・3区画：インタビューと、その問いを文章で読む入口。 */
.action-films,.questions{--section-bg:#f5f3ea;--section-ink:#203f39;--section-line:#203f3933;background:var(--section-bg);color:var(--section-ink);padding:100px 0;scroll-margin-top:110px}
.black .action-films,.black .questions{--section-bg:#19221f;--section-ink:#f3efe2;--section-line:#f3efe233}
.white .action-films,.white .questions{--section-bg:#f1f4f6;--section-ink:#17344b;--section-line:#17344b33}
.films-heading,.film-controls,.film-description,.film-production-note{width:87%;max-width:1560px;margin-inline:auto}
.films-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;margin-bottom:48px}
.section-kicker{display:block;font-size:1rem;letter-spacing:.15em;margin-bottom:22px}
.films-heading h2,.questions h2{font-family:'Hiragino Mincho ProN','Yu Mincho',serif;font-size:clamp(2rem,3.2vw,3.5rem);font-weight:500;line-height:1.5}
.films-heading p{line-height:1.9}
.film-track{display:flex;gap:28px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;padding:8px max(6.5%,calc((100% - 1560px)/2));touch-action:pan-x pan-y}
.film-track::-webkit-scrollbar{display:none}
.film-card{flex:0 0 clamp(245px,23vw,340px);scroll-snap-align:center}
.film-poster{position:relative;aspect-ratio:9/16;border-radius:6px;overflow:hidden;color:#18372f;box-shadow:0 8px 24px #0000000d}
.film-poster>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.film-number{position:absolute;top:20px;left:24px;font-size:1rem;letter-spacing:.16em;border-bottom:1px solid currentColor;padding-bottom:8px}
.film-poster h3{position:absolute;top:85px;left:24px;right:20px;font-size:clamp(1.25rem,1.6vw,1.65rem);line-height:1.65;font-weight:600;letter-spacing:.025em}
.film-poster h3 span{display:block}
.film-badge{position:absolute;bottom:23px;left:24px;font-size:.875rem;letter-spacing:.06em}
.film-card-title{font-size:1rem;margin-top:16px;line-height:1.7}
.film-controls{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-top:28px}
.film-hint{font-size:1rem}
.film-navigation{display:flex;align-items:center;gap:20px;flex-shrink:0}
.film-navigation button{background:transparent;border:1px solid var(--section-line);border-radius:50%;color:inherit;width:52px;height:52px;font-size:1.5rem}
.film-position{font-size:1rem;font-variant-numeric:tabular-nums;white-space:nowrap}
.film-description{border-top:1px solid var(--section-line);margin-top:35px;padding-top:32px;display:grid;grid-template-columns:1fr 3fr;gap:32px}
.film-description h3{font-size:1.5rem;font-weight:500;line-height:1.6;margin-bottom:14px}
.film-description p{max-width:850px;text-align:justify;text-justify:inter-character;line-height:1.9}
.film-description a,.faq-answer a{display:inline-block;padding:16px 0 10px;text-decoration:underline;text-underline-offset:6px;font-size:1.125rem}
.film-production-note{font-size:1rem;line-height:1.8;margin-top:30px}
.questions{--section-bg:#e9ede3;padding-inline:6.5%;display:grid;grid-template-columns:1fr 1.75fr;gap:8%;border-top:1px solid var(--section-line)}
.black .questions{--section-bg:#101714}.white .questions{--section-bg:#fff}
.questions-heading p{margin-top:22px}.questions-heading .faq-draft-note{font-size:1rem;line-height:1.85}
.faq-item{border-top:1px solid var(--section-line);overflow:hidden}.faq-item:last-child{border-bottom:1px solid var(--section-line)}
.faq-item summary{list-style:none;display:grid;grid-template-columns:30px 1fr 24px;align-items:start;gap:18px;padding:28px 0;cursor:pointer}
.faq-item summary::-webkit-details-marker{display:none}.faq-item summary:focus-visible{outline:3px solid #b69544;outline-offset:-3px}
.faq-number{font-size:1rem;padding-top:4px;font-variant-numeric:tabular-nums}.faq-item h3{font-size:1.25rem;line-height:1.8;font-weight:500}
.faq-plus{position:relative;width:24px;height:24px;margin-top:6px}.faq-plus:before,.faq-plus:after{content:'';position:absolute;background:currentColor;left:3px;right:3px;top:11px;height:1px;transition:transform .3s}.faq-plus:after{transform:rotate(90deg)}.faq-item[open] .faq-plus:after{transform:rotate(0)}
.faq-answer{padding:0 42px 28px 48px}.faq-answer p{text-align:justify;text-justify:inter-character;font-size:1.125rem;line-height:1.9}
.film-nojs{padding:30px 6.5%}.film-nojs h3{margin-top:24px}
@media(min-width:1800px){.film-card{flex-basis:360px}}
@media(max-width:900px){.questions{grid-template-columns:1fr;gap:35px}.films-heading{display:block}.films-heading p{margin-top:20px}}
@media(max-width:600px){.action-films,.questions{padding-top:58px;padding-bottom:60px}.films-heading,.film-controls,.film-description,.film-production-note{width:auto;margin-left:24px;margin-right:24px}.films-heading{margin-bottom:30px}.film-track{gap:18px;padding-inline:24px}.film-card{flex-basis:76vw;max-width:310px}.film-poster h3{font-size:1.35rem;top:80px}.film-controls{flex-wrap:wrap}.film-navigation{gap:16px}.film-description{grid-template-columns:1fr;gap:4px}.film-description .section-kicker{margin-bottom:8px}.film-description h3{font-size:1.35rem}.questions{padding-inline:24px}.faq-item summary{grid-template-columns:24px 1fr 20px;gap:10px;padding:24px 0}.faq-item h3{font-size:1.125rem}.faq-answer{padding-left:34px;padding-right:0}.section-kicker{font-size:.875rem}}
.zoomed .films-heading,.zoomed .film-description,.zoomed .questions{display:block}.zoomed .films-heading p{margin-top:24px}.zoomed .film-card{flex-basis:min(440px,85vw);max-width:none}.zoomed .film-poster{aspect-ratio:auto;min-height:510px}.zoomed .film-poster h3{position:relative;inset:auto;padding:90px 18px 90px;font-size:1.1rem}.zoomed .film-poster h3 span{display:inline}.zoomed .film-card-title{font-size:1rem}.zoomed .film-navigation{gap:12px;flex-shrink:1}.zoomed .film-controls{flex-wrap:wrap}.zoomed .film-description h3{margin-top:22px}.zoomed .questions-heading{margin-bottom:35px}.zoomed .faq-answer{padding-left:0}
@media(prefers-reduced-motion:reduce){.faq-plus:before,.faq-plus:after{transition:none}}