/* HARICARE 美容鍼灸・美容整体院 会員プラン - WPスコープ版 */
#ism-app{--p:#c8839d;--pl:#b06880;--acc:#c8839d;--bg:#fafafa;--card:#fff;--txt:#2c2c2c;--txtl:#6b6b6b;--bdr:#e5e7eb;--ok:#2d8a4e;--err:#c0392b;--sh:0 4px 24px rgba(0,0,0,.06);--shh:0 8px 40px rgba(0,0,0,.12);--r:12px;--rl:20px;font-family:'Noto Sans JP',sans-serif;color:var(--txt);-webkit-font-smoothing:antialiased;line-height:1.6}
#ism-app *{box-sizing:border-box}
#ism-app *:not(ul):not(ol):not(li){margin:0;padding:0}
#ism-app img{max-width:100%;height:auto}
#ism-app button{font-family:'Noto Sans JP',sans-serif}
#ism-app input,#ism-app select,#ism-app textarea{font-family:'Noto Sans JP',sans-serif}

#ism-app .w{padding:20px 12px 80px;max-width:100%;overflow-x:hidden}
#ism-app .hd{text-align:center;max-width:800px;margin:0 auto 28px;padding:36px 20px;background:linear-gradient(135deg,var(--p),var(--pl));border-radius:var(--rl);color:#fff;position:relative;overflow:hidden}
#ism-app .hd::before{content:'';position:absolute;top:-50%;right:-20%;width:300px;height:300px;background:radial-gradient(circle,rgba(197,165,90,.15),transparent 70%);border-radius:50%}
#ism-app .hd .b{display:inline-block;background:rgba(255,255,255,.35) !important;color:#fff !important;font-size:11px;font-weight:700;letter-spacing:2px;padding:5px 16px;border-radius:100px;margin-bottom:16px;position:relative;z-index:1;text-shadow:0 1px 2px rgba(0,0,0,.15)}
#ism-app .hd h1{font-family:'Shippori Mincho',serif;font-size:clamp(22px,5vw,36px);font-weight:700;line-height:1.4;margin-bottom:10px;position:relative;z-index:1;color:#fff}
#ism-app .hd .sb{font-size:13px;opacity:.85;font-weight:300;line-height:1.7;position:relative;z-index:1}
#ism-app .hd .lm{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.12);backdrop-filter:blur(8px);padding:7px 16px;border-radius:100px;font-size:12px;font-weight:500;margin-top:16px;position:relative;z-index:1}
#ism-app .ld{width:8px;height:8px;background:#ef4444;border-radius:50%;animation:ismPd 2s ease-in-out infinite}
@keyframes ismPd{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.8)}}

