/*
Theme Name: トケイヤビト お問い合わせ（森）
Description: 問い合わせサイト用。ショップのリニューアル（冬の北海道の森）と同じ見た目。FAQは投稿とカテゴリから読む
Version: 1.1.1
Author: 株式会社ヒダネ
Requires at least: 6.3
Requires PHP: 8.1
Text Domain: tokeiyabito-contact
*/

/* 色・書体・余白はショップ（hf-forest.css）と同じ値 */
:root{
  --hf-snow:#FAFAF6; --hf-snow-2:#F0F1EB; --hf-sky:#DCE8EE;
  --hf-bark:#4C433B; --hf-bark-2:#776C61;
  --hf-fir:#2F4B3E; --hf-fir-2:#5F7D6B; --hf-moss:#E7EDE5;
  --hf-fox:#C46A33; --hf-line:#E2E1D8; --hf-night:#22362D;
  --hf-on-night:#F3F4EE; --hf-on-night-2:rgba(243,244,238,.66);
  --hf-font:"Zen Kaku Gothic New","Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic Medium",Meiryo,sans-serif;
  --hf-ease:cubic-bezier(.16,1,.3,1);
  --hf-pop:cubic-bezier(.34,1.56,.64,1);
  --hf-gutter:clamp(16px,4vw,40px);
  --hf-max:1160px;
}
*,*::before,*::after{box-sizing:border-box}
html{font-size:62.5%;background:var(--hf-snow);scroll-behavior:smooth;scroll-padding-top:90px;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--hf-snow);color:var(--hf-bark);font-family:var(--hf-font);font-size:1.55rem;line-height:1.9;letter-spacing:.02em;overflow-x:hidden}
h1,h2,h3{letter-spacing:.04em;text-wrap:balance;color:var(--hf-bark)}
img{max-width:100%;height:auto}
a{color:var(--hf-fir);text-underline-offset:3px}
a:hover{color:var(--hf-fox)}
:focus-visible{outline:2px solid var(--hf-fox);outline-offset:2px}
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap}
.tc-skip:focus{clip:auto;width:auto;height:auto;left:8px;top:8px;z-index:100;background:#fff;padding:.8rem 1.4rem;border-radius:8px}
.tc-wrap{max-width:var(--hf-max);margin:0 auto;padding-inline:var(--hf-gutter);position:relative}
.tc-narrow{max-width:860px}
.tc-sec{position:relative;padding-block:clamp(48px,7vw,96px)}
.tc-sec>.tc-wrap{z-index:1}

/* ---------- ボタン ---------- */
.tc-btn{display:inline-flex;align-items:center;justify-content:center;gap:1rem;font-family:inherit;font-size:1.5rem;font-weight:700;line-height:1.4;text-decoration:none;border:0;border-radius:999px;padding:1.4rem 2.6rem;cursor:pointer;transition:background .25s,color .25s,transform .3s var(--hf-ease);letter-spacing:.04em}
.tc-btn .arr,.arr{display:inline-block;transition:transform .3s var(--hf-ease)}
.tc-btn:hover .arr{transform:translateX(3px)}
.tc-btn--fir{background:var(--hf-fir);color:var(--hf-on-night)}
.tc-btn--fir:hover{background:var(--hf-bark);color:var(--hf-on-night);transform:translateY(-2px)}
.tc-btn--line{box-shadow:inset 0 0 0 1.5px var(--hf-bark);color:var(--hf-bark);background:transparent}
.tc-btn--line:hover{background:var(--hf-bark);color:var(--hf-snow)}

/* ---------- ヘッダー ---------- */
.tc-header{position:sticky;top:0;z-index:20;background:rgba(250,250,246,.88);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--hf-line)}
.home .tc-header{background:rgba(220,232,238,.72);border-bottom-color:transparent}
.tc-header__in{display:flex;align-items:center;justify-content:space-between;gap:1.6rem;min-height:72px}
.tc-logo img{display:block;height:48px;width:auto}
.tc-nav{display:flex;align-items:center;gap:.4rem 2.2rem;font-size:1.4rem}
.tc-nav a{color:var(--hf-bark);text-decoration:none;font-weight:500}
.tc-nav a[aria-current]{color:var(--hf-fir);box-shadow:inset 0 -2px 0 var(--hf-fox)}
.tc-nav a:hover{color:var(--hf-fox)}
.tc-nav__shop{background:var(--hf-fir);color:var(--hf-on-night)!important;border-radius:999px;padding:.6rem 1.6rem}
.tc-nav__shop:hover{background:var(--hf-bark)}
@media (max-width:640px){
  .tc-header__in{min-height:60px}
  .tc-logo img{height:38px}
  .tc-nav{gap:1.2rem;font-size:1.25rem}
  .tc-nav a:not(.tc-nav__shop):first-child{display:none}
  .tc-nav__shop{padding:.5rem 1.2rem}
}

