/* 夜tax LP「夜taxに頼むと、こうなります」（2026-10-26 v3・スマホ前提・1 枚の場面で見せる）
   ・v6（10-26 夜）：女性を写真に（長袖の白いニットの写真＝他⑨.png。肩を出した写真は広告審査を考えてやめた。案B＝大きめ。左の列 44%・写真は左の縁まで出す・320px は列 34%）
   ・左にドレス姿の女性（前から LP で使っている女性 3 人の絵の左の人を切り出し）、右に吹き出し 3 つ
     あなた：送るだけ／夜tax：申告まで丸投げ／税務署は夜taxがブロック（連絡も窓口に。整理してお伝え）
   ・下に短い札 3 つ（彼氏・職場を通さない／申告後も同じ税理士／全業種に対応）
   ・アイコンは事務所の素材（iStock 2075075242「税理士事務所アイコン_モノクロ」★資料作成の素材一覧\06_お金・会計・税務）の線をそのまま SVG にしたもの
   ・文字はページの Web フォント（Noto Sans JP の絞り込み版）にある字だけ。色は確定 FV の 8 色。PC も同じ組み方で横 440px */
.content-solve .nt-solveflow{
  --sf-ink:var(--nt-ink,#453B43);--sf-rose:var(--nt-rose,#A7446B);--sf-sub:var(--nt-sub,#6F5B66);--sf-line:var(--nt-line,#E7D6DF);
  --sf-band:linear-gradient(135deg,#B54D74 0%,#8E4D6A 100%);
  max-width:440px;margin:10px auto 0;padding:0;box-sizing:border-box;color:var(--sf-ink);text-align:left;
  font-family:var(--nt-sans,"Noto Sans JP","Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif)}
.content-solve .nt-solveflow *{box-sizing:border-box}
/* 下ごしらえは :where で強さを上げない（強いと吹き出し・札の余白まで消える＝10-26 に一度消えた） */
.content-solve .nt-solveflow :where(p,ul,ol,li){margin:0;padding:0;list-style:none;letter-spacing:normal}
.content-solve .nt-solveflow .nt-solveflow__seg{display:inline-block}
.content-solve .nt-solveflow svg{display:block;width:100%;height:100%;overflow:visible}
.content-solve .nt-solveflow svg path{fill:none;stroke:currentColor;stroke-width:1.8px;vector-effect:non-scaling-stroke;stroke-linecap:round;stroke-linejoin:round}
.content-solve .nt-solveflow svg .f{fill:currentColor;stroke:none}
.content-solve .nt-solveflow .nt-solveflow__sr{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* 場面：左に女性・右に吹き出し（女性は下の縁まで） */
.content-solve .nt-solveflow__scene{position:relative;display:grid;grid-template-columns:44% minmax(0,1fr);column-gap:6px;align-items:end;padding:14px 12px 0 0;border-radius:20px;overflow:hidden;background:linear-gradient(160deg,#FFF7FA 0%,#F3E5EC 100%)}
/* 長袖の写真は横に広い（顔は幅の 25〜60%）＝左は袖だけ縁で切り、右の腕は吹き出しの下にくぐらせる（吹き出しは position:relative で写真より上に描かれる） */
.content-solve .nt-solveflow__woman{display:block;width:120%;max-width:none;height:auto;margin-left:-8%}
.content-solve .nt-solveflow__talk{align-self:center;display:flex;flex-direction:column;gap:10px;padding-bottom:14px}
/* 吹き出し（しっぽは女性の側） */
.content-solve .nt-solveflow__bubble{position:relative;padding:9px 12px 10px;border-radius:14px;background:#fff;box-shadow:0 2px 0 rgba(167,68,107,.08)}
.content-solve .nt-solveflow__bubble::before{content:"";position:absolute;left:-7px;top:16px;border-top:7px solid transparent;border-bottom:7px solid transparent;border-right:8px solid #fff}
.content-solve .nt-solveflow__who{display:inline-block;margin-bottom:2px;padding:1px 8px;border-radius:999px;background:#FFF7FA;font-size:11px;line-height:1.5;font-weight:700;color:var(--sf-rose)}
.content-solve .nt-solveflow__big{font-size:19px;line-height:1.35;font-weight:700;color:var(--sf-ink)}
.content-solve .nt-solveflow__small{margin-top:2px!important;font-size:12.5px;line-height:1.5;color:var(--sf-sub)}
.content-solve .nt-solveflow__em{color:var(--sf-rose)}
/* 夜tax：濃いローズの吹き出しに、整理・計算・申告書のアイコン 3 つ */
.content-solve .nt-solveflow__bubble--tax{background:#A84A70;background:var(--sf-band);color:#fff}
.content-solve .nt-solveflow__bubble--tax::before{border-right-color:#B14C73}
.content-solve .nt-solveflow__bubble--tax .nt-solveflow__who{background:rgba(255,255,255,.2);color:#fff}
.content-solve .nt-solveflow__bubble--tax .nt-solveflow__big{color:#fff}
.content-solve .nt-solveflow__icons{display:flex;gap:8px;margin:4px 0 4px}
.content-solve .nt-solveflow__icons > span{display:block;width:28px;height:28px;color:#fff}
/* 税務署は夜taxがブロック：盾の人のアイコン */
.content-solve .nt-solveflow__bubble--guard{display:grid;grid-template-columns:30px minmax(0,1fr);column-gap:7px;align-items:center;padding-left:9px}
.content-solve .nt-solveflow__gicon{display:block;width:30px;height:30px;padding:6px;border-radius:50%;background:var(--sf-band);color:#fff}
.content-solve .nt-solveflow__bubble--guard .nt-solveflow__big{font-size:17px}

/* 下の札 3 つ */
.content-solve .nt-solveflow__chips{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin-top:12px}
.content-solve .nt-solveflow__chips li{position:relative;padding:5px 12px 5px 26px;border-radius:999px;background:#fff;border:1px solid var(--sf-line);font-size:13px;line-height:1.5;font-weight:700;color:var(--sf-ink);white-space:nowrap}
.content-solve .nt-solveflow__chips li::before{content:"";position:absolute;left:11px;top:50%;width:9px;height:5px;margin-top:-4px;border-left:2px solid var(--sf-rose);border-bottom:2px solid var(--sf-rose);transform:rotate(-45deg)}

/* 351〜380px（375px の機種）：写真の列を広げた分、右が狭い＝「夜taxがブロック」を 1 行に収める */
@media screen and (min-width:351px) and (max-width:380px){
  .content-solve .nt-solveflow__bubble--guard .nt-solveflow__big{font-size:16px}
}

/* 350px 以下（320px の機種） */
@media screen and (max-width:350px){
  .content-solve .nt-solveflow__scene{grid-template-columns:34% minmax(0,1fr);column-gap:8px;padding-right:8px}
  .content-solve .nt-solveflow__woman{width:140%;margin-left:-10%}
  .content-solve .nt-solveflow__big{font-size:17px}
  .content-solve .nt-solveflow__bubble--guard .nt-solveflow__big{font-size:15.5px}
  .content-solve .nt-solveflow__bubble{padding:8px 10px 9px}
  .content-solve .nt-solveflow__chips li{font-size:12px;padding-right:10px}
}

/* ── v5：女性の上に問いかけの吹き出し「夜taxって、何してくれるの？」（押すと答え＝モーダル） ──
   ・押せることが分かるように：白い吹き出しにローズの枠、下に「答えを見る」の札と、指でタップする手（素材 iStock 1267469417）が時々トンと動く
   ・女性と同じ列の上（右の吹き出しにはかからない） */
.content-solve .nt-solveflow__ask{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:5px;width:auto;margin:0 4px 0 10px;padding:8px 6px 7px;border:1.5px solid var(--sf-rose);border-radius:14px;background:#fff;color:var(--sf-ink);font:inherit;text-align:center;cursor:pointer;box-shadow:0 3px 0 rgba(167,68,107,.14);-webkit-tap-highlight-color:transparent}
.content-solve .nt-solveflow__ask::after{content:"";position:absolute;left:50%;bottom:-8px;width:12px;height:12px;margin-left:-6px;background:#fff;border-right:1.5px solid var(--sf-rose);border-bottom:1.5px solid var(--sf-rose);transform:rotate(45deg)}
.content-solve .nt-solveflow__ask:focus-visible{outline:3px solid #8E4D6A;outline-offset:3px}
.content-solve .nt-solveflow__ask-q{display:block;font-size:12.5px;line-height:1.4;font-weight:700;color:var(--sf-ink)}
.content-solve .nt-solveflow__ask-tap{position:relative;z-index:1;display:inline-flex;align-items:center;gap:3px;padding:2px 9px 2px 5px;border-radius:999px;background:var(--sf-band);color:#fff;font-size:11.5px;line-height:1.5;font-weight:700;white-space:nowrap}
.content-solve .nt-solveflow__ask-hand{display:block;width:17px;height:17px;color:#fff;transform-origin:50% 90%;animation:nt-solveflow-tap 2.4s ease-in-out infinite}
.content-solve .nt-solveflow__ask-hand svg path{stroke-width:1.6px}
@keyframes nt-solveflow-tap{0%,62%,100%{transform:translateY(0) scale(1)}70%{transform:translateY(2px) scale(.9)}78%{transform:translateY(0) scale(1)}84%{transform:translateY(2px) scale(.9)}92%{transform:translateY(0) scale(1)}}
@media (prefers-reduced-motion:reduce){.content-solve .nt-solveflow__ask-hand{animation:none}}
.content-solve .nt-solveflow__scene{cursor:pointer}
/* 左の列：上に問いかけ・下に女性（同じ列に縦に積む＝幅が変わって問いかけが 3 行になっても重ならない） */
.content-solve .nt-solveflow__side{align-self:stretch;display:flex;flex-direction:column;justify-content:space-between;gap:12px;min-width:0}

/* モーダル（閉じているときは必ず消す＝テーマに dialog を block にする指定があっても出ない） */
.content-solve .nt-solveflow-dialog:not([open]){display:none}
.content-solve .nt-solveflow-dialog{width:min(440px,calc(100vw - 24px));max-width:calc(100vw - 24px);max-height:calc(100vh - 40px);max-height:calc(100dvh - 40px);margin:auto;padding:0;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;border:0;border-radius:18px;background:#fff;color:var(--sf-ink);box-shadow:0 20px 60px rgba(69,59,67,.28);text-align:left;font-family:var(--nt-sans,"Noto Sans JP","Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif);-webkit-overflow-scrolling:touch}
.content-solve .nt-solveflow-dialog::backdrop{background:rgba(69,59,67,.6)}
.content-solve .nt-solveflow-dialog__bar{position:sticky;top:0;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 10px 8px 18px;border-bottom:1px solid var(--sf-line);background:#fff}
.content-solve .nt-solveflow-dialog__title{margin:0;font-size:16px;line-height:1.5;font-weight:700;color:var(--sf-ink)}
.content-solve .nt-solveflow-dialog__close{display:inline-flex;align-items:center;gap:6px;min-height:44px;margin:0;padding:0 12px;border:0;border-radius:999px;background:#FFF7FA;color:var(--sf-ink);font:inherit;font-size:14px;font-weight:700;cursor:pointer}
.content-solve .nt-solveflow-dialog__close:focus-visible{outline:3px solid #8E4D6A;outline-offset:2px}
.content-solve .nt-solveflow-dialog__x{position:relative;width:12px;height:12px}
.content-solve .nt-solveflow-dialog__x::before,.content-solve .nt-solveflow-dialog__x::after{content:"";position:absolute;left:5px;top:-1px;width:2px;height:14px;border-radius:1px;background:currentColor;transform:rotate(45deg)}
.content-solve .nt-solveflow-dialog__x::after{transform:rotate(-45deg)}
.content-solve .nt-solveflow-dialog__qa{display:flex;align-items:center;gap:10px;margin:14px 18px 2px;padding:10px 12px;border-radius:14px;background:linear-gradient(135deg,#FFF7FA 0%,#F3E5EC 100%)}
.content-solve .nt-solveflow-dialog__face{flex:0 0 auto;display:block;width:52px;height:52px;max-width:none;border-radius:50%;object-fit:cover;object-position:50% 50%;background:#fff;border:2px solid #fff;box-shadow:0 0 0 1px var(--sf-line)}
.content-solve .nt-solveflow-dialog__q{position:relative;margin:0;padding:7px 12px;border-radius:12px;background:#fff;font-size:15px;line-height:1.45;font-weight:700;color:var(--sf-ink)}
.content-solve .nt-solveflow-dialog__q::before{content:"";position:absolute;left:-7px;top:50%;margin-top:-6px;border-top:6px solid transparent;border-bottom:6px solid transparent;border-right:8px solid #fff}
.content-solve .nt-solveflow-dialog__list{padding:2px 18px 16px}
.content-solve .nt-solveflow-dialog .nt-solveflow-dialog__no{display:block;margin-bottom:1px;font-size:11px;line-height:1.4;font-weight:700;letter-spacing:.08em;color:#C99AB0}
.content-solve .nt-solveflow-dialog__list > li{display:grid;grid-template-columns:40px minmax(0,1fr);column-gap:12px;padding:14px 0;border-bottom:1px solid var(--sf-line)}
.content-solve .nt-solveflow-dialog__list > li:last-child{border-bottom:0}
.content-solve .nt-solveflow-dialog__icon{display:block;width:40px;height:40px;padding:8px;border-radius:50%;background:#FFF7FA;color:var(--sf-rose)}
.content-solve .nt-solveflow-dialog .nt-solveflow-dialog__h{margin:0 0 4px;padding:0;border:0;background:none;font-size:16px;line-height:1.5;font-weight:700;color:var(--sf-rose);text-align:left;letter-spacing:normal}
.content-solve .nt-solveflow-dialog .nt-solveflow-dialog__h::before,.content-solve .nt-solveflow-dialog .nt-solveflow-dialog__h::after{content:none;display:none}
.content-solve .nt-solveflow-dialog__list p{margin:0;font-size:14.5px;line-height:1.75;color:var(--sf-ink)}
@media screen and (max-width:350px){
  .content-solve .nt-solveflow__ask{padding-left:4px;padding-right:4px}
  .content-solve .nt-solveflow__ask-q{font-size:12px}
  .content-solve .nt-solveflow__ask-tap{font-size:11px;padding-right:7px}
  .content-solve .nt-solveflow-dialog__list{padding-left:14px;padding-right:14px}
  .content-solve .nt-solveflow-dialog__qa{margin-left:14px;margin-right:14px}
}