/* ステップ */
#ism-app .st{display:flex;align-items:center;justify-content:center;max-width:600px;margin:0 auto 28px;padding:0 8px}
#ism-app .s{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:500;color:var(--txtl);transition:.3s;white-space:nowrap}
#ism-app .s.a{color:var(--p)}
#ism-app .s.d{color:var(--ok)}
#ism-app .sn{width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:13px;background:var(--bdr);color:var(--txtl);transition:.3s;flex-shrink:0}
#ism-app .s.a .sn{background:var(--p);color:#fff;box-shadow:0 2px 12px rgba(26,58,92,.3)}
#ism-app .s.d .sn{background:var(--ok);color:#fff}
#ism-app .sl{width:24px;height:2px;background:var(--bdr);margin:0 4px;transition:.3s;flex-shrink:0}
#ism-app .sl.d{background:var(--ok)}
#ism-app .sx{display:none}
@media(min-width:500px){#ism-app .sx{display:inline}#ism-app .sl{width:40px;margin:0 8px}}

/* クーポンバー */
#ism-app .cpn-bar{max-width:720px;margin:0 auto 24px;background:linear-gradient(135deg,#fff9eb,#fff5db);border:1.5px solid #f0d68a;border-radius:14px;padding:20px 16px;position:relative;overflow:hidden}
@media(max-width:480px){#ism-app .cpn-bar{padding:16px 14px;margin:0 auto 20px}}
#ism-app .cpn-bar::before{content:'🎫';position:absolute;top:-8px;right:12px;font-size:48px;opacity:.12;transform:rotate(15deg)}
#ism-app .cpn-bar.applied{background:linear-gradient(135deg,#ecfdf5,#d1fae5);border-color:#6ee7b7}
#ism-app .cpn-bar.applied::before{content:'✨'}
#ism-app .cpn-top{display:flex;align-items:center;gap:8px;margin-bottom:12px}
#ism-app .cpn-icon{font-size:20px;display:flex;align-items:center;color:var(--p)}
#ism-app .cpn-icon svg{width:20px;height:20px}
#ism-app .cpn-label{font-size:14px;font-weight:700;color:var(--p)}
#ism-app .cpn-sublabel{font-size:11px;color:var(--txtl);font-weight:400;display:block;margin-top:2px}
#ism-app .cpn-row{display:flex;gap:8px;flex-wrap:wrap}
#ism-app .cpn-input{flex:1;min-width:0;padding:11px 14px;border:1.5px solid var(--bdr);border-radius:10px;font-size:15px;color:var(--txt);background:#fff;transition:.2s;-webkit-appearance:none;letter-spacing:2px;text-transform:uppercase}
@media(max-width:400px){#ism-app .cpn-row{flex-direction:column}#ism-app .cpn-btn{width:100%}}
#ism-app .cpn-input:focus{outline:none;border-color:var(--p);box-shadow:0 0 0 3px rgba(26,58,92,.08)}
#ism-app .cpn-input.err{border-color:var(--err);animation:ismShake .4s ease}
#ism-app .cpn-input.ok{border-color:var(--ok);background:#f0fdf4}
@keyframes ismShake{0%,100%{transform:translateX(0)}25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}
#ism-app .cpn-btn{padding:11px 20px;border:none;border-radius:10px;background:var(--p);color:#fff;font-size:14px;font-weight:600;cursor:pointer;transition:.2s;white-space:nowrap}
#ism-app .cpn-btn:hover{background:var(--pl)}
#ism-app .cpn-btn:disabled{opacity:.5;cursor:not-allowed}
#ism-app .cpn-msg{margin-top:10px;font-size:12px;line-height:1.5;display:none}
#ism-app .cpn-msg.v{display:block;animation:ismFu .3s ease}
#ism-app .cpn-msg.ok{color:var(--ok)}
#ism-app .cpn-msg.er{color:var(--err)}
#ism-app .cpn-result{display:none;animation:ismFu .4s ease}
#ism-app .cpn-result.v{display:block}
#ism-app .cpn-result-box{background:#fff;border-radius:10px;padding:14px 16px;margin-top:12px;display:flex;align-items:center;justify-content:space-between;border:1px solid #d1fae5;flex-wrap:wrap;gap:8px}
#ism-app .cpn-result-left{display:flex;align-items:center;gap:10px}
#ism-app .cpn-result-check{width:28px;height:28px;background:var(--ok);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:14px;font-weight:700;flex-shrink:0}
#ism-app .cpn-result-text{font-size:13px;font-weight:600;color:var(--ok)}
#ism-app .cpn-result-detail{font-size:11px;color:var(--txtl);font-weight:400}

/* タブ */
#ism-app .tb{display:flex;gap:8px;max-width:960px;margin:0 auto 20px;padding:0 4px;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
#ism-app .tb::-webkit-scrollbar{display:none}
#ism-app .tab{flex-shrink:0;padding:10px 20px;border-radius:100px;border:1.5px solid var(--bdr);background:#fff;font-size:13px;font-weight:600;cursor:pointer;transition:.25s;white-space:nowrap;color:var(--txtl)}
#ism-app .tab.a{background:var(--p);color:#fff;border-color:var(--p);box-shadow:0 2px 12px rgba(26,58,92,.2)}
#ism-app .tab:hover:not(.a){border-color:var(--p);color:var(--p)}

/* プラングループ */
#ism-app .pg{display:none;max-width:960px;margin:0 auto 28px}
#ism-app .pg.v{display:block;animation:ismFu .35s ease}
#ism-app .pg h3{font-family:'Shippori Mincho',serif;font-size:18px;font-weight:700;color:var(--p);margin-bottom:6px;padding-left:4px}
#ism-app .pg .ds{font-size:12px;color:var(--txtl);margin-bottom:16px;padding-left:4px;line-height:1.6}
#ism-app .pl{display:grid;grid-template-columns:1fr;gap:14px}
@media(min-width:960px){#ism-app .pl{grid-template-columns:repeat(3,1fr)}}
@media(min-width:580px) and (max-width:959px){
  #ism-app .pl{
    display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;
    padding-bottom:8px;scrollbar-width:thin;scrollbar-color:var(--bdr) transparent
  }
  #ism-app .pl::-webkit-scrollbar{height:4px}
  #ism-app .pl::-webkit-scrollbar-thumb{background:var(--bdr);border-radius:4px}
  #ism-app .pl>.c{flex:0 0 calc(50% - 7px);scroll-snap-align:start;min-width:240px}
}

/* プランカード */
#ism-app .c{background:var(--card);border:2px solid var(--bdr);border-radius:var(--rl);padding:22px 16px;cursor:pointer;transition:all .35s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden;min-width:0}
#ism-app .c:hover{transform:translateY(-3px);box-shadow:var(--shh)}
#ism-app .c.sel{border-color:var(--cc,var(--p));box-shadow:0 0 0 1px var(--cc,var(--p)),var(--shh)}
#ism-app .c.sel::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:var(--cc,var(--p))}
#ism-app .c .badge{position:absolute;top:12px;right:12px;font-size:10px;font-weight:700;padding:3px 10px;border-radius:100px;background:var(--cc,var(--p));color:#fff}
#ism-app .c .ic{width:44px;height:44px;border-radius:11px;display:flex;align-items:center;justify-content:center;font-size:20px;margin-bottom:12px;background:color-mix(in srgb,var(--cc,var(--p)) 10%,transparent);color:var(--cc,var(--p))}
#ism-app .c .ic svg{width:24px;height:24px;flex-shrink:0}
#ism-app .c .nm{font-family:'Shippori Mincho',serif;font-size:17px;font-weight:700;margin-bottom:3px;color:var(--cc,var(--p));word-break:break-all}
#ism-app .c .su{font-size:11px;color:var(--txtl);margin-bottom:12px;line-height:1.5}
#ism-app .c .pr{font-size:12px;color:var(--txtl);margin-bottom:4px;transition:.3s;display:flex;flex-wrap:wrap;align-items:baseline;gap:2px}
#ism-app .c .pr strong{font-size:clamp(20px,5vw,26px);font-weight:900;color:var(--txt);letter-spacing:-1px;transition:.3s;white-space:nowrap}
#ism-app .c .pr .original{display:none;font-size:13px;text-decoration:line-through;color:#999;font-weight:500;margin-right:4px;white-space:nowrap}
#ism-app .c.discounted .pr .original{display:inline}
#ism-app .c.discounted .pr strong{color:var(--err);font-size:clamp(22px,5vw,28px)}
#ism-app .c .pr-off{display:none;margin-top:4px;font-size:11px;font-weight:700;color:#fff;background:var(--err);padding:2px 8px;border-radius:6px;width:fit-content}
#ism-app .c.discounted .pr-off{display:inline-block;animation:ismFu .3s ease}
#ism-app .c .tx{font-size:11px;color:var(--txtl);margin-bottom:14px}
#ism-app .c .fts{list-style:none;margin:0;padding:0}
#ism-app .c .fts li{font-size:12px;padding:4px 0 4px 20px;position:relative;line-height:1.5;list-style:none;margin:0}
#ism-app .c .fts li::before{content:'✓';position:absolute;left:0;color:var(--cc,var(--ok));font-weight:700;font-size:13px}
#ism-app .c .rd{display:flex;align-items:center;justify-content:center;margin-top:14px;padding-top:12px;border-top:1px solid var(--bdr)}
#ism-app .c .rc{width:20px;height:20px;border-radius:50%;border:2px solid var(--bdr);position:relative;transition:.2s;margin-right:8px;background:transparent}
#ism-app .c.sel .rc{border-color:var(--cc)}
#ism-app .c.sel .rc::after{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:10px;height:10px;border-radius:50%;background:var(--cc)}
#ism-app .c .rl{font-size:13px;font-weight:500;color:var(--txtl)}
#ism-app .c.sel .rl{color:var(--cc)}

/* ストレッチオプション */
#ism-app .opt-bar{margin-top:14px;padding:14px 16px;background:linear-gradient(135deg,#f8f6f1,#faf8f3);border:1.5px solid var(--bdr);border-radius:12px;display:none;animation:ismFu .3s ease}
#ism-app .opt-bar.v{display:block}
#ism-app .opt-row{display:flex;align-items:center;justify-content:space-between;gap:12px}
#ism-app .opt-left{display:flex;align-items:center;gap:10px}
#ism-app .opt-icon{font-size:18px}
#ism-app .opt-info .opt-name{font-size:13px;font-weight:600;color:var(--txt)}
#ism-app .opt-info .opt-price{font-size:11px;color:var(--txtl);margin-top:2px}
#ism-app .opt-toggle{position:relative;width:48px;height:28px;flex-shrink:0}
#ism-app .opt-toggle input{display:none}
#ism-app .opt-toggle .slider{position:absolute;inset:0;background:#d1d5db;border-radius:28px;cursor:pointer;transition:.3s}
#ism-app .opt-toggle .slider::before{content:'';position:absolute;height:22px;width:22px;left:3px;bottom:3px;background:#fff;border-radius:50%;transition:.3s;box-shadow:0 1px 3px rgba(0,0,0,.15)}
#ism-app .opt-toggle input:checked+.slider{background:var(--p)}
#ism-app .opt-toggle input:checked+.slider::before{transform:translateX(20px)}
#ism-app .opt-total{margin-top:12px;padding-top:10px;border-top:1px dashed var(--bdr);display:flex;justify-content:space-between;align-items:center;font-size:13px}
#ism-app .opt-total .total-label{color:var(--txtl);font-weight:500}
#ism-app .opt-total .total-price{font-weight:800;color:var(--txt);font-size:18px}
#ism-app .opt-total .total-tax{font-size:11px;color:var(--txtl);font-weight:400;margin-left:4px}

/* 注意書き */
#ism-app .nt{margin-top:12px;padding:12px 14px;background:#fefcf8;border:1px solid #e8dcc8;border-radius:10px;font-size:11px;color:var(--txtl);line-height:1.7}

/* フォームステップ */
#ism-app .fs{background:var(--card);border-radius:var(--rl);padding:24px 20px;margin:0 auto 20px;max-width:720px;box-shadow:var(--sh);display:none}
/* ステップ切替時の高さを安定させる（v1.16.1） */
#ism-app .fs.v{min-height:min(40vh,340px)}
@media(max-width:600px){#ism-app .fs.v{min-height:min(36vh,300px)}}
#ism-app .fs.v{display:block;animation:ismFu .4s ease}
@keyframes ismFu{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
#ism-app .fh{display:flex;align-items:center;gap:10px;margin-bottom:24px;padding-bottom:14px;border-bottom:1px solid var(--bdr)}
#ism-app .fi{width:36px;height:36px;border-radius:9px;background:color-mix(in srgb,var(--p) 8%,transparent);color:var(--p);display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0}
#ism-app .fi svg{width:20px;height:20px;flex-shrink:0}
#ism-app .ft2{font-family:'Shippori Mincho',serif;font-size:17px;font-weight:700;color:var(--p);margin:0;padding:0}

/* フォーム要素 */
#ism-app .fd{margin-bottom:18px}
#ism-app .fl{display:block;font-size:13px;font-weight:600;margin-bottom:5px}
#ism-app .fl .rq{color:var(--err);font-size:11px;margin-left:4px}
#ism-app .inp{width:100%;padding:11px 14px;border:1.5px solid var(--bdr);border-radius:10px;font-size:15px;color:var(--txt);background:#fff;transition:.2s;-webkit-appearance:none}
#ism-app .inp:focus{outline:none;border-color:var(--p);box-shadow:0 0 0 3px rgba(26,58,92,.08)}
#ism-app .inp::placeholder{color:#bbb}
#ism-app .inp.er{border-color:var(--err);box-shadow:0 0 0 3px rgba(220,38,38,.12);animation:ismShake .4s ease}
#ism-app .fr{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:480px){#ism-app .fr{grid-template-columns:1fr}}

/* 契約書 — v1.5.1: iOS/iPad のテキストハイライト選択を無効化 */
#ism-app .ct{
  background:#fefcf8;
  border:1px solid #e8dcc8;
  border-radius:var(--r);
  padding:20px 16px;
  margin-bottom:20px;
  /* テキスト選択無効化（電子書面） */
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  /* iOS の長押し callout (コピー/共有メニュー) 無効化 */
  -webkit-touch-callout: none;
  /* iOS タップ時の青いハイライト無効化 */
  -webkit-tap-highlight-color: transparent;
}
/* 入力欄・チェックボックス・署名等は通常通り選択/操作可 */
#ism-app .ct .ag, #ism-app .ct .ag *,
#ism-app .ct .inp, #ism-app .ct input, #ism-app .ct textarea, #ism-app .ct select,
#ism-app .ct .sgw, #ism-app .ct .sgw *,
#ism-app .ct button, #ism-app .ct a {
  -webkit-user-select: auto;
  -moz-user-select: auto;
  -ms-user-select: auto;
  user-select: auto;
  -webkit-touch-callout: default;
}
/* 同意チェックのラベルは触りやすく + テキスト選択も OK */
#ism-app .ag, #ism-app .agt {
  -webkit-user-select: none;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
}
#ism-app .ctt{font-family:'Shippori Mincho',serif;font-size:18px;font-weight:700;text-align:center;color:var(--p);margin-bottom:20px;padding-bottom:14px;border-bottom:2px solid var(--acc)}
#ism-app .ca{margin-bottom:14px}
#ism-app .cat{font-size:13px;font-weight:700;color:var(--p);margin-bottom:5px;padding:6px 10px;background:rgba(197,165,90,.06);border:1px solid rgba(197,165,90,.2);border-radius:6px}
#ism-app .cab{font-size:12px;line-height:1.8;padding-left:13px}
#ism-app .cab .ex{background:rgba(197,165,90,.08);border-radius:8px;padding:8px 12px;margin-top:6px;font-size:11px;color:var(--txtl)}

/* 同意チェック */
#ism-app .ag{display:flex;align-items:flex-start;gap:10px;padding:12px 14px;background:#f8f7f4;border-radius:10px;margin-bottom:10px;cursor:pointer;transition:.2s}
#ism-app .ag:hover{background:#f0efe9}
#ism-app .ag input{display:none}
#ism-app .agc{width:22px;height:22px;border:2px solid var(--bdr);border-radius:6px;flex-shrink:0;display:flex;align-items:center;justify-content:center;transition:.2s;margin-top:1px;background:transparent}
#ism-app .ag input:checked+.agc{background:var(--p);border-color:var(--p)}
#ism-app .ag input:checked+.agc::after{content:'✓';color:#fff;font-size:13px;font-weight:700}
#ism-app .agt{font-size:12px;line-height:1.6}

/* 署名 */
#ism-app .sg{margin-bottom:20px}
#ism-app .sgw{border:2px solid var(--bdr);border-radius:var(--r);overflow:hidden;position:relative;background:#fff}
#ism-app .sgw canvas{width:100%;height:150px;display:block;touch-action:none}
#ism-app .sgp{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#ccc;font-size:13px;pointer-events:none;transition:.2s}
#ism-app .sgw.has .sgp{opacity:0}
#ism-app .sga{display:flex;justify-content:flex-end;margin-top:6px}
#ism-app .sgcl{font-size:12px;color:var(--txtl);background:none;border:1px solid var(--bdr);padding:5px 14px;border-radius:8px;cursor:pointer}
#ism-app .sg-note{font-size:11px;color:var(--txtl);line-height:1.5;margin:6px 0 10px;padding:8px 12px;background:#f8f7f4;border-radius:8px;border:1px solid #e8dcc8}
#ism-app .sg-ts{font-size:11px;color:var(--txtl);text-align:right;margin-top:4px;min-height:16px}

/* ボタン */
#ism-app .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 28px;border:none;border-radius:12px;font-size:14px;font-weight:600;cursor:pointer;transition:.25s;white-space:nowrap;text-decoration:none;line-height:1.4}
#ism-app .bp{background:var(--p);color:#fff;box-shadow:0 4px 16px rgba(26,58,92,.25)}
#ism-app .bp:hover{background:var(--pl);transform:translateY(-1px)}
#ism-app .bp:disabled{opacity:.5;cursor:not-allowed}
#ism-app .bs{background:transparent;color:var(--txtl);border:1.5px solid var(--bdr)}
#ism-app .bs:hover{background:var(--bg)}
#ism-app .bl{padding:16px 36px;font-size:15px}
#ism-app .nv{display:flex;flex-direction:column-reverse;gap:10px;margin-top:20px}
@media(min-width:500px){#ism-app .nv{flex-direction:row;justify-content:space-between}}
#ism-app .nv .btn{width:100%}
@media(min-width:500px){#ism-app .nv .btn{width:auto}}

/* 確認テーブル */
#ism-app .ctb{width:100%;border-collapse:collapse}
#ism-app .ctb tr{border-bottom:1px solid var(--bdr)}
#ism-app .ctb th{text-align:left;padding:10px 6px;font-size:12px;font-weight:600;color:var(--txtl);width:100px;vertical-align:top}
#ism-app .ctb td{padding:10px 6px;font-size:13px}

/* 完了画面 */
#ism-app .cmp{text-align:center;padding:40px 20px;display:none;max-width:720px;margin:0 auto}
#ism-app .cmp.v{display:block;animation:ismFu .5s ease}
#ism-app .cmp .ci{width:72px;height:72px;background:color-mix(in srgb,var(--ok) 10%,transparent);border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 20px;font-size:32px;color:var(--ok);animation:ismBi .6s cubic-bezier(.68,-.55,.27,1.55)}
@keyframes ismBi{0%{transform:scale(0)}50%{transform:scale(1.15)}100%{transform:scale(1)}}
#ism-app .cmp h2{font-family:'Shippori Mincho',serif;font-size:22px;font-weight:700;color:var(--p);margin-bottom:10px}
#ism-app .cmp p{font-size:13px;color:var(--txtl);line-height:1.7;margin-bottom:28px}

/* アラート */
#ism-app .al{padding:12px 16px;border-radius:10px;font-size:13px;margin:0 auto 16px;max-width:720px;display:none;line-height:1.6}
#ism-app .al.v{display:block;animation:ismFu .3s ease}
#ism-app .ale{background:#fdf2f2;border:1px solid #fca5a5;color:var(--err)}

/* 既存会員ボックス */
#ism-app .cx{text-align:center;margin-top:32px;padding:20px;background:var(--card);border-radius:var(--r);box-shadow:var(--sh);max-width:720px;margin-left:auto;margin-right:auto}
#ism-app .cx h3{font-size:14px;font-weight:600;margin-bottom:6px}
#ism-app .cx p{font-size:12px;color:var(--txtl);margin-bottom:12px}

/* スピナー */
#ism-app .spn{width:20px;height:20px;border:2px solid var(--bdr);border-top-color:var(--p);border-radius:50%;animation:ismSp .8s linear infinite;display:inline-block;vertical-align:middle;margin-right:6px}
@keyframes ismSp{to{transform:rotate(360deg)}}

/* Stripe */
#ism-app #stripe-card-element{padding:12px 14px;border:1.5px solid var(--bdr);border-radius:10px;background:#fff;transition:.2s}
#ism-app #stripe-card-element.StripeElement--focus{border-color:var(--p);box-shadow:0 0 0 3px rgba(26,58,92,.08)}
#ism-app #stripe-card-element.StripeElement--invalid{border-color:var(--err)}
#ism-app #stripe-card-errors{color:var(--err);font-size:12px;margin-top:6px;min-height:18px}
#ism-app .stripe-section{background:linear-gradient(135deg,#f8f7ff,#f0eeff);border:1.5px solid #d4d0f0;border-radius:14px;padding:20px 16px;margin-bottom:20px}
#ism-app .stripe-section h3{font-size:14px;font-weight:700;color:#635bff;margin-bottom:4px;display:flex;align-items:center;gap:8px}
#ism-app .stripe-section p{font-size:11px;color:var(--txtl);margin-bottom:14px}
#ism-app .stripe-badge{display:inline-flex;align-items:center;gap:4px;font-size:10px;background:#635bff;color:#fff;padding:2px 8px;border-radius:6px;font-weight:600}

/* 完了ページボタン */
#ism-app .comp-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:20px}
#ism-app .comp-actions .btn{min-width:160px}
#ism-app .btn-print{background:#fff;color:var(--p);border:1.5px solid var(--p)}
#ism-app .btn-print:hover{background:var(--bg)}

/* 印刷 */
@media print{
    body *{visibility:hidden}
    #ism-print-area,#ism-print-area *{visibility:visible}
    #ism-print-area{position:absolute;left:0;top:0;width:100%;padding:20px;font-size:12px}
    .no-print{display:none !important}
}

/* ─────────── HARICARE ブランディング追加 ─────────── */
.w{ background:linear-gradient(180deg,#fff9f5 0%,#fef5f0 100%) }
.hd h1{ font-family:"Hiragino Mincho ProN","游明朝",serif; letter-spacing:.04em; color:#5b3a2a }
.hd .b{ color:#b8860b; letter-spacing:.18em; font-weight:600 }
.hd .lm{ background:linear-gradient(135deg,#c8839d,#b06880); color:#fff }

/* おすすめプランのリボン */
.c.recommended{ border:2px solid #d4af37; box-shadow:0 8px 24px rgba(212,175,55,.25); transform:translateY(-4px) }
.ribbon-recommended{
  position:absolute; top:-12px; right:-8px;
  background:linear-gradient(135deg,#d4af37,#b8860b);
  color:#fff; padding:4px 14px; border-radius:14px;
  font-size:11px; font-weight:700; letter-spacing:.05em;
  box-shadow:0 3px 8px rgba(184,134,11,.4);
  z-index:2;
}
.c{ position:relative }

/* ポイント情報ボックス */
.pt-info{ box-shadow:0 1px 3px rgba(184,134,11,.15) }

/* ─────────── HARICARE プリペイドプランカード（v1.1.4 デザイン刷新）─────────── */
/* v1.2.0: 親カード .c の overflow:hidden を解除（リボンが切れないように） */
#ism-app .c.hari-prepaid {
  background: linear-gradient(180deg, #fffdfb 0%, #fff8f3 100%);
  border: 2px solid #f0d5d8;
  border-radius: 18px;
  padding: 20px 18px 18px;
  display: flex; flex-direction: column;
  gap: 0;
  transition: all .35s cubic-bezier(.4,0,.2,1);
  overflow: visible !important;
}
/* 「⭐ 最もおすすめ」リボン用に上部余白を確保 */
/* v1.5.1: タブレット(580-959px)範囲は横スクロールが必要なので overflow:visible !important を外す
   リボンは縦方向だけはみ出すので overflow-y:visible で対応 */
#ism-app .pl { padding-top: 20px; }
@media (min-width: 960px) {
  #ism-app .pl { overflow: visible; }
}
@media (max-width: 579px) {
  #ism-app .pl { overflow: visible; }
}
@media (min-width: 580px) and (max-width: 959px) {
  /* タブレット: 横スクロール維持 + リボンを縦方向だけ visible */
  #ism-app .pl {
    overflow-x: auto !important;
    overflow-y: visible !important;
    /* iOS Safari でスクロールできるよう touch-action を明示 */
    touch-action: pan-x;
    -webkit-overflow-scrolling: touch;
  }
}
#ism-app .pg.v { overflow: visible; }
#ism-app .c.hari-prepaid.recommended { margin-top: 8px; }
#ism-app .c.hari-prepaid:hover {
  border-color: #c8839d;
  transform: translateY(-4px);
  box-shadow: 0 14px 36px rgba(176, 104, 128, .18);
}
#ism-app .c.hari-prepaid.sel {
  border-color: var(--cc, #c8839d);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--cc, #c8839d) 18%, transparent), 0 14px 36px rgba(176, 104, 128, .22);
}
#ism-app .c.hari-prepaid.sel::before { display: none; }

/* おすすめリボン */
#ism-app .c.hari-prepaid.recommended {
  border: 2.5px solid #d4af37;
  background: linear-gradient(180deg, #fff9f0 0%, #fff2e0 100%);
  box-shadow: 0 10px 32px rgba(212, 175, 55, .22);
}
#ism-app .c.hari-prepaid .hari-ribbon {
  position: absolute; top: -14px; left: 50%; transform: translateX(-50%);
  background: linear-gradient(135deg, #d4af37 0%, #b8860b 100%);
  color: #fff; padding: 6px 22px; border-radius: 100px;
  font-size: 11px; font-weight: 800; letter-spacing: .08em;
  box-shadow: 0 4px 12px rgba(184, 134, 11, .35);
  white-space: nowrap; z-index: 5;
}

/* バッジ（プラン分類タグ） */
#ism-app .c.hari-prepaid .hari-badge {
  display: inline-block;
  font-size: 10px; font-weight: 700; letter-spacing: .05em;
  padding: 4px 12px; border-radius: 100px;
  background: color-mix(in srgb, var(--cc, #c8839d) 12%, transparent);
  color: var(--cc, #c8839d);
  margin-bottom: 10px;
  align-self: flex-start;
}

/* プラン名 */
#ism-app .c.hari-prepaid .nm {
  font-family: 'Shippori Mincho', serif;
  font-size: 22px; font-weight: 700;
  color: #3d2a2f; letter-spacing: .02em;
  margin-bottom: 4px; line-height: 1.3;
}
#ism-app .c.hari-prepaid .su {
  font-size: 11.5px; color: #8a6f6f;
  line-height: 1.5; margin-bottom: 14px;
}

/* 月額表示 */
#ism-app .c.hari-prepaid .hari-price-row {
  display: flex; align-items: baseline; justify-content: center;
  gap: 4px; padding: 6px 0 12px;
  border-bottom: 1px dashed #e7c5c9;
  margin-bottom: 12px;
}
#ism-app .c.hari-prepaid .hari-price-yen {
  font-family: 'Shippori Mincho', serif;
  font-size: 30px; font-weight: 800;
  color: var(--cc, #c8839d);
  letter-spacing: -.02em; line-height: 1;
}
#ism-app .c.hari-prepaid .hari-price-month {
  font-size: 11px; color: #888; font-weight: 500;
}

/* ポイント情報ボックス（ゴールド） */
#ism-app .c.hari-prepaid .hari-pt-box {
  background: linear-gradient(135deg, #fff8e8 0%, #f8e9c8 100%);
  border: 1.5px solid #d4af37;
  border-radius: 12px;
  padding: 12px 10px 10px;
  text-align: center;
  margin-bottom: 12px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.6), 0 2px 6px rgba(184,134,11,.08);
}
#ism-app .c.hari-prepaid .hari-pt-label {
  font-size: 10px; color: #8b6914;
  font-weight: 700; letter-spacing: .08em;
  margin-bottom: 4px;
}
#ism-app .c.hari-prepaid .hari-pt-value {
  font-family: 'Shippori Mincho', serif;
  font-size: 26px; font-weight: 800; color: #b8860b;
  letter-spacing: -.01em; line-height: 1.1;
}
#ism-app .c.hari-prepaid .hari-pt-value span {
  font-size: 13px; font-weight: 600; margin-left: 3px;
  vertical-align: middle;
}
#ism-app .c.hari-prepaid .hari-pt-bonus {
  font-size: 10.5px; color: #9a7a26;
  margin-top: 4px; font-weight: 600;
}

/* 利用目安 */
#ism-app .c.hari-prepaid .hari-usage {
  display: flex; justify-content: space-between; align-items: center;
  background: #fcf4f0;
  border-radius: 8px;
  padding: 6px 10px;
  margin-bottom: 10px;
  font-size: 11px;
}
#ism-app .c.hari-prepaid .hari-usage-label {
  color: #8a6f6f; font-weight: 600;
}
#ism-app .c.hari-prepaid .hari-usage-value {
  color: #3d2a2f; font-weight: 700;
}