/* ---------- トップの空（ヒーロー） ---------- */
.tc-hero{position:relative;background:linear-gradient(180deg,var(--hf-sky) 0%,#E8EFF1 55%,var(--hf-snow) 100%);overflow:hidden;margin-top:-1px}
.tc-hero__copy{position:relative;z-index:2;padding-top:clamp(36px,6vw,80px)}
.tc-hero h1{margin:0;max-width:14em;font-size:clamp(3rem,4.4vw,5.2rem);line-height:1.3;font-weight:500}
.tc-lede{margin:1.6rem 0 0;max-width:34em;font-size:clamp(1.45rem,1.4vw,1.65rem);line-height:1.95;color:var(--hf-bark)}
.tc-perch{position:absolute;right:0;top:clamp(20px,3vw,48px);width:min(34vw,460px);aspect-ratio:600/420;pointer-events:none;z-index:1}
.tc-perch svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.tc-perch .owl{position:absolute;left:17%;bottom:29.6%;width:14%;height:auto}
@media (max-width:760px){
  .tc-hero__copy{padding-top:28px}
  .tc-hero h1{font-size:7.6vw;max-width:9em}
  .tc-perch{width:44vw;top:6px;right:-6vw}
  .tc-perch .owl{width:20%}
}

/* 検索窓とよく見られている質問 */
.tc-search{margin-top:2.4rem;display:flex;max-width:560px;background:#fff;border-radius:999px;box-shadow:0 0 0 1.5px var(--hf-bark),0 10px 24px -14px rgba(47,75,62,.45);overflow:hidden}
.tc-search input{flex:1;min-width:0;border:0;background:transparent;padding:1.5rem 2.2rem;font-size:1.6rem;font-family:inherit;color:var(--hf-bark);outline:0}
.tc-search input::placeholder{color:#9A9087}
.tc-search button{border:0;background:var(--hf-fir);color:var(--hf-on-night);width:56px;display:grid;place-items:center;cursor:pointer}
.tc-search button svg{width:20px;height:20px}
.tc-search:focus-within{box-shadow:0 0 0 2px var(--hf-fox),0 10px 24px -14px rgba(47,75,62,.45)}
.tc-quick{margin-top:1.4rem;display:flex;flex-wrap:wrap;gap:.8rem;align-items:center;font-size:1.35rem}
.tc-quick span{color:var(--hf-bark-2)}
.tc-quick a{color:var(--hf-bark);text-decoration:none;background:rgba(255,255,255,.75);border-radius:999px;padding:.5rem 1.4rem;box-shadow:inset 0 0 0 1px var(--hf-line)}
.tc-quick a:hover{background:#fff;box-shadow:inset 0 0 0 1px var(--hf-fir)}
@media (max-width:760px){
  .tc-search input{padding:1.3rem 1.8rem}
  .tc-quick{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-right:calc(-1 * var(--hf-gutter));padding-right:var(--hf-gutter)}
  .tc-quick::-webkit-scrollbar{display:none}
  .tc-quick a,.tc-quick span{flex:none}
}

/* ---------- 雪の丘の帯（ヒーローとページ見出しの下） ---------- */
.tc-strip{position:relative;height:clamp(96px,11vw,150px);overflow:hidden;pointer-events:none;margin-top:clamp(12px,2vw,24px)}
.tc-strip svg{position:absolute;bottom:0}
.tc-strip__ground{left:0;width:100%;height:100%}
.tc-strip__side{height:100%;width:auto;aspect-ratio:260/200}
.tc-strip__side.l{left:0}.tc-strip__side.r{right:0}
.tc-strip--hero{height:clamp(84px,9vw,130px);margin-top:clamp(4px,1vw,12px)}
@media (max-width:760px){.tc-strip__side.r{display:none}.tc-strip__side.l{left:-8%}}

/* ---------- ページの見出し ---------- */
.tc-pagehead{position:relative;background:linear-gradient(180deg,var(--hf-sky) 0%,#E8EFF1 60%,var(--hf-snow) 100%);overflow:hidden}
.tc-pagehead .tc-wrap{padding-top:clamp(28px,4vw,52px)}
.tc-pagehead h1{margin:.4rem 0 0;font-size:clamp(2.6rem,3.4vw,3.8rem);line-height:1.4;font-weight:500}
.tc-pagehead .tc-lede{margin-top:1.2rem}
.tc-crumb{margin:0;font-size:1.3rem;color:var(--hf-bark-2);display:flex;gap:.8rem;flex-wrap:wrap}
.tc-crumb a{color:var(--hf-bark-2);text-decoration:none}
.tc-crumb a:hover{color:var(--hf-fox)}
.tc-pagehead--q{padding-bottom:clamp(24px,3vw,40px)}
.tc-pagehead--q h1{display:flex;gap:1.4rem;align-items:flex-start;font-size:clamp(2.2rem,2.8vw,3rem)}
.tc-pagehead--q h1 .tc-q{margin-top:.3em}

/* ---------- 見出しの行 ---------- */
.tc-head{display:flex;justify-content:space-between;align-items:baseline;gap:1.2rem 2rem;flex-wrap:wrap}
.tc-head h2{margin:0;font-size:clamp(2.2rem,2.6vw,3rem);line-height:1.4;font-weight:700}

/* ---------- 故障の窓口（トップのいちばん上） ---------- */
.tc-sec--repair{padding-top:clamp(8px,2vw,24px);padding-bottom:0}
.tc-repair{position:relative;background:#fff;border-radius:clamp(20px,3vw,32px);box-shadow:0 1px 0 var(--hf-line),0 18px 36px -26px rgba(47,75,62,.45);padding:clamp(24px,4vw,44px)}
.tc-repair h2{margin:0;font-size:clamp(2rem,2.4vw,2.6rem);line-height:1.4}
.tc-repair>p{margin:1rem 0 0;font-size:1.45rem;color:var(--hf-bark)}
.tc-repair__critter{position:absolute;right:clamp(18px,4vw,48px);bottom:calc(100% - 12px);width:clamp(44px,4.6vw,60px)}
.tc-repair__choices{margin-top:2rem;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.2rem}
.tc-choice{position:relative;display:grid;gap:.2rem;padding:1.8rem 5rem 1.8rem 2.2rem;border-radius:18px;background:var(--hf-moss);text-decoration:none;color:var(--hf-bark);transition:background .25s,transform .3s var(--hf-ease)}
.tc-choice:hover{background:#DCE6DA;color:var(--hf-bark);transform:translateY(-2px)}
.tc-choice__when{font-size:1.4rem;color:var(--hf-bark-2)}
.tc-choice__what{font-size:2rem;font-weight:700;color:var(--hf-fir)}
.tc-choice .arr{position:absolute;right:2rem;top:50%;translate:0 -50%;font-size:2rem;color:var(--hf-fir)}
.tc-choice:hover .arr{transform:translateX(4px)}
.tc-repair__notes{margin:1.6rem 0 0;padding:0;list-style:none;display:grid;gap:.4rem;font-size:1.35rem;color:var(--hf-bark-2)}
.tc-repair__notes li{display:flex;gap:.8rem}
.tc-repair__notes li::before{content:"";flex:none;width:6px;height:6px;margin-top:.8em;border-radius:50%;background:var(--hf-fox)}
.tc-repair__notes a{margin-left:.4rem;white-space:nowrap}
@media (max-width:640px){
  .tc-repair__choices{grid-template-columns:1fr}
}

/* ---------- よくある質問 ---------- */
.tc-chips{margin-top:1.6rem;display:flex;flex-wrap:wrap;gap:.8rem}
.tc-chips a{font-size:1.4rem;text-decoration:none;color:var(--hf-bark);background:#fff;box-shadow:inset 0 0 0 1px var(--hf-line);border-radius:999px;padding:.6rem 1.6rem;transition:background .3s}
.tc-chips a:hover{background:var(--hf-moss);color:var(--hf-fir)}
.tc-group{margin-top:clamp(36px,5vw,56px);max-width:860px}
.tc-group__head{position:relative;display:flex;align-items:flex-end;gap:1.2rem}
.tc-group__head h2,.tc-group__head h3{margin:0;font-size:1.8rem;font-weight:700;display:flex;align-items:center;gap:1.2rem;flex:1}
.tc-group__head h2::after,.tc-group__head h3::after{content:"";flex:1;border-top:1px dashed var(--hf-line)}
.tc-group__head .tc-critter{width:clamp(40px,4.4vw,56px);height:auto;margin-bottom:-6px}
.tc-faq{margin-top:1.2rem;border-top:1px solid var(--hf-line)}
.tc-faq__item{border-bottom:1px solid var(--hf-line)}
.tc-faq__item summary{list-style:none;cursor:pointer;display:flex;gap:1.2rem;align-items:flex-start;padding:1.7rem 4rem 1.7rem 0;font-size:1.55rem;font-weight:500;line-height:1.6;position:relative}
.tc-faq__item summary::-webkit-details-marker{display:none}
.tc-faq__item summary::after{content:"＋";position:absolute;right:.6rem;top:1.6rem;color:var(--hf-fox);font-weight:700}
.tc-faq__item[open] summary::after{content:"－"}
.tc-faq__item summary:hover .tc-faq__q{color:var(--hf-fir)}
.tc-q{flex:none;display:inline-grid;place-items:center;width:2.6rem;height:2.6rem;border-radius:50%;background:var(--hf-fir);color:var(--hf-on-night);font-size:1.3rem;font-weight:700;line-height:1;margin-top:-.05em}
.tc-faq__a{padding:0 0 2rem 3.8rem;font-size:1.45rem;line-height:1.95}
.tc-faq__a p{margin:0 0 1rem}
.tc-faq__a .wp-block-sgb-btn{margin:.6rem 0 1rem}
.tc-faq__link{font-size:1.25rem}
.tc-faq__link a{color:var(--hf-bark-2)}
.tc-faq--search{margin-top:2.4rem}
@media (max-width:640px){
  .tc-faq__item summary{font-size:1.45rem;padding:1.5rem 3.4rem 1.5rem 0}
  .tc-faq__a{padding-left:0}
}

/* 本文の左右に生える木立（ショップと同じ） */
.hf-grove{position:absolute;bottom:0;width:clamp(0px,calc((100vw - 1160px)/2 + 10px),250px);aspect-ratio:1/1;pointer-events:none;z-index:0;opacity:.6}
.hf-grove.l{left:0}.hf-grove.r{right:0}
.hf-grove svg{width:100%;height:100%;overflow:visible;display:block}
@media (max-width:1240px){.hf-grove{display:none}}

/* ---------- 「見つからないときは」とリクエスト ---------- */
.tc-band{padding-top:clamp(40px,6vw,72px)}
.tc-band__in{position:relative;background:var(--hf-moss);border-radius:clamp(24px,4vw,40px);padding:clamp(28px,4vw,48px) clamp(24px,4vw,52px);display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px 40px;align-items:center}
.tc-band h2,.tc-request h2{margin:0;font-size:clamp(2rem,2.4vw,2.6rem);line-height:1.4}
.tc-band p,.tc-request p{margin:1rem 0 0;font-size:1.45rem;line-height:1.9;max-width:36em}
.tc-band__critter{position:absolute;right:7%;bottom:calc(100% - 10px);width:clamp(50px,5vw,72px)}
.tc-request{padding-top:clamp(20px,3vw,32px)}
.tc-request__in{border-radius:clamp(24px,4vw,40px);padding:clamp(24px,3.6vw,40px) clamp(24px,4vw,52px);display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px 40px;align-items:center;box-shadow:inset 0 0 0 1px var(--hf-line);background:#fff}
@media (max-width:760px){.tc-band__in,.tc-request__in{grid-template-columns:1fr}.tc-band .tc-btn,.tc-request .tc-btn{justify-self:start}}

/* ---------- 本文（固定ページ・答え） ---------- */
.tc-entry{font-size:1.55rem;line-height:1.95}
.tc-entry p{margin:0 0 1.4rem}
.tc-entry h2{font-size:2rem;margin:3.2rem 0 1.2rem;padding-bottom:.8rem;border-bottom:1px dashed var(--hf-line)}
.tc-entry strong{font-weight:700}
.tc-entry hr,.wp-block-sgb-sen{border:0;border-top:1px dashed var(--hf-line);margin:2.8rem 0}
.tc-answer{background:#fff;border-radius:clamp(18px,2.4vw,28px);box-shadow:0 1px 0 var(--hf-line);padding:clamp(22px,3.4vw,40px)}
.tc-answer>:last-child{margin-bottom:0}
.tc-back{margin:3.2rem 0 0;font-size:1.4rem}
.tc-back a{text-decoration:none;color:var(--hf-bark-2)}
.tc-back a:hover{color:var(--hf-fox)}
.tc-aside{margin:2rem 0 0;font-size:1.4rem;color:var(--hf-bark-2)}
.tc-related{margin-top:clamp(32px,4vw,48px)}
.tc-related h2{margin:0;font-size:1.7rem;display:flex;align-items:center;gap:1.2rem}
.tc-related h2::after{content:"";flex:1;border-top:1px dashed var(--hf-line)}
.tc-related ul{list-style:none;margin:1rem 0 0;padding:0}
.tc-related li{border-bottom:1px solid var(--hf-line)}
.tc-related a{display:block;padding:1.2rem 2.4rem 1.2rem 0;text-decoration:none;color:var(--hf-bark);position:relative;font-size:1.45rem}
.tc-related a::after{content:"→";position:absolute;right:.4rem;color:var(--hf-fir)}
.tc-related a:hover{color:var(--hf-fir)}

/* SANGOで作ったボタン・囲み枠を、このテーマの形に（本文はそのまま使う） */
.wp-block-sgb-btn{margin:0 0 1rem}
.wp-block-sgb-btn a.btn{display:flex;align-items:center;justify-content:space-between;gap:1.2rem;width:100%;max-width:560px;background:#fff!important;color:var(--hf-bark)!important;box-shadow:inset 0 0 0 1.5px var(--hf-line);border-radius:16px;padding:1.5rem 2rem;font-weight:700;text-decoration:none;line-height:1.5;transition:box-shadow .2s,transform .3s var(--hf-ease)}
.wp-block-sgb-btn a.btn::after{content:"→";color:var(--hf-fir);flex:none}
.wp-block-sgb-btn a.btn:hover{box-shadow:inset 0 0 0 1.5px var(--hf-fir);transform:translateY(-2px)}
.sng-box,.wp-block-sgb-box{background:var(--hf-snow-2);border-radius:18px;padding:2rem 2.4rem;margin:0 0 2.4rem;font-size:1.45rem}
.sng-box p:last-child{margin-bottom:0}
.keiko_red{color:var(--hf-fox)}
.has-text-align-center{text-align:center}

/* ---------- フォーム（Contact Form 7） ---------- */
.tc-entry--form .wpcf7{margin-top:2.4rem}
.wpcf7-form{background:#fff;border-radius:clamp(18px,2.4vw,28px);box-shadow:0 1px 0 var(--hf-line),0 18px 36px -28px rgba(47,75,62,.4);padding:clamp(22px,3.6vw,44px)}
.wpcf7-form>p,.wpcf7-form p{margin:0 0 1.6rem}
.wpcf7-form label{display:block;font-weight:700;font-size:1.45rem;margin:0 0 1.8rem}
.wpcf7-form-control-wrap{display:block;margin-top:.6rem;font-weight:400}
.wpcf7-form input[type=text],.wpcf7-form input[type=email],.wpcf7-form input[type=tel],.wpcf7-form textarea,.wpcf7-form select{width:100%;font-family:inherit;font-size:1.6rem;color:var(--hf-bark);background:var(--hf-snow);border:1.5px solid var(--hf-line);border-radius:12px;padding:1.2rem 1.4rem;transition:border-color .2s,background .2s}
.wpcf7-form textarea{min-height:180px;resize:vertical;line-height:1.8}
.wpcf7-form input:focus,.wpcf7-form textarea:focus{outline:0;border-color:var(--hf-fir);background:#fff}
.wpcf7-form ::placeholder{color:#A39A90}
.wpcf7-form fieldset{margin:0 0 2rem!important;padding:1.8rem 2rem!important;border:0!important;border-radius:16px!important;background:var(--hf-snow-2)}
.wpcf7-form fieldset fieldset{background:transparent;padding:0!important;margin:1.2rem 0 0!important}
.wpcf7-form legend{font-weight:700;font-size:1.5rem;padding:0!important;margin-bottom:.6rem;float:left;width:100%}
.wpcf7-form legend+*{clear:both}
.wpcf7-checkbox,.wpcf7-radio{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:.6rem}
.wpcf7-list-item{margin:0!important}
.wpcf7-list-item label{margin:0;font-weight:400;display:inline-flex;align-items:center;gap:.6rem;background:#fff;border-radius:999px;padding:.6rem 1.4rem;box-shadow:inset 0 0 0 1px var(--hf-line);cursor:pointer;font-size:1.4rem}
.wpcf7-list-item input{accent-color:var(--hf-fir);width:1.6rem;height:1.6rem;margin:0}
.wpcf7-list-item label:has(input:checked){box-shadow:inset 0 0 0 1.5px var(--hf-fir);background:var(--hf-moss)}
.wpcf7-form .tc-btn{width:100%;max-width:360px;font-size:1.6rem;padding:1.6rem 2.6rem}
.wpcf7-form .tc-btn:disabled{opacity:.5;cursor:not-allowed}
.wpcf7-spinner{vertical-align:middle}
.wpcf7-not-valid-tip{color:#B4462B;font-size:1.3rem;font-weight:500;margin-top:.4rem}
.wpcf7-form .wpcf7-not-valid{border-color:#D08A6E}
.wpcf7 form .wpcf7-response-output{margin:2rem 0 0;padding:1.4rem 1.8rem;border-radius:12px;border:0;font-size:1.4rem;background:var(--hf-moss);color:var(--hf-fir)}
.wpcf7 form.invalid .wpcf7-response-output,.wpcf7 form.unaccepted .wpcf7-response-output,.wpcf7 form.failed .wpcf7-response-output{background:#F7E6DE;color:#9A3C22}
.wpcf7-form section[aria-labelledby]{border-radius:16px!important}
.tc-entry--request{position:relative}
.tc-request__critter{position:absolute;right:clamp(8px,3vw,32px);top:-46px;width:clamp(50px,5vw,72px);z-index:2}

/* ---------- フッター ---------- */
.hf-walk{position:relative;height:clamp(130px,11.5vw,180px);margin-top:clamp(48px,7vw,96px);overflow:hidden;pointer-events:none;--s:1}
.hf-walk__hill{position:absolute;left:0;bottom:0;width:100%;height:30px}
.hf-walk__trees{position:absolute;bottom:22px;height:clamp(120px,11vw,170px);width:auto;aspect-ratio:260/200}
.hf-walk__trees.l{left:6%}.hf-walk__trees.r{right:8%}
.hf-walk .w{position:absolute;z-index:1;left:100%;bottom:25px;width:calc(var(--w) * var(--s));animation:hf-walk var(--t) linear calc(var(--t) * var(--p) * -1) infinite}
.hf-walk .w span{display:block;animation:hf-step var(--st,.4s) ease-in-out infinite alternate}
.hf-walk .w img{display:block;width:100%;height:auto}
.hf-walk .w.hop span{--st:.26s;animation-name:hf-hop}
@keyframes hf-walk{0%{transform:translateX(0)}60%,100%{transform:translateX(calc(-100vw - 100%))}}
@keyframes hf-step{from{transform:translateY(0) rotate(1.5deg)}to{transform:translateY(-3px) rotate(-1.5deg)}}
@keyframes hf-hop{from{transform:translateY(0)}to{transform:translateY(-8px)}}
.hf-js .hf-walk:not(.in) .w,.hf-js .hf-walk:not(.in) .w span{animation-play-state:paused}
@media (max-width:760px){
  .hf-walk{--s:.72;height:120px}
  .hf-walk__trees{height:104px}
  .hf-walk__trees.l{left:-2%}.hf-walk__trees.r{display:none}
  .hf-walk .w{animation-duration:var(--tm);animation-delay:calc(var(--tm) * var(--p) * -1)}
}
.tc-footer{background:var(--hf-night);color:var(--hf-on-night);padding:clamp(28px,4vw,48px) 0 calc(clamp(28px,4vw,48px) + env(safe-area-inset-bottom))}
.tc-footer__in{display:flex;justify-content:space-between;align-items:flex-end;gap:2rem;flex-wrap:wrap}
.tc-footer__links{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.6rem 2.4rem;font-size:1.35rem}
.tc-footer a{color:var(--hf-on-night-2);text-decoration:none}
.tc-footer a:hover{color:#fff}
.tc-footer__copy{margin:0;font-size:1.25rem;color:var(--hf-on-night-2)}

/* ---------- 木が弾んで生え、動物がぴょこっと出る（ショップと同じ） ---------- */
[data-hf-pop] .tree{transform-box:fill-box;transform-origin:50% 100%}
.hf-js [data-hf-pop] .tree{transform:scaleY(0);transition:transform .45s ease-in}
.hf-js [data-hf-pop].in .tree{transform:none;transition:transform .8s var(--hf-pop) var(--d,0s)}
.hf-js [data-hf-pop] .an{opacity:0;translate:0 22px;scale:.85;transition:opacity .3s ease,translate .4s ease-in,scale .4s ease-in}
.hf-js [data-hf-pop].in .an{opacity:1;translate:0 0;scale:1;transition:opacity .4s ease var(--ad,calc(var(--d,0s) + .45s)),translate .7s var(--hf-pop) var(--ad,calc(var(--d,0s) + .45s)),scale .7s var(--hf-pop) var(--ad,calc(var(--d,0s) + .45s))}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .hf-walk .w{animation:none;left:var(--x)}
  .hf-walk .w span{animation:none}
}
