@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@500;600&display=swap");
.ha.ha.ha *{all:revert}
/* 韓国肌管理バッジ型(見本 &me 神戸元町店 kobe.andme-beauty.com/hpb・ハーブピーリング×韓国肌管理)。読みやすい版。
   直したら style.css を作り直す(.ha → .ha.ha.ha と先頭に .ha.ha.ha *{all:revert}) */

.ha.ha.ha{--main:#ff926b;--bg1:#fff7f1;--bg2:#faf7f3;--accent:#3c2924;--btn:#811844;--btnsh:#722323;--text:#343131;--tag:#4b4646;--bar:#7b6a60;--tan:#c6a77b;--gold:#bf9f6a;--mk:#ffda45;--vo:#7a4fb6;--vobg:#fff6e8;
  max-width:480px;margin:0 auto;background:#fff;color:var(--text);font-family:"Noto Sans JP",sans-serif;font-size:16px;font-weight:500;line-height:1.5;letter-spacing:.05em;position:relative;overflow-x:clip}
.ha.ha.ha *{box-sizing:border-box}
.ha.ha.ha img{display:block;max-width:100%}
.ha.ha.ha p{margin:0}
.ha.ha.ha h1,.ha.ha.ha h2,.ha.ha.ha h3{margin:0;font-weight:inherit;font-size:inherit}
.ha.ha.ha ul{margin:0;padding:0;list-style:none}
.ha.ha.ha a{color:inherit;text-decoration:none}
.ha.ha.ha em,.ha.ha.ha i{font-style:normal}
.ha.ha.ha .serif{font-family:"Noto Serif JP",serif}
.ha.ha.ha .en{font-family:"Montserrat",sans-serif}

/* ---- 最初の画面 ---- */
.ha.ha.ha .fv{position:relative;background:#fff}
.ha.ha.ha .fv .hd{display:block;background:var(--bg1);padding:15px 8px 5px;text-align:center;font-size:clamp(17px,5.2vw,20px);font-weight:500;line-height:1.5}
.ha.ha.ha .fv .tz{position:relative;z-index:2;padding:8px 12px 10px;background:linear-gradient(180deg,var(--bg1) 0%,var(--bg1) 55%,rgba(255,247,241,0) 100%)}
.ha.ha.ha .tags{display:flex;flex-wrap:wrap;gap:7px 6px}
.ha.ha.ha .tags li{background:var(--tag);color:#fff;font-size:clamp(12px,3.6vw,14px);line-height:1.35;padding:4px 10px;border-radius:4px;letter-spacing:.04em}
.ha.ha.ha .fv .band{display:inline-block;margin-top:9px;padding:3px 9px 4px;background:var(--main);color:#fff;font-size:clamp(19px,5.9vw,23px);font-weight:500;letter-spacing:.08em;line-height:1.45;border:2px solid rgba(255,255,255,.75)}
.ha.ha.ha .fv .ph{position:relative;margin-top:-26px;aspect-ratio:390/530;overflow:hidden}
.ha.ha.ha .fv .ph>img{width:100%;height:100%;object-fit:cover;object-position:50% 0}
.ha.ha.ha .fv .ph:after{content:"";position:absolute;left:0;right:0;bottom:0;height:42%;background:linear-gradient(180deg,rgba(255,255,255,0),rgba(255,255,255,.55) 45%,rgba(255,255,255,.88))}
.ha.ha.ha .fv .cp{position:absolute;left:12px;right:12px;bottom:14px;z-index:1;color:var(--text)}
.ha.ha.ha .fv .ld span{display:inline-block;background:rgba(255,255,255,.82);padding:1px 7px 2px;font-size:clamp(16px,5.4vw,21px);font-weight:500;letter-spacing:.06em}
.ha.ha.ha .fv .ch{display:flex;align-items:center;flex-wrap:wrap;gap:0;margin-top:9px;font-size:clamp(22px,7vw,28px);line-height:1.3}
.ha.ha.ha .fv .ch b{position:relative;font-weight:500;background:var(--main);color:#fff;padding:2px 8px 3px;letter-spacing:.1em}
.ha.ha.ha .fv .ch b+b{margin-left:1.3em}
.ha.ha.ha .fv .ch b+b:before{content:"×";position:absolute;left:-1.12em;top:50%;transform:translateY(-52%);color:var(--tag);font-weight:400;letter-spacing:0}
.ha.ha.ha .fv .ch .af{margin-left:.3em;color:var(--tag)}
.ha.ha.ha .fv .big{margin-top:9px}
.ha.ha.ha .fv .big span{display:block;background:var(--main);color:#fff;padding:6px 8px 7px;font-size:clamp(18px,5.9vw,24px);font-weight:500;letter-spacing:.06em;line-height:1.35;text-align:center}
.ha.ha.ha .fv .pn{padding:6px 12px 0;font-size:11px;color:#7a7474;letter-spacing:.02em;text-align:right}
/* 口コミ評価の金のバッジ(月桂樹) */
.ha.ha.ha .bdg{display:flex;justify-content:center;gap:4%;padding:18px 10px 0}
.ha.ha.ha .bdg .lr{position:relative;width:46%;max-width:172px;aspect-ratio:1/0.86;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;font-family:"Noto Serif JP",serif;color:#2b2727;line-height:1.25;
  background:url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 172"%3E%3Cg fill="%23bf9f6a"%3E%3Cg id="l"%3E%3Cellipse cx="40" cy="140" rx="7" ry="15" transform="rotate(-55 40 140)"/%3E%3Cellipse cx="25" cy="118" rx="7" ry="15" transform="rotate(-35 25 118)"/%3E%3Cellipse cx="16" cy="93" rx="7" ry="15" transform="rotate(-15 16 93)"/%3E%3Cellipse cx="15" cy="67" rx="7" ry="15" transform="rotate(5 15 67)"/%3E%3Cellipse cx="21" cy="42" rx="7" ry="14" transform="rotate(25 21 42)"/%3E%3Cellipse cx="34" cy="21" rx="6" ry="13" transform="rotate(45 34 21)"/%3E%3Cellipse cx="49" cy="132" rx="5" ry="12" transform="rotate(-100 49 132)"/%3E%3Cellipse cx="34" cy="108" rx="5" ry="12" transform="rotate(-80 34 108)"/%3E%3Cellipse cx="28" cy="82" rx="5" ry="12" transform="rotate(-60 28 82)"/%3E%3Cellipse cx="30" cy="57" rx="5" ry="11" transform="rotate(-40 30 57)"/%3E%3Cpath d="M60 160 Q10 110 34 14" fill="none" stroke="%23bf9f6a" stroke-width="2.4"/%3E%3C/g%3E%3Cuse href="%23l" transform="translate(200 0) scale(-1 1)"/%3E%3C/g%3E%3C/svg%3E') center/100% 100% no-repeat}
.ha.ha.ha .bdg small{display:block;font-size:clamp(10px,3.1vw,12.5px);letter-spacing:.04em}
.ha.ha.ha .bdg span{display:block;font-size:clamp(11px,3.4vw,13.5px);margin-top:2px}
.ha.ha.ha .bdg b{display:inline-block;font-weight:600;font-size:clamp(20px,6.4vw,26px);line-height:1.15;background:linear-gradient(transparent 70%,var(--mk) 70%);padding:0 2px}
.ha.ha.ha .bdg b i{font-size:.48em;font-weight:500}
.ha.ha.ha .bdg em{display:block;font-size:clamp(8.5px,2.6vw,10px);margin-top:4px;letter-spacing:.02em}
.ha.ha.ha .fv .tl{text-align:center;padding:18px 12px 22px}
.ha.ha.ha .fv .tl span{display:inline;font-size:clamp(17px,5.2vw,20px);line-height:1.6;border-bottom:1px solid var(--text);padding-bottom:2px}

/* ---- オファー(価格と予約ボタン) ---- */
.ha.ha.ha .cta{background:var(--bg1);padding:56px 0 60px}
.ha.ha.ha .cta .in{max-width:370px;margin:0 auto;padding:0 20px}
.ha.ha.ha .mk{font-size:clamp(17px,5.2vw,20px);font-weight:500;line-height:2.05;margin-bottom:30px}
.ha.ha.ha .mk span{background:var(--main);color:#fff;padding:3px 6px;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.ha.ha.ha .pc{position:relative;background:#fff;border-radius:2px;box-shadow:0 2px 10px rgba(0,0,0,.12);padding:22px 14px 14px;margin-top:20px}
.ha.ha.ha .pc .tg{position:absolute;left:10px;top:-13px;background:var(--tan);color:#fff;font-size:12.5px;font-weight:700;padding:3px 9px;border-radius:2px;letter-spacing:.06em}
.ha.ha.ha .pc .was{display:flex;align-items:center;flex-wrap:wrap;gap:4px;font-size:clamp(13px,4vw,15.5px);font-weight:500}
.ha.ha.ha .pc .was b{position:relative;font-weight:500;background:var(--main);color:#fff;padding:0 5px;font-size:.95em;line-height:1.45}
.ha.ha.ha .pc .was b+b{margin-left:16px}
.ha.ha.ha .pc .was b+b:before{content:"×";position:absolute;left:-15px;top:50%;transform:translateY(-52%);color:#9b9494;letter-spacing:0}
.ha.ha.ha .pc .now{display:flex;align-items:flex-end;gap:8px;margin-top:4px}
.ha.ha.ha .pc .ar{flex:none;width:16px;height:30px;border-left:2px solid var(--text);border-bottom:2px solid var(--text);margin:0 0 14px 4px;position:relative}
.ha.ha.ha .pc .ar:after{content:"";position:absolute;right:-6px;bottom:-6px;border:5px solid transparent;border-left:7px solid var(--text)}
.ha.ha.ha .pc .off{flex:none;background:var(--main);color:#fff;font-family:"Montserrat",sans-serif;font-weight:600;font-size:13px;line-height:1.1;padding:4px 5px;text-align:center;margin-bottom:6px;margin-left:6px;letter-spacing:.02em}
.ha.ha.ha .pc .num{font-size:clamp(15px,4.6vw,18px);white-space:nowrap;background:linear-gradient(transparent 72%,var(--mk) 72%);padding:0 2px;line-height:1.2}
.ha.ha.ha .pc .num b{font-family:"Montserrat",sans-serif;font-weight:500;font-size:clamp(38px,12.3vw,50px);letter-spacing:.06em;line-height:1}
.ha.ha.ha .pc .pnt{margin-top:8px;font-size:12px;line-height:1.55;color:#5c5656;text-align:center}
.ha.ha.ha .menu{position:relative;margin-top:36px;border:1px solid var(--text);padding:18px 10px 12px}
.ha.ha.ha .menu .mt{position:absolute;left:0;right:0;top:-13px;text-align:center;line-height:1.5}
.ha.ha.ha .menu .mt span{background:var(--bg1);padding:0 8px;font-size:16px}
.ha.ha.ha .menu ul{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.ha.ha.ha .menu img{width:100%;aspect-ratio:1;object-fit:cover}
.ha.ha.ha .menu li span{display:block;margin-top:6px;font-size:clamp(10px,3vw,11.5px);text-align:center;line-height:1.35;letter-spacing:0}
.ha.ha.ha .cta .nt{width:max-content;max-width:100%;margin:26px auto 10px;font-size:15px;line-height:1.2;position:relative;text-align:center}
.ha.ha.ha .cta .nt:before,.ha.ha.ha .cta .nt:after{content:"";position:absolute;bottom:0;width:1px;height:14px;background:var(--text)}
.ha.ha.ha .cta .nt:before{left:-10px;transform:rotate(-16deg)}
.ha.ha.ha .cta .nt:after{right:-10px;transform:rotate(16deg)}
.ha.ha.ha .btn{position:relative;display:flex;align-items:center;justify-content:center;width:100%;max-width:310px;margin:0 auto;min-height:56px;padding:12px 40px 12px 52px;border-radius:30px;background:var(--btn);color:#fff;font-size:clamp(13px,4vw,15px);font-weight:700;letter-spacing:.06em;line-height:1.35;text-align:center;box-shadow:2px 3px 0 var(--btnsh)}
.ha.ha.ha .ic{position:absolute;left:22px;top:50%;width:13px;height:19px;margin-top:-10px;border:2px solid #fff;border-radius:3px}
.ha.ha.ha .ic:after{content:"";position:absolute;left:3px;right:3px;bottom:2px;height:2px;background:#fff;border-radius:1px}
.ha.ha.ha .cv{position:absolute;right:20px;top:50%;width:8px;height:8px;margin-top:-4px;border-top:2px solid #fff;border-right:2px solid #fff;transform:rotate(45deg)}
.ha.ha.ha .cta .ln{display:block;width:max-content;margin:14px auto 0;font-size:13px;color:#5c5656;text-decoration:underline;text-underline-offset:3px}

/* ---- 見出しの共通(上に細い縦線) ---- */
.ha.ha.ha .st{display:block;text-align:center;font-size:clamp(17px,5.2vw,20px);font-weight:700;line-height:1.5;padding:0 12px}
.ha.ha.ha .st.ln2:before{content:"";display:block;width:1px;height:28px;background:var(--text);margin:0 auto 6px}
.ha.ha.ha .st em{background:linear-gradient(transparent 78%,var(--mk) 78%)}
.ha.ha.ha .sn{width:90%;max-width:370px;margin:16px auto 0;font-size:11px;color:#7a7474;line-height:1.6}

/* ---- 施術前・後(あるときだけ) ---- */
.ha.ha.ha .ba{padding:60px 0;background:#fff}
.ha.ha.ha .ba .bx{width:90%;max-width:370px;margin:40px auto 0}
.ha.ha.ha .ba figure{margin:0 0 34px;box-shadow:0 1px 6px rgba(0,0,0,.15)}
.ha.ha.ha .ba figure img{width:100%}
.ha.ha.ha .ba figcaption{font-size:12px;padding:6px 10px;color:#5c5656;background:#fff}

/* ---- お客様の声(あるときだけ) ---- */
.ha.ha.ha .vo{padding:60px 0;background:#fff}
.ha.ha.ha .vo .st{line-height:1.6}
.ha.ha.ha .vl{width:85%;max-width:330px;margin:48px auto 0;display:flex;flex-direction:column;gap:38px}
.ha.ha.ha .vc{border:1px solid #e3d7c8;border-radius:8px;overflow:hidden;background:#fff}
.ha.ha.ha .vh{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;background:var(--vobg);padding:10px 10px 8px;border-bottom:2px solid var(--vo)}
.ha.ha.ha .vh i{width:22px;height:22px;border-radius:50% 50% 4px 4px;background:var(--vo);position:relative;flex:none}
.ha.ha.ha .vh i:after{content:"";position:absolute;left:6px;top:4px;width:10px;height:10px;border-radius:50%;background:var(--vobg)}
.ha.ha.ha .vh b{font-size:14px;font-weight:700;color:#5c5656}
.ha.ha.ha .vh small{display:block;width:100%;text-align:right;font-size:10.5px;color:#6f6a6a}
.ha.ha.ha .vb{padding:10px 10px 8px}
.ha.ha.ha .vb .sc{font-size:14px;font-weight:700;color:#5c5656}
.ha.ha.ha .vb .sc span{color:var(--vo);margin-left:8px;letter-spacing:0}
.ha.ha.ha .vb .sb{font-size:10px;color:#6f6a6a;margin-top:2px}
.ha.ha.ha .vb .tx{font-size:12px;line-height:1.75;color:#5c5656;margin-top:10px;font-weight:400}
.ha.ha.ha .vb .dt{font-size:10px;color:#6f6a6a;text-align:right;margin-top:8px}

/* ---- アクセス ---- */
.ha.ha.ha .ac{background:var(--bg2);padding:60px 0}
.ha.ha.ha .ac .sh{display:block;text-align:center;margin-top:36px;padding:0 16px}
.ha.ha.ha .ac .sh span{display:inline;font-size:clamp(17px,5.2vw,20px);font-weight:700;line-height:1.7;border-bottom:1px solid var(--text);padding-bottom:3px}
.ha.ha.ha .ac .in{max-width:370px;margin:30px auto 0;padding:0 20px}
.ha.ha.ha .ac .aph{width:100%;aspect-ratio:3/2;object-fit:cover;margin-bottom:14px}
.ha.ha.ha .ac iframe{display:block;width:100%;height:240px;border:0;margin-bottom:22px;background:#ece6dd}
.ha.ha.ha .ac dl{margin:0 0 18px}
.ha.ha.ha .ac dt span{display:inline-block;background:var(--accent);color:#fff;font-size:17px;padding:0 5px;line-height:1.55}
.ha.ha.ha .ac dd{margin:10px 0 0;font-size:15.5px;line-height:1.65;font-weight:400}

/* ---- こんな方におすすめ(開閉) ---- */
.ha.ha.ha .wo{padding:60px 0;background:#fff}
.ha.ha.ha .wl{width:90%;max-width:370px;margin:12px auto 0}
.ha.ha.ha .wl details{margin-top:28px}
.ha.ha.ha .wl summary{list-style:none;cursor:pointer;position:relative;background:var(--accent);color:#fff;font-size:clamp(15.5px,4.62vw,18px);font-weight:700;line-height:1.55;padding:8px 46px 8px 15px}
.ha.ha.ha .wl summary::-webkit-details-marker{display:none}
.ha.ha.ha .wl summary:after{content:"";position:absolute;top:13px;right:14px;width:8px;height:8px;border-top:2px solid #fff;border-left:2px solid #fff;transform:rotate(-135deg)}
.ha.ha.ha .wl details[open] summary:after{transform:rotate(45deg);top:18px}
.ha.ha.ha .wl details p{margin-top:10px;font-size:15px;line-height:1.75;font-weight:400}

/* ---- 解決できる理由 ---- */
.ha.ha.ha .bs{background:var(--bg2);padding:60px 0 0}
.ha.ha.ha .bs .st .pre,.ha.ha.ha .bs .st .post{display:block}
.ha.ha.ha .bs .st .tags{justify-content:center;margin:10px auto 14px;max-width:320px;gap:6px}
.ha.ha.ha .bs .st .tags li{font-size:clamp(11.5px,3.4vw,13px);font-weight:500;padding:3px 9px}
.ha.ha.ha .bs .card{width:90%;max-width:330px;margin:34px auto 0;background:#fff;border-radius:10px;padding:26px 16px 20px;text-align:center}
.ha.ha.ha .bs .cl{font-size:clamp(15px,4.6vw,17px);font-weight:700}
.ha.ha.ha .bs .bars{display:flex;flex-direction:column;align-items:center;gap:8px;margin:12px 0}
.ha.ha.ha .bs .bars li{background:var(--bar);color:#fff;font-size:clamp(14px,4.4vw,17px);font-weight:700;padding:2px 12px;letter-spacing:.06em}
.ha.ha.ha .bs .card img{width:100%;aspect-ratio:16/9;object-fit:cover;margin-top:16px;border-radius:4px}
.ha.ha.ha .bs .bt{text-align:center;font-size:clamp(17px,5.2vw,20px);font-weight:700;line-height:1.55;margin-top:40px;padding:0 14px}
.ha.ha.ha .bs .tri{display:block;width:0;height:0;margin:14px auto 0;border-left:105px solid transparent;border-right:105px solid transparent;border-top:36px solid var(--main)}
.ha.ha.ha .bs .how{position:relative;width:90%;max-width:370px;margin:28px auto 0}
.ha.ha.ha .bs .how>img{width:100%;aspect-ratio:351/290;object-fit:cover}
.ha.ha.ha .bs .co{position:absolute;left:16px;display:flex;align-items:flex-start;gap:6px}
.ha.ha.ha .bs .co span{display:block;background:#fff;border:1.5px solid var(--main);color:var(--text);font-size:clamp(14.5px,4.6vw,18px);font-weight:700;line-height:1.5;padding:2px 6px;letter-spacing:.04em}
.ha.ha.ha .bs .co i{flex:none;position:relative;width:10px;height:62px;background:var(--main);margin-top:4px}
.ha.ha.ha .bs .co i:after{content:"";position:absolute;left:-7px;border:12px solid transparent}
.ha.ha.ha .bs .c1{top:-14px}
.ha.ha.ha .bs .c1 i:after{bottom:-20px;border-top:12px solid var(--main);border-bottom:0}
.ha.ha.ha .bs .c2{bottom:16px;align-items:flex-end}
.ha.ha.ha .bs .c2 i{margin:0 0 4px}
.ha.ha.ha .bs .c2 i:after{top:-20px;border-bottom:12px solid var(--main);border-top:0}
.ha.ha.ha .bs .bn{position:relative;width:90%;max-width:370px;margin:48px auto 0;overflow:hidden}
.ha.ha.ha .bs .bn>img{width:100%;aspect-ratio:351/278;object-fit:cover;object-position:0% 30%}
.ha.ha.ha .bs .bn:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.78),rgba(255,255,255,.35) 45%,rgba(255,255,255,0) 66%)}
.ha.ha.ha .bs .bc{position:absolute;left:12px;right:12px;top:16px;bottom:14px;z-index:1;display:flex;flex-direction:column}
.ha.ha.ha .bs .bc li{font-size:clamp(17px,5.4vw,21px);font-weight:600;line-height:1.45;color:var(--text)}
.ha.ha.ha .bs .bc li:before{content:"・"}
.ha.ha.ha .bs .bc .mid{margin-top:4px}
.ha.ha.ha .bs .bc .mid span{font-size:clamp(17px,5.3vw,21px);font-weight:700;background:linear-gradient(rgba(255,255,255,.7) 70%,var(--mk) 70%);padding:0 4px}
.ha.ha.ha .bs .bc .cc{margin-top:auto;font-size:clamp(19px,6vw,24px);line-height:1.95}
.ha.ha.ha .bs .bc .cc span{background:var(--main);color:#fff;padding:3px 8px;-webkit-box-decoration-break:clone;box-decoration-break:clone;letter-spacing:.06em}

/* ---- よくある質問 ---- */
.ha.ha.ha .qa{padding:56px 0 60px;background:#fff}
.ha.ha.ha .ql{width:90%;max-width:370px;margin:24px auto 0}
.ha.ha.ha .ql details{margin-top:24px}
.ha.ha.ha .ql summary{list-style:none;cursor:pointer;position:relative;display:flex;gap:6px;background:var(--main);color:#fff;font-size:clamp(15.5px,4.62vw,18px);font-weight:700;line-height:1.5;padding:8px 34px 8px 8px;letter-spacing:.02em}
.ha.ha.ha .ql summary::-webkit-details-marker{display:none}
.ha.ha.ha .ql summary i{flex:none;font-family:"Montserrat",sans-serif}
.ha.ha.ha .ql summary:after{content:"";position:absolute;top:50%;right:14px;width:8px;height:8px;margin-top:-7px;border-top:2px solid #fff;border-left:2px solid #fff;transform:rotate(-135deg)}
.ha.ha.ha .ql details[open] summary:after{transform:rotate(45deg);margin-top:-2px}
.ha.ha.ha .ql details p{margin-top:10px;padding:0 4px;font-size:15px;line-height:1.8;font-weight:500}

/* ---- いちばん下 ---- */
.ha.ha.ha .ft{padding:18px 16px 92px;text-align:center;background:#fff}
.ha.ha.ha .nts{text-align:left;max-width:370px;margin:0 auto 14px}
.ha.ha.ha .nts li{font-size:11px;line-height:1.6;color:#6f6a6a;letter-spacing:.02em}
.ha.ha.ha .cr{font-size:12px;letter-spacing:.06em}
/* 下に固定の予約の帯(少し下へ進むと出る) */
.ha.ha.ha .fx{position:fixed;left:0;right:0;bottom:0;z-index:50}
.ha.ha.ha .fx a{position:relative;display:block;max-width:480px;margin:0 auto;background:var(--btn);color:#fff;text-align:center;padding:9px 40px 11px}
.ha.ha.ha .fx small{position:relative;display:inline-block;font-size:12px;line-height:1.2}
.ha.ha.ha .fx small:before,.ha.ha.ha .fx small:after{content:"";position:absolute;bottom:0;width:1px;height:11px;background:#fff}
.ha.ha.ha .fx small:before{left:-9px;transform:rotate(-16deg)}
.ha.ha.ha .fx small:after{right:-9px;transform:rotate(16deg)}
.ha.ha.ha .fx b{display:block;font-size:clamp(14px,4.2vw,15px);font-weight:700;letter-spacing:.06em;margin-top:6px;line-height:1.3}
.ha.ha.ha .fx .ic{left:16px;width:15px;height:22px;margin-top:-11px}
.ha.ha.ha .fx .cv{right:16px;width:12px;height:12px;margin-top:-6px}
@supports (animation-timeline:scroll()){
  .ha.ha.ha .fx{animation:haFxShow linear both;animation-timeline:scroll(root);animation-range:560px 700px}
}
@keyframes haFxShow{from{transform:translateY(110%)}to{transform:none}}