/*
Theme Name: TAKAYASU
Theme URI: https://takayasu.net/
Author: TAKAYASU
Description: 写真ブログ用のカスタムテーマ。白×グレー×くすんだ水色の落ち着いた配色に、明朝とCormorantの上品なタイポグラフィ。
Version: 2.0
Text Domain: takayasu
*/
:root{
--bg:#f5f5f2;--bg2:#ededea;--mist:#e5ebee;--deep:#46525a;
--ink:#16181b;--text:#232529;--soft:#4b4e54;--mute:#7e8085;
--brass:#b08d57;--brass-2:#96793f;--brass-soft:#d9b988;
--line:rgba(27,29,33,.12);--line-strong:rgba(27,29,33,.26);
--serif:"Shippori Mincho","Hiragino Mincho ProN","Yu Mincho",serif;
--sans:"Zen Kaku Gothic New","Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;
--en:"Cormorant Garamond",Georgia,serif;
--max:1180px}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--text);font-family:var(--sans);font-weight:400;font-size:15px;line-height:2;letter-spacing:.04em;-webkit-font-smoothing:antialiased;font-feature-settings:"palt"}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
::selection{background:var(--brass);color:#fff}
.wrap{max-width:var(--max);margin:0 auto;padding:0 40px}
/* ---------- header ---------- */
header.nav{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;align-items:center;justify-content:space-between;padding:22px 40px;color:#fff;transition:background .4s ease,color .4s ease,padding .4s ease;border-bottom:1px solid transparent}
.nav .logo{display:flex;flex-direction:column;line-height:1.3;text-shadow:0 1px 14px rgba(0,0,0,.45)}
.nav .logo .en{font-family:var(--en);font-size:21px;letter-spacing:.2em;font-weight:500}
.nav .logo .jp{font-size:10px;letter-spacing:.24em;opacity:.75;margin-top:3px}
.menu{display:flex;gap:34px;align-items:center;font-family:var(--en);font-size:14px;letter-spacing:.16em}
.menu a{opacity:.88;position:relative;padding:6px 0;transition:opacity .3s;text-shadow:0 1px 10px rgba(0,0,0,.4)}
.menu a::after{content:"";position:absolute;left:0;bottom:0;width:0;height:1px;background:var(--brass);transition:width .35s ease}
.menu a:hover{opacity:1}
.menu a:hover::after{width:100%}
.menu .cta{text-shadow:none}
.burger{display:none;font-size:22px;background:none;border:0;color:#fff;cursor:pointer}
header.nav.scrolled{background:rgba(245,245,242,.92);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:var(--ink);padding:14px 40px;border-bottom-color:var(--line)}
header.nav.scrolled .logo{text-shadow:none}
header.nav.scrolled .logo .jp{color:var(--mute);opacity:1}
header.nav.scrolled .menu a{text-shadow:none}
header.nav.scrolled .burger{color:var(--ink)}
/* ---------- hero slideshow ---------- */
.hero{position:relative;height:100vh;min-height:620px;display:flex;align-items:center;overflow:hidden;color:#fff;background:#191b1f}
.hs{position:absolute;inset:0;background-size:cover;background-position:center;opacity:0;animation:fade 96s linear infinite,kb 96s ease-in-out infinite}
@keyframes fade{0%{opacity:0}1%{opacity:1}5%{opacity:1}6.5%{opacity:0}100%{opacity:0}}
@keyframes kb{0%{transform:scale(1.03)}6.5%{transform:scale(1.12)}100%{transform:scale(1.12)}}
.hero__scrim{display:none}
.hero__inner{position:relative;z-index:2;width:100%;max-width:var(--max);margin:0 auto;padding:0 40px}
.hero .tag{font-family:var(--en);font-size:13.5px;letter-spacing:.5em;color:var(--brass-soft);text-transform:uppercase;display:flex;align-items:center;gap:18px;margin-bottom:30px}
.hero .tag::before{content:"";width:60px;height:1px;background:var(--brass)}
.hero h1{font-family:var(--en);font-weight:400;font-size:clamp(40px,6.5vw,72px);line-height:1.2;letter-spacing:.1em;text-shadow:0 2px 30px rgba(0,0,0,.45)}
.hero .sub{margin-top:30px;font-size:16px;line-height:2.3;letter-spacing:.1em;color:rgba(255,255,255,.9);max-width:560px;text-shadow:0 1px 12px rgba(0,0,0,.5)}
.scrollcue{position:absolute;left:50%;bottom:34px;transform:translateX(-50%);z-index:2;display:flex;flex-direction:column;align-items:center;gap:10px;font-family:var(--en);font-size:10px;letter-spacing:.5em;text-indent:.5em;color:rgba(255,255,255,.65);text-transform:uppercase}
.scrollcue span{width:1px;height:52px;background:linear-gradient(180deg,var(--brass),transparent);animation:cue 2.2s ease-in-out infinite;display:block}
@keyframes cue{0%{transform:scaleY(0);transform-origin:top}45%{transform:scaleY(1);transform-origin:top}55%{transform:scaleY(1);transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
/* ---------- sections ---------- */
section{padding:120px 0}
.sechead{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:64px}
.sechead .en{font-family:var(--en);font-size:13px;letter-spacing:.5em;color:var(--brass-2);text-transform:uppercase;font-weight:400;display:flex;align-items:center;gap:18px}
.sechead .en::before{content:"";width:46px;height:1px;background:var(--brass);opacity:.7}
.sechead h2{font-family:var(--serif);font-weight:600;letter-spacing:.12em;font-size:clamp(26px,3.4vw,40px);line-height:1.6;margin-top:20px}
.more{font-family:var(--en);font-size:12px;letter-spacing:.3em;text-transform:uppercase;border-bottom:1px solid var(--brass);padding-bottom:4px;color:var(--soft);transition:color .3s}
.more:hover{color:var(--brass-2)}
/* ---------- blog list ---------- */
.news{border-top:1px solid var(--line)}
.news__item{display:grid;grid-template-columns:96px 112px 1fr auto;gap:30px;align-items:center;padding:30px 6px;border-bottom:1px solid var(--line);transition:background .3s,padding .3s}
.news__item:hover{background:#fff;padding-left:14px;padding-right:14px}
.news__thumb{width:88px;height:62px;background-size:cover;background-position:center;background-color:#d8d8d4}
.news__date{font-family:var(--en);font-size:15px;letter-spacing:.18em;color:var(--brass-2)}
.news__cat{font-family:var(--en);font-size:10px;letter-spacing:.4em;text-transform:uppercase;color:var(--mute);display:block;margin-bottom:4px}
.news__title{font-family:var(--serif);font-size:17px;font-weight:500;letter-spacing:.08em}
.news__arrow{opacity:0;transition:opacity .2s,transform .2s;transform:translateX(-6px);font-size:16px;color:var(--brass-2)}
.news__item:hover .news__arrow{opacity:1;transform:none}
/* ---------- gallery ---------- */
.gallery{background:var(--deep);color:#f0f2f3}
.gallery .sechead h2{color:#fff}
.gallery .sechead .en{color:var(--brass-soft)}
.gallery .sechead .en::before{background:var(--brass-soft)}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.shot{position:relative;aspect-ratio:4/5;overflow:hidden;background-size:cover;background-position:center;background-color:#333a3f;transition:transform 1.2s cubic-bezier(.2,.6,.2,1)}
.shot:hover{transform:scale(1.02)}
.shot span{position:absolute;left:14px;bottom:12px;font-family:var(--en);font-size:10px;letter-spacing:.35em;color:rgba(255,255,255,.85);text-transform:uppercase;text-shadow:0 1px 6px rgba(0,0,0,.6)}
/* ---------- about ---------- */
.about{background:var(--mist)}
.about .cols{display:grid;grid-template-columns:1.05fr .95fr;gap:80px;align-items:center}
.about .lead{font-family:var(--serif);font-size:clamp(20px,2.2vw,26px);line-height:2.3;letter-spacing:.12em;font-weight:500;margin-bottom:24px}
.about p{color:var(--soft);font-size:14px;line-height:2.3;max-width:46ch}
.about .photo{aspect-ratio:4/5;background-size:cover;background-position:center;position:relative}
.about .photo::before{content:"";position:absolute;inset:18px -18px -18px 18px;border:1px solid var(--line-strong);z-index:-1}
/* ---------- company ---------- */
.company{background:var(--bg2);border-top:1px solid var(--line)}
.ctable{border-top:1px solid var(--line);max-width:720px}
.ctable .row{display:grid;grid-template-columns:150px 1fr;gap:20px;padding:20px 6px;border-bottom:1px solid var(--line)}
.ctable dt{font-size:12px;letter-spacing:.3em;color:var(--mute);padding-top:3px}
.ctable dd{font-size:14.5px;letter-spacing:.1em}
/* ---------- contact ---------- */
.contactsec{position:relative;overflow:hidden;text-align:center;padding:150px 0;color:#fff}
.contact-bg{position:absolute;inset:0;background-size:cover;background-position:center;filter:brightness(.5) saturate(.85)}
.contactsec .veil{position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(16,17,20,.3),rgba(16,17,20,.82))}
.contactsec .inner{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center}
.contactsec .en{font-family:var(--en);font-size:13px;letter-spacing:.5em;text-indent:.5em;color:var(--brass-soft);text-transform:uppercase}
.contactsec h2{font-family:var(--serif);font-size:clamp(24px,3vw,36px);letter-spacing:.18em;margin-top:20px;font-weight:600}
.contactsec p{margin-top:24px;font-size:14px;color:rgba(255,255,255,.85)}
.btn-line{margin-top:44px;display:inline-flex;align-items:center;gap:26px;border:1px solid rgba(255,255,255,.4);padding:20px 54px;font-family:var(--en);font-size:13px;letter-spacing:.4em;text-indent:.1em;text-transform:uppercase;color:#fff;position:relative;overflow:hidden;transition:color .45s,border-color .45s;z-index:0}
.btn-line::before{content:"";position:absolute;inset:0;background:var(--brass);transform:scaleX(0);transform-origin:left;transition:transform .45s cubic-bezier(.2,.6,.2,1);z-index:-1}
.btn-line:hover{color:#16171a;border-color:var(--brass)}
.btn-line:hover::before{transform:scaleX(1)}
.btn-line .arw{width:34px;height:1px;background:currentColor;position:relative}
.btn-line .arw::after{content:"";position:absolute;right:0;top:-3px;width:9px;height:1px;background:currentColor;transform:rotate(38deg);transform-origin:right}
.contactsec .mail{margin-top:22px;font-family:var(--en);font-size:13px;letter-spacing:.24em;color:rgba(255,255,255,.6)}
/* ---------- footer ---------- */
footer.site{background:#17191d;color:#e8e5dd;padding:70px 40px 40px;text-align:center}
.flogo{display:inline-flex;flex-direction:column;align-items:center;line-height:1.3}
.flogo .en{font-family:var(--en);font-size:21px;letter-spacing:.2em;font-weight:500}
.flogo .jp{font-size:10px;letter-spacing:.24em;color:#807c72;margin-top:4px}
.fmenu{display:flex;justify-content:center;gap:30px;flex-wrap:wrap;margin-top:34px;font-family:var(--en);font-size:13px;letter-spacing:.18em}
.fmenu a{color:#b5b1a6;transition:color .3s}
.fmenu a:hover{color:#c9a76e}
.copy{margin-top:40px;font-family:var(--en);font-size:11px;letter-spacing:.3em;color:#565349}
/* ---------- reveal ---------- */
.reveal{opacity:0;transform:translateY(26px);transition:opacity 1s cubic-bezier(.22,.6,.2,1),transform 1s cubic-bezier(.22,.6,.2,1)}
.reveal.in{opacity:1;transform:none}
/* ---------- single / archive ---------- */
.page-head{padding:150px 0 0}
.article{padding:40px 0 110px}
.article .meta{display:flex;gap:16px;align-items:center;color:var(--mute);font-family:var(--en);font-size:12px;letter-spacing:.3em;text-transform:uppercase;margin-bottom:14px}
.article h1.title{font-family:var(--serif);font-size:clamp(26px,4vw,42px);font-weight:600;letter-spacing:.08em;line-height:1.5;margin-bottom:26px}
.article .cover{width:100%;margin:0 0 34px;aspect-ratio:16/9;object-fit:cover}
.article .body{max-width:760px;font-size:15px;line-height:2.3}
.article .body p{margin:0 0 20px}
.article .body img{margin:10px 0}
.backlink{display:inline-block;margin-top:40px;font-family:var(--en);font-size:12px;letter-spacing:.3em;text-transform:uppercase;border-bottom:1px solid var(--brass);padding-bottom:4px;color:var(--soft)}
.postnav{display:flex;justify-content:space-between;gap:20px;max-width:760px;margin-top:36px;border-top:1px solid var(--line);padding-top:22px}
.postnav .pn{display:block;font-size:12px;letter-spacing:.08em;color:var(--mute);max-width:46%}
.postnav .pn strong{display:block;font-family:var(--serif);color:var(--text);font-size:15px;font-weight:600;margin-top:4px}
.postnav .pn.next{margin-left:auto;text-align:right}
.newslist{border-top:1px solid var(--line);max-width:900px}
@media(max-width:860px){
.menu{display:none}
.burger{display:block}
.about .cols{grid-template-columns:1fr;gap:44px}
.grid{grid-template-columns:repeat(2,1fr);gap:14px}
.news__item{grid-template-columns:70px 1fr auto;gap:16px;padding:22px 4px}
.news__thumb{width:70px;height:50px}
.news__date{font-size:13px}
section{padding:90px 0}
.page-head{padding:120px 0 0}
.wrap{padding:0 26px}
header.nav{padding:18px 22px}
header.nav.scrolled{padding:12px 22px}
.contactsec{padding:110px 0}
.btn-line{padding:18px 38px;letter-spacing:.3em}
.ctable .row{grid-template-columns:110px 1fr}
}

/* ---------- blog readability（記事ページ・一覧は読みやすさ優先） ---------- */
.single .article h1.title{font-family:var(--sans);font-weight:700;font-size:clamp(22px,3.4vw,34px);letter-spacing:.03em;line-height:1.65;color:#1b1d21}
.single .article .meta{letter-spacing:.16em;font-size:12.5px;color:#7a7d82}
.single .article .meta span:first-child{font-family:var(--en);font-size:18px;letter-spacing:.22em;color:var(--ink)}
.single .article .body{font-family:var(--sans);font-weight:400;font-size:16px;line-height:1.95;letter-spacing:.02em;color:#1f2125;max-width:720px}
.single .article .body p{margin:0 0 1.6em}
.single .article .body h2{font-weight:700;font-size:20px;line-height:1.6;letter-spacing:.02em;margin:2.2em 0 .8em;padding-bottom:.35em;border-bottom:1px solid var(--line)}
.single .article .body h3{font-weight:700;font-size:17.5px;line-height:1.6;margin:1.8em 0 .6em}
.single .article .body a{color:#2f6f8f;text-decoration:underline;text-underline-offset:3px}
.single .article .body strong{font-weight:700;color:#1b1d21}
.single .article .body li{margin:0 0 .5em 1.4em}
.single .postnav .pn strong{font-family:var(--sans);font-weight:500}
.blog .news__title,.archive .news__title{font-family:var(--sans);font-weight:500;font-size:16px;letter-spacing:.03em;line-height:1.7;color:#222}
@media(max-width:860px){
.single .article h1.title{font-size:21px}
.single .article .body{font-size:16px;line-height:1.9}
.single .article{padding:28px 0 90px}
.blog .news__title,.archive .news__title{font-size:15px}
}

/* ---------- 下層ページのヘッダーは最初から明色＋黒文字 ---------- */
body:not(.home) header.nav{background:rgba(245,245,242,.92);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:var(--ink);border-bottom-color:var(--line)}
body:not(.home) header.nav .logo{text-shadow:none}
body:not(.home) header.nav .logo .jp{color:var(--mute);opacity:1}
body:not(.home) header.nav .menu a{text-shadow:none}
body:not(.home) header.nav .burger{color:var(--ink)}
/* ---------- スクロール時はロゴをフェードアウト ---------- */
header.nav .logo{transition:opacity .35s ease,visibility .35s ease}
body:not(.home) header.nav.scrolled .logo{opacity:0;visibility:hidden;pointer-events:none}

/* ---------- ヘッダー可視性強化＋ブログのみスクロールで隠す ---------- */
header.nav{transition:background .4s ease,color .4s ease,padding .4s ease,transform .35s ease}
.burger{text-shadow:0 1px 8px rgba(0,0,0,.5)}
body:not(.home) .burger{text-shadow:none}
header.nav.hidebar{transform:translateY(-100%)}
/* ---------- スマホ：全画面ハンバーガーメニュー ---------- */
@media(max-width:860px){
.menu.open{display:flex;position:fixed;inset:0;z-index:98;background:rgba(23,25,29,.96);flex-direction:column;justify-content:center;align-items:center;gap:22px;font-size:15px;letter-spacing:.35em;color:#fff}
.menu.open a{text-shadow:none;opacity:.92}
.burger{position:relative;z-index:99}
body.menuopen{overflow:hidden}
body.menuopen header.nav .burger{color:#fff;text-shadow:none}
body.menuopen header.nav{background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;border-bottom-color:transparent}
}
/* ---------- 画像のスクロール表示（フェードイン） ---------- */
.img-reveal{opacity:0;transform:translateY(28px);transition:opacity .9s cubic-bezier(.22,.6,.2,1),transform .9s cubic-bezier(.22,.6,.2,1)}
.img-reveal.in{opacity:1;transform:none}

/* ---------- お問い合わせを明るい背景に ---------- */
.contactsec{color:var(--ink)}
.contactsec .contact-bg{filter:brightness(1.05) saturate(.85)}
.contactsec .veil{background:rgba(245,245,242,.7)}
.contactsec .en{color:var(--brass-2)}
.contactsec h2{color:var(--ink)}
.contactsec p{color:var(--soft)}
.contactsec .mail{color:var(--soft)}
.btn-line{border-color:var(--line-strong);color:var(--ink)}
.btn-line:hover{color:#fff;border-color:var(--brass)}

/* ---------- 可読性トータル調整 ---------- */
.about p{font-size:15px;color:var(--soft)}
.news__cat{font-size:11px;color:var(--soft)}
.shot span{font-size:11px;color:rgba(255,255,255,.92)}
.ctable dt{font-size:13px;color:var(--soft)}
.ctable dd{font-size:15px}
.contactsec .mail{font-size:14px}
.article .meta{color:#6b6e73}
.postnav .pn{color:var(--soft)}
.fmenu{font-size:12.5px}
.fmenu a{color:#c6c2b8}
.copy{color:#8b877c}
.more{color:var(--soft)}
/* ---------- 英字ラベルを白／黒に統一（読みやすさ優先） ---------- */
.hero .tag{color:rgba(255,255,255,.95)}
.hero .tag::before{background:rgba(255,255,255,.8)}
.scrollcue{color:rgba(255,255,255,.85)}
.scrollcue span{background:linear-gradient(180deg,#fff,transparent)}
.sechead .en{color:var(--ink)}
.sechead .en::before{background:var(--ink)}
.gallery .sechead .en{color:#fff}
.gallery .sechead .en::before{background:#fff}
.more{color:var(--ink);border-bottom-color:var(--ink)}
.more:hover{color:var(--soft)}
.news__date{color:var(--ink)}
.news__arrow{color:var(--ink)}
.contactsec .en{color:var(--ink)}
.menu a::after{background:currentColor}
.backlink{color:var(--ink);border-bottom-color:var(--ink)}
.fmenu a:hover{color:#fff}
/* ---------- トップ写真上の文字：軽い袋文字（縁取り）＋ぼかし影 ---------- */
/* ========== v4: Coming Soon準拠・全面ベージュ×ブラウン ========== */
:root{--bg:#f4efe6;--bg2:#ece4d6;--mist:#efe8db;--deep:#3f352a;--ink:#3a2f24;--text:#4a3d30;--soft:#7c6d5b;--mute:#9a8c79;--line:rgba(74,61,48,.16);--line-strong:rgba(74,61,48,.34)}
/* トップ：文字なし・中央の写真カード */
.hero{height:auto;min-height:0;display:block;background:var(--bg);color:var(--text);padding:130px 24px 36px}
#blog{padding-top:70px}
.hero .pcard{position:relative;width:min(1080px,100%);aspect-ratio:3/2;margin:0 auto;border-radius:6px;overflow:hidden;box-shadow:0 34px 66px -30px rgba(74,61,48,.55);background:#ddd2c0}
.hero .scrollcue{position:relative;left:auto;bottom:auto;transform:none;margin:-96px auto 0;z-index:3;display:flex;flex-direction:column;align-items:center;gap:9px;color:#fff;font-weight:700;text-shadow:0 1px 4px rgba(0,0,0,.4);font-size:12px}
.hero .scrollcue span{height:56px;width:2px;background:linear-gradient(180deg,#fff,rgba(255,255,255,.15))}
.sechead h2{font-size:clamp(22px,2.6vw,30px)}
/* ヘッダー：全ページ茶文字ベース */
header.nav{color:var(--ink)}
header.nav .logo{text-shadow:none}
header.nav .logo .jp{color:var(--mute);opacity:1}
header.nav .menu a{text-shadow:none}
header.nav .burger{color:var(--ink);text-shadow:none}
header.nav.scrolled{background:rgba(244,239,230,.92)}
body:not(.home) header.nav{background:rgba(244,239,230,.92)}
/* セクション配色 */
.sechead .en::before{display:none}
.about .sechead{margin-bottom:26px}
.news__item:hover{background:rgba(255,255,255,.45)}
.contactsec .veil{background:rgba(244,239,230,.72)}
.menu.open{background:rgba(46,39,33,.97)}
/* フッター：濃いブラウン */
footer.site{background:#2e2721;color:#e9e1d3}
.flogo .jp{color:#9a8c79}
.fmenu a{color:#c9bfae}
.copy{color:#8f8371}
@media(max-width:860px){
.hero{padding:96px 14px 28px}
.hero .pcard{aspect-ratio:9/16;border-radius:5px;box-shadow:0 24px 48px -24px rgba(74,61,48,.55)}
#blog{padding-top:48px}
}

/* ---------- photolog：一覧をダカフェ日記型のフィード表示に ---------- */
.newsfeed{max-width:860px}
.feed__item{padding:44px 0}
.feed__item + .feed__item{border-top:1px solid #ccc7bf}
.feed__item:first-child{padding-top:10px}
.feed__date{font-family:var(--en);font-size:18px;letter-spacing:.24em;color:var(--ink);margin-bottom:4px}
.feed__title{font-family:var(--serif);font-size:19px;font-weight:600;letter-spacing:.08em;line-height:1.6;margin:0 0 20px}
.feed__title a:hover{color:var(--brass-2)}
.feed__body{font-family:var(--sans);font-size:15.5px;line-height:1.95;letter-spacing:.02em;color:var(--text)}
.feed__body p{margin:0 0 1.2em}
.feed__body figure{margin:0 0 20px}
.feed__body img{width:100%;height:auto;margin:0}
@media(max-width:860px){
.feed__item{padding:34px 0}
.feed__date{font-size:16px}
.feed__title{font-size:17px;margin-bottom:14px}
}

/* ---------- v5.4: 日記向けレイアウト（写真を大きく） ---------- */
.single .article .body{max-width:840px;margin:0 auto}
.single .article h1.title,.single .article .meta{max-width:840px;margin-left:auto;margin-right:auto}
.single .article .cover{width:auto;max-width:100%;height:auto;max-height:88vh;aspect-ratio:auto;object-fit:contain;display:block;margin:0 auto 34px;border-radius:4px}
.single .article .body img{max-width:100%;height:auto;display:block;margin:24px auto;border-radius:4px}
.single .postnav{max-width:840px;margin-left:auto;margin-right:auto}

/* ---------- v5.5: お問い合わせの文字ブロックを上へ ---------- */
.contactsec{padding:96px 0 190px}
@media(max-width:860px){.contactsec{padding:70px 0 140px}}

/* ---------- v5.6: Aboutの文章を写真の上端に揃える ---------- */
.about .cols{align-items:start}

/* ---------- v5.7: ライトボックス（クリック拡大） ---------- */
.lb{position:fixed;inset:0;z-index:200;background:rgba(22,19,16,.94);display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease}
.lb.open{opacity:1;visibility:visible}
.lb img{max-width:92vw;max-height:86vh;border-radius:4px;box-shadow:0 30px 80px rgba(0,0,0,.5)}
.lb-btn{position:absolute;background:none;border:0;color:rgba(255,255,255,.85);cursor:pointer;font-size:30px;line-height:1;padding:14px;transition:color .2s;z-index:2}
.lb-btn:hover{color:#fff}
.lb-close{top:12px;right:14px;font-size:36px}
.lb-prev{left:8px;top:50%;transform:translateY(-50%)}
.lb-next{right:8px;top:50%;transform:translateY(-50%)}
body.lbopen{overflow:hidden}
.grid .shot{cursor:default}
.single .article .body img,.single .article .cover{cursor:default}
@media(max-width:860px){.lb-prev,.lb-next{display:none}}

/* ---------- v5.8: ギャラリー写真の角丸 ---------- */
.grid .shot{border-radius:6px}

/* ---------- v5.9: やわらか仕上げ一式 ---------- */
:root{--line:rgba(74,61,48,.12);--line-strong:rgba(74,61,48,.26)}
.news__thumb{border-radius:5px}
.news__item{border-radius:8px}
.about .photo{border-radius:6px}
.about .photo::before{border-radius:6px}
.btn-line{border-radius:8px}
.reveal{transition-duration:1.2s,1.2s}
.img-reveal{transition-duration:1.2s,1.2s}
.news__item{transition:background .45s ease,padding .45s ease}
.menu a::after{transition:width .5s ease}
.shot{transition:transform 1.6s cubic-bezier(.2,.6,.2,1)}

/* ---------- v6.0: Profile統合（About内に会社概要をコンパクト表示） ---------- */
.about .ctable{margin-top:36px;max-width:520px;border-top:1px solid var(--line)}
.about .ctable .row{grid-template-columns:110px 1fr;padding:12px 4px}
.about .ctable dt{font-size:11px}
.about .ctable dd{font-size:13.5px}

/* ---------- v6.1: 背景を白ベースに ---------- */
:root{--bg:#ffffff;--bg2:#f7f5f2;--mist:#f7f5f2}
header.nav.scrolled{background:rgba(255,255,255,.92)}
body:not(.home) header.nav{background:rgba(255,255,255,.92)}
.contactsec .veil{background:rgba(255,255,255,.75)}
.news__item:hover{background:#faf9f7}

/* ---------- v6.2: 英字の文字間を全体的に詰める ---------- */
.nav .logo .en{letter-spacing:.14em}
.menu{letter-spacing:.14em}
.menu.open{letter-spacing:.18em}
.sechead .en{letter-spacing:.22em}
.sechead h2{letter-spacing:.06em}
.more{letter-spacing:.14em}
.news__date{letter-spacing:.08em}
.news__cat{letter-spacing:.2em}
.shot span{letter-spacing:.18em}
.hero .scrollcue{letter-spacing:.22em;text-indent:.22em}
.contactsec .en{letter-spacing:.24em;text-indent:.24em}
.contactsec h2{letter-spacing:.08em}
.btn-line{letter-spacing:.2em}
.contactsec .mail{letter-spacing:.1em}
.article .meta{letter-spacing:.14em}
.backlink{letter-spacing:.14em}
.flogo .en{letter-spacing:.14em}
.fmenu{letter-spacing:.14em}
.copy{letter-spacing:.14em}

/* ---------- v6.3: Mailボタンの枠線を非表示（ホバー時のみ色） ---------- */
.btn-line{border-color:transparent}
.btn-line:hover{border-color:var(--brass)}

/* ---------- v6.4: スライドショーを18枚対応（108秒周期） ---------- */
@keyframes fade18{0%{opacity:0}.95%{opacity:1}4.71%{opacity:1}6.14%{opacity:0}100%{opacity:0}}
@keyframes kb18{0%{transform:scale(1.03)}6.14%{transform:scale(1.12)}100%{transform:scale(1.12)}}
.hs{animation:fade18 102s linear infinite,kb18 102s ease-in-out infinite}

/* ---------- v6.4b: 残る真鍮色をブラウンに統一（ホバー塗り・選択色・下線） ---------- */
.btn-line::before{background:var(--ink)}
.btn-line:hover{color:#fff;border-color:var(--ink)}
::selection{background:var(--ink);color:#fff}
.more:hover{color:var(--mute)}
.menu .cta:hover{border-color:var(--line-strong)}

/* ---------- v6.5: スライドショーを16枚・96秒周期に戻す ---------- */
.hs{animation:fade 96s linear infinite,kb 96s ease-in-out infinite}

/* ---------- v6.6 記事タイトルを全体の雰囲気に統一＋スマホ記事上部の余白圧縮 ---------- */
.single .article h1.title{font-family:var(--serif);font-weight:500;letter-spacing:.06em;line-height:1.7}
@media(max-width:860px){
.single .page-head{padding:76px 0 0}
.single .article{padding:16px 0 90px}
}

/* ---------- v6.7 縦余白の圧縮（トップ写真上・各セクション・ページ見出し上・一覧見出し下） ---------- */
section{padding:84px 0}
.hero{padding:96px 24px 36px}
.page-head{padding:104px 0 0}
.blog .sechead{margin-bottom:28px}
@media(max-width:860px){
section{padding:64px 0}
.hero{padding:72px 14px 28px}
.page-head{padding:76px 0 0}
}

/* ---------- v6.8 お問い合わせ上の余白も統一 ---------- */
.contactsec{padding:84px 0 190px}
@media(max-width:860px){.contactsec{padding:64px 0 140px}}

/* ---------- v6.9 スライドショー17枚・102秒周期（自分の写真1枚目を追加） ---------- */
@keyframes fade17{0%{opacity:0}.94%{opacity:1}4.7%{opacity:1}6.1%{opacity:0}100%{opacity:0}}
@keyframes kb17{0%{transform:scale(1.03)}6.1%{transform:scale(1.12)}100%{transform:scale(1.12)}}
.hs{animation:fade17 102s linear infinite,kb17 102s ease-in-out infinite}

/* ---------- v7.0 スライドショー17枚・102秒周期（ギャラリーと同一構成 2026-07-28） ---------- */
.hs{animation:fade18 102s linear infinite,kb18 102s ease-in-out infinite}
/* ---------- v7.0 SEO用の見出し（デザインには出さず、検索エンジンと読み上げにのみ伝える） ---------- */
.sronly{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}

/* ---------- トップ：写真下部に社名＋一行説明を重ねる ---------- */
.hero__cap{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:64px 36px 30px;background:linear-gradient(180deg,rgba(22,18,14,0) 0%,rgba(22,18,14,.16) 45%,rgba(22,18,14,.56) 100%);pointer-events:none}
.hero__cap h1{margin:0;display:flex;flex-direction:column;gap:8px;color:#fff;font-weight:400;text-shadow:0 1px 12px rgba(0,0,0,.5)}
.hero__name{font-size:clamp(18px,2.05vw,26px);font-weight:600;letter-spacing:.17em;line-height:1.25}
.hero__desc{font-size:clamp(11.5px,1.1vw,14px);letter-spacing:.14em;line-height:1.5;color:rgba(255,255,255,.9)}
@media(max-width:860px){
.hero__cap{padding:64px 20px 104px;background:linear-gradient(180deg,rgba(22,18,14,0) 0%,rgba(22,18,14,.2) 40%,rgba(22,18,14,.6) 100%)}
.hero__name{letter-spacing:.12em}
.hero__desc{letter-spacing:.07em}
}

/* ---------- v7.3: ヒーローの社名テキストを非表示（h1はSEOのためDOMに残す） ---------- */
.hero__cap{position:absolute!important;width:1px;height:1px;padding:0!important;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;background:none!important}


/* v7.9: v7.4の強制表示パッチを撤去（revealフェード復活のため） */


/* ---------- v7.5: ヒーロー切替時の背景をベージュ→黒に ---------- */
.pcard{background-color:#f7f5f2!important}


/* 2026-07-27 About写真を確実表示（遅延読み込みJS不発対策） */
.about .photo{background-image:url("/wp/wp-content/uploads/2026/07/03-hd.webp");opacity:1!important}


/* ---------- v7.8: ギャラリー写真を1枚ずつ順番にフェードイン ---------- */
.shot.reveal{opacity:0;transform:none;transition:transform 1.2s cubic-bezier(.2,.6,.2,1);transition-delay:0s!important}
.shot.reveal.in{opacity:1;animation:shotIn 1.1s cubic-bezier(.22,.6,.2,1) backwards}
.shot.reveal.in:nth-child(3n+2){animation-delay:.18s}
.shot.reveal.in:nth-child(3n){animation-delay:.36s}
@keyframes shotIn{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}