/* 特典リスト */
#ism-app .c.hari-prepaid .fts {
  margin: 0 0 8px; padding: 0; flex: 1;
}
#ism-app .c.hari-prepaid .fts li {
  font-size: 11.5px; color: #5a4a4a;
  padding: 3px 0 3px 18px; line-height: 1.5;
}
#ism-app .c.hari-prepaid .fts li::before {
  content: '✓'; color: var(--cc, #c8839d);
  font-weight: 800; left: 0; font-size: 13px;
}

/* 選択ボタン部分 */
#ism-app .c.hari-prepaid .rd {
  margin-top: auto;
  padding-top: 12px;
  border-top: 1px solid #f0d5d8;
}
#ism-app .c.hari-prepaid.sel .rd {
  background: color-mix(in srgb, var(--cc, #c8839d) 8%, transparent);
  margin: 8px -18px -18px;
  padding: 12px 18px;
  border-radius: 0 0 14px 14px;
  border-top: 1px solid var(--cc, #c8839d);
}
#ism-app .c.hari-prepaid .rl {
  font-weight: 700; color: #8a6f6f;
}
#ism-app .c.hari-prepaid.sel .rl {
  color: var(--cc, #c8839d);
}

/* レスポンシブ */
@media (max-width: 580px) {
  #ism-app .c.hari-prepaid {
    padding: 18px 14px 14px;
  }
  #ism-app .c.hari-prepaid .nm { font-size: 19px; }
  #ism-app .c.hari-prepaid .hari-price-yen { font-size: 26px; }
  #ism-app .c.hari-prepaid .hari-pt-value { font-size: 22px; }
}

/* タブのHARICAREっぽさ */
#ism-app .tab.a { background: linear-gradient(135deg, #c8839d, #b06880); }
