:root{--sp-navy:#071a3e;--sp-navy2:#0b214c;--sp-blue:#2f70c9;--sp-yellow:#f0b900;--sp-line:#cbd8e8;--sp-text:#071a3e;--sp-pale:#f4f8fd}.support-page{color:var(--sp-text);font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif}.support-wrap{width:min(1100px,calc(100% - 48px));margin-inline:auto}.support-hero{height:430px;position:relative;overflow:hidden}.support-hero__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}.support-hero__copy{position:relative;z-index:1;padding-top:48px}.eyebrow,.en{font-size:11px;font-weight:700;letter-spacing:.08em;color:#2867ba}.support-hero h1{font-size:36px;line-height:1.15;margin:7px 0 4px}.support-hero h2{font-size:18px;margin:27px 0 2px}.support-hero .lead{font-size:12px;line-height:1.9;margin-top:17px;font-weight:600}.hero-actions{display:flex;gap:14px;margin-top:20px}.hero-actions a{display:flex;align-items:center;justify-content:center;min-width:220px;height:54px;padding:0 22px;background:#0d469c;color:#fff;text-decoration:none;font-weight:700;border-radius:3px;font-size:13px}.hero-actions a small{font-size:7px;margin-left:10px;letter-spacing:.08em}.hero-actions .light{background:#fff;color:#174c9b;border:1px solid #174c9b}.support-info{background:#102c5b;color:#fff}.info-grid{display:grid;grid-template-columns:repeat(4,1fr);min-height:112px}.info-grid>div{display:flex;align-items:center;gap:17px;padding:18px 24px;border-right:1px dotted #7290b6}.info-grid>div:last-child{border:0}.info-grid img{width:62px;height:62px;object-fit:contain}.info-grid p{font-size:12px;line-height:1.5}.info-grid b{font-size:14px}.info-grid small{display:block;color:var(--sp-yellow);font-size:8px;letter-spacing:.12em;font-weight:700;margin-top:4px}.section{padding:42px 0}.section-title{display:flex;align-items:baseline;gap:26px;margin-bottom:30px}.section-title h2{font-size:30px;line-height:1.2;position:relative;margin:0}.section-title h2:after{content:"";display:block;width:42px;height:3px;background:var(--sp-yellow);margin-top:14px}.section-title span{font-size:11px;letter-spacing:.35em}.support-content-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.support-content-grid>div{min-height:105px;border:1px solid #c9d8eb;border-radius:6px;display:flex;align-items:center;padding:14px 18px;gap:16px;background:#fff}.support-content-grid img{width:72px;height:72px;padding:8px;border-radius:50%;background:#eef4fb}.support-content-grid b{font-size:13px;line-height:1.55}.dark{background:linear-gradient(115deg,#061635,#0d2553);color:#fff}.light-title h2{color:#fff}.light-title span{color:#f4c900}.consult-grid{display:grid;grid-template-columns:repeat(3,1fr)}.consult-grid>div{position:relative;min-height:180px;display:grid;grid-template-columns:65px 92px 1fr;align-items:center;padding:16px 22px;border-right:1px dotted #5d779d;border-bottom:1px dotted #5d779d}.consult-grid>div:nth-child(3n){border-right:0}.consult-grid>div:nth-last-child(-n+3){border-bottom:0}.consult-grid strong{position:absolute;left:4px;top:3px;font-size:40px;color:#3475c9;font-weight:500}.consult-grid img{grid-column:1/3;width:82px;height:82px;object-fit:contain;margin:25px 0 0 20px}.consult-grid p{font-size:14px;line-height:1.75;font-weight:700}.process{background:#fff}.process .intro{font-size:11px;line-height:1.7;margin-top:-14px;margin-bottom:28px}.process-grid{display:grid;grid-template-columns:repeat(4,1fr);position:relative}.process-grid>div{padding:0 25px;border-right:1px solid #d8e0ea;text-align:left}.process-grid>div:last-child{border:0}.process-grid h3{font-size:16px}.process-grid h3 em{font-style:normal;font-size:30px;color:#5e9bda;margin-right:5px}.process-grid img{display:block;width:110px;height:90px;object-fit:contain;margin:14px auto}.process-grid p{font-size:11px;line-height:1.75}.process-line{height:4px;background:linear-gradient(90deg,#9bd5ef 0 25%,#4f9ad4 25% 50%,#2367b1 50% 75%,#f3b900 75%);margin:0 28px -19px}.strengths{position:relative}.strength-grid{display:grid;grid-template-columns:repeat(4,1fr)}.strength-grid article{padding:0 30px;border-right:1px solid #617393}.strength-grid article:last-child{border:0}.strength-grid h3{font-size:16px;line-height:1.45;margin-bottom:18px}.strength-grid h3:after{content:"";display:block;width:28px;height:3px;background:var(--sp-yellow);margin-top:9px}.strength-grid ul{padding-left:17px;margin:0}.strength-grid li{font-size:11px;line-height:1.7;margin-bottom:5px}.case-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.case-grid article{border:1px solid #d7dde5;background:#fff}.case-grid img{width:100%;height:130px;object-fit:cover}.case-grid h3,.case-grid p{margin:12px 14px}.case-grid h3{font-size:14px;line-height:1.5}.case-grid p{font-size:10px;line-height:1.7}.chatbot{padding-bottom:0;background:linear-gradient(90deg,#fff,#eef7ff)}.chatbot-grid{display:grid;grid-template-columns:2fr 1fr;align-items:end}.chat-copy{padding-bottom:38px}.chat-types{display:grid;grid-template-columns:1fr 30px 1fr;gap:12px;max-width:650px}.chat-types article{border:1px solid #c9d9ec;border-radius:6px;padding:15px;text-align:center;background:rgba(255,255,255,.75)}.chat-types h3{font-size:15px}.chat-types b{display:block;background:#4d85c9;color:#fff;border-radius:3px;padding:6px;margin:6px 0;font-size:10px}.chat-types p{font-size:10px;line-height:1.6}.chat-types i{align-self:center;font-style:normal;font-size:26px;color:#2866b1}.chat-points{position:absolute;margin-left:680px;margin-top:-185px;font-size:11px;line-height:2}.chat-points h3{font-size:13px;line-height:1.7}.chatbot-img{width:100%;height:330px;object-fit:cover;object-position:58% center;mix-blend-mode:multiply}.outcome-grid{display:grid;grid-template-columns:repeat(3,1fr)}.outcome-grid article{text-align:center;padding:0 35px;border-right:1px solid #d7dee8}.outcome-grid article:last-child{border:0}.outcome-grid img{width:68px;height:68px;object-fit:contain}.outcome-grid h3{font-size:14px;line-height:1.6;margin:12px 0 25px}.outcome-grid h3:after{content:"";display:block;width:30px;height:3px;background:var(--sp-yellow);margin:12px auto 0}.outcome-grid p{font-size:10px;line-height:1.8;text-align:left}.outcomes{padding-bottom:70px}
@media(max-width:900px){.support-hero{height:400px}.support-hero__bg{object-position:62% center;opacity:.75}.info-grid,.support-content-grid{grid-template-columns:repeat(2,1fr)}.consult-grid{grid-template-columns:1fr 1fr}.consult-grid>div:nth-child(3n){border-right:1px dotted #5d779d}.consult-grid>div:nth-child(2n){border-right:0}.process-grid,.strength-grid,.case-grid{grid-template-columns:repeat(2,1fr)}.process-line{display:none}.strength-grid article{margin-bottom:28px}.chatbot-grid{grid-template-columns:1fr}.chat-points{position:static;margin:24px 0 0}.chatbot-img{height:260px;object-position:center}}
@media(max-width:600px){.support-wrap{width:min(100% - 32px,1100px)}.support-hero{height:570px;background:#eff7ff}.support-hero__bg{height:240px;top:auto;bottom:0;object-position:72% center;opacity:1}.support-hero__copy{padding-top:30px}.support-hero h1{font-size:28px}.support-hero h2{font-size:16px;margin-top:20px}.support-hero .lead{font-size:10px}.hero-actions{flex-direction:column;width:220px}.hero-actions a{height:42px;min-width:0}.info-grid,.support-content-grid,.consult-grid,.process-grid,.strength-grid,.case-grid,.outcome-grid{grid-template-columns:1fr}.info-grid>div{border-right:0;border-bottom:1px dotted #7290b6}.section{padding:34px 0}.section-title{display:block;margin-bottom:25px}.section-title h2{font-size:24px}.section-title span{display:block;margin-top:12px;font-size:9px}.consult-grid>div,.consult-grid>div:nth-child(3n){border-right:0;border-bottom:1px dotted #5d779d}.process-grid>div,.strength-grid article,.outcome-grid article{border-right:0;border-bottom:1px solid #d7dee8;padding:22px 8px}.chat-types{grid-template-columns:1fr}.chat-types i{display:none}.chatbot-img{height:220px}.case-grid img{height:180px}}

/* =========================================================
   SUPPORT PAGE FINAL TUNING 2026-10-06
   カンプ比較による調整
   ========================================================= */

/* 主なサポート内容：SVGを丸内に完全表示 */
.support-content-grid>div{
  min-height:112px;
  padding:14px 17px;
  gap:15px;
  overflow:visible;
}
.support-content-grid img{
  flex:0 0 76px;
  width:76px;
  height:76px;
  box-sizing:border-box;
  padding:13px;
  object-fit:contain;
  object-position:center;
  overflow:visible;
  background:#eef4fb;
  border-radius:50%;
}
.support-content-grid b{
  font-size:13px;
  line-height:1.55;
  font-weight:700;
}

/* サポートの流れ：カンプの横ライン・丸・最終矢印をCSSで再現 */
.process .support-wrap{overflow:visible}
.process-grid{position:relative;padding-top:8px}
.process-line{
  position:relative;
  height:4px;
  margin:0 40px -22px;
  border-radius:4px;
  background:linear-gradient(90deg,#8fc9ed 0 25%,#589bd7 25% 50%,#2e70ba 50% 75%,#efb600 75% 100%);
}
.process-line:after{
  content:"";
  position:absolute;
  right:-1px;
  top:50%;
  width:15px;
  height:15px;
  border-top:4px solid #efb600;
  border-right:4px solid #efb600;
  transform:translateY(-50%) rotate(45deg);
}
.process-grid>div{position:relative;padding-top:0}
.process-grid h3{
  position:relative;
  z-index:2;
  display:inline-flex;
  align-items:baseline;
  gap:6px;
  margin:0 0 16px;
  padding:0 7px;
  background:#fff;
  font-size:16px;
  font-weight:800;
}
.process-grid h3:after{
  content:"";
  position:absolute;
  left:50%;
  top:39px;
  width:14px;
  height:14px;
  border:4px solid #5b9bd6;
  border-radius:50%;
  background:#fff;
  transform:translate(-50%,-50%);
}
.process-grid>div:last-child h3:after{border-color:#efb600}
.process-grid h3 em{font-size:31px;font-weight:700;line-height:1;color:#5e9bda}
.process-grid>div:last-child h3 em{color:#3d78be}
.process-grid img{width:112px;height:92px;margin:20px auto 12px;object-fit:contain}
.process-grid p{font-size:11px;line-height:1.75;font-weight:600}

/* Chatbot：カンプに合わせて文字・枠・背景を強化 */
.chatbot{
  position:relative;
  overflow:hidden;
  padding:42px 0 0;
  background:linear-gradient(90deg,#fff 0%,#fff 45%,#f3f9ff 68%,#e8f4fd 100%);
}
.chatbot:after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(90deg,rgba(255,255,255,0) 52%,rgba(226,241,253,.18) 72%,rgba(215,235,250,.34) 100%);
}
.chatbot-grid{position:relative;z-index:1;grid-template-columns:minmax(0,2fr) minmax(300px,1fr);align-items:end}
.chatbot .section-title{gap:24px;margin-bottom:28px}
.chatbot .section-title h2{font-size:27px;line-height:1.22;font-weight:800;letter-spacing:.01em}
.chatbot .section-title span{font-size:10px;font-weight:700;line-height:1.15;letter-spacing:.26em;color:#1e5eac}
.chat-types{grid-template-columns:1fr 34px 1fr;gap:13px;max-width:650px}
.chat-types article{
  border:1.5px solid #bfd2e8;
  border-radius:6px;
  padding:17px 16px 15px;
  background:rgba(255,255,255,.88);
}
.chat-types h3{margin:0 0 13px;font-size:16px;line-height:1.3;font-weight:800}
.chat-types b{
  padding:6px 8px;
  margin:6px 0;
  border-radius:3px;
  background:#4c84c8;
  color:#fff;
  font-size:10px;
  line-height:1.25;
  font-weight:700;
}
.chat-types p{margin:12px 0 0;font-size:10px;line-height:1.7;font-weight:600}
.chat-types i{font-size:28px;font-weight:700;color:#2866b1}
.chat-points{margin-left:680px;margin-top:-190px;font-size:11px;line-height:2.05;font-weight:700}
.chat-points h3{font-size:13px;line-height:1.7;font-weight:800;margin-bottom:13px}
.chatbot-img{
  width:100%;
  height:335px;
  object-fit:cover;
  object-position:58% center;
  mix-blend-mode:normal;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.28) 12%,#000 32%,#000 100%);
  mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.28) 12%,#000 32%,#000 100%);
}

/* サポート効果：イラスト・見出し・本文を中央揃え、見出しを太く */
.outcome-grid article{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  padding:0 36px;
}
.outcome-grid img{display:block;width:72px;height:72px;margin:0 auto;object-fit:contain}
.outcome-grid h3{
  width:100%;
  margin:12px 0 23px;
  text-align:center;
  font-size:14px;
  line-height:1.65;
  font-weight:800;
}
.outcome-grid p{
  width:100%;
  margin:0;
  text-align:center;
  font-size:10px;
  line-height:1.85;
  font-weight:600;
}

@media(max-width:900px){
  .process-line{display:none}
  .process-grid h3:after{display:none}
  .chatbot-grid{grid-template-columns:1fr}
  .chat-points{position:static;margin:24px 0 0}
  .chatbot-img{height:280px;-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 20%);mask-image:linear-gradient(90deg,transparent 0%,#000 20%)}
}
@media(max-width:600px){
  .support-content-grid img{width:72px;height:72px;flex-basis:72px;padding:13px}
  .chatbot .section-title h2{font-size:23px}
  .chat-types{grid-template-columns:1fr}
  .outcome-grid article{padding:25px 8px}
}

/* =========================================================
   SUPPORT FINAL OVERRIDE 2026-10-06
   カンプ最終調整
   ========================================================= */

/* 主なサポート内容：SVG全体を円内に収める */
.support-content-grid img{
  box-sizing:border-box;
  width:72px;
  height:72px;
  flex:0 0 72px;
  padding:14px;
  object-fit:contain;
  object-position:center;
  overflow:visible;
}

/* サポートの流れ：01〜04とライン、最後の矢印をカンプ寄せ */
.process-grid{padding-top:9px}
.process-line{margin:0 39px -22px;height:4px}
.process-line:after{right:-2px;width:15px;height:15px}
.process-grid h3{font-size:16px;font-weight:800}
.process-grid h3 em{font-size:31px;font-weight:700}
.process-grid img{width:112px;height:92px;object-fit:contain}

/* Chatbot：背景は背面。写真自体にはマスク/グラデーションを掛けない */
.chatbot{
  position:relative;
  overflow:hidden;
  padding:42px 0 0;
  background:linear-gradient(90deg,#fff 0%,#fff 42%,#f5faff 67%,#eaf5fd 100%);
}
.chatbot:after{display:none}
.chatbot-grid{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:minmax(0,1fr) 390px;
  align-items:stretch;
  column-gap:0;
}
.chat-copy{
  position:relative;
  z-index:2;
  padding:0 0 38px;
}
.chatbot .section-title{
  display:block;
  margin:0 0 28px;
}
.chatbot .section-title h2{
  margin:0;
  white-space:nowrap;
  font-size:29px;
  line-height:1.2;
  font-weight:800;
  letter-spacing:0;
}
.chatbot .section-title h2:after{margin-top:14px}
.chatbot .section-title span{
  display:block;
  margin-top:-4px;
  font-size:10px;
  line-height:1.2;
  font-weight:800;
  letter-spacing:.08em;
  color:#2d6dbb;
}
.chat-types{
  display:grid;
  grid-template-columns:1fr 34px 1fr;
  gap:13px;
  width:650px;
  max-width:650px;
}
.chat-types article{
  padding:18px 16px 17px;
  border:1px solid #bfd2e8;
  border-radius:6px;
  background:rgba(255,255,255,.82);
}
.chat-types h3{margin:0 0 14px;font-size:17px;line-height:1.3;font-weight:800}
.chat-types b{padding:7px 8px;margin:6px 0;font-size:11px;line-height:1.25;font-weight:700}
.chat-types p{margin:13px 0 0;font-size:11px;line-height:1.75;font-weight:600}
.chat-types i{font-size:29px;font-weight:700}
.chat-points{
  position:absolute;
  z-index:3;
  left:680px;
  top:157px;
  width:270px;
  margin:0;
  font-size:12px;
  line-height:2.05;
  font-weight:700;
}
.chat-points h3{margin:0 0 14px;font-size:14px;line-height:1.65;font-weight:800}
.chatbot-img{
  position:relative;
  z-index:1;
  align-self:stretch;
  justify-self:end;
  display:block;
  width:430px;
  max-width:none;
  height:100%;
  min-height:355px;
  margin:0;
  object-fit:cover;
  object-position:57% center;
  mix-blend-mode:normal;
  -webkit-mask-image:none;
  mask-image:none;
}

/* サポート効果 */
.outcome-grid article{align-items:center;text-align:center;padding:0 36px}
.outcome-grid img{width:76px;height:76px;margin:0 auto;object-fit:contain}
.outcome-grid h3{font-size:15px;line-height:1.6;font-weight:800;text-align:center}
.outcome-grid p{font-size:10.5px;line-height:1.85;font-weight:600;text-align:center}

@media(max-width:1100px){
  .chatbot .section-title h2{white-space:normal}
  .chatbot-grid{grid-template-columns:minmax(0,1fr) 34%}
  .chat-types{width:62%;max-width:650px}
  .chat-points{left:64%;width:31%}
  .chatbot-img{width:100%;min-height:350px}
}
@media(max-width:900px){
  .chatbot-grid{grid-template-columns:1fr}
  .chat-types{width:100%;max-width:650px}
  .chat-points{position:static;width:auto;margin:24px 0 0}
  .chatbot-img{width:100%;height:300px;min-height:0;object-position:center}
}
@media(max-width:600px){
  .chatbot .section-title h2{font-size:23px;white-space:normal}
  .chat-types{grid-template-columns:1fr}
  .chatbot-img{height:240px}
}

/* =========================================================
   CHATBOT FINAL ALIGNMENT 2026-10-06
   - photo fills the right side to section top/right/bottom
   - copy remains above the photo
   - EN label / yellow rule alignment corrected
   ========================================================= */
@media (min-width:901px){
  .chatbot{
    position:relative;
    min-height:500px;
    padding:42px 0 0;
    background:linear-gradient(90deg,#fff 0%,#fff 48%,#f6fbff 66%,#eaf5fd 100%);
  }
  .chatbot .support-wrap{
    position:relative;
    z-index:2;
  }
  .chatbot-grid{
    display:block;
    position:relative;
    z-index:2;
    min-height:458px;
  }
  .chat-copy{
    position:relative;
    z-index:4;
    width:100%;
    padding-bottom:42px;
  }
  .chatbot .section-title{
    display:block;
    margin:0 0 28px;
  }
  .chatbot .section-title h2{
    display:block;
    width:max-content;
    max-width:100%;
    margin:0;
    padding:0;
    font-size:29px;
    line-height:1.2;
    font-weight:800;
  }
  .chatbot .section-title h2:after{
    width:42px;
    height:3px;
    margin:14px 0 0;
  }
  .chatbot .section-title span{
    display:block;
    margin:7px 0 0;
    padding:0;
    font-size:10px;
    line-height:1.15;
    font-weight:800;
    letter-spacing:.08em;
  }
  .chat-types{
    position:relative;
    z-index:4;
    width:650px;
    max-width:60%;
  }
  .chat-points{
    z-index:5;
    left:62%;
    top:160px;
    width:260px;
    text-shadow:0 1px 0 rgba(255,255,255,.9);
  }
  .chatbot-img{
    position:absolute;
    z-index:1;
    top:-42px;
    right:calc((100vw - min(1100px, calc(100vw - 48px))) / -2);
    bottom:0;
    width:max(47vw,620px);
    height:calc(100% + 42px);
    min-height:0;
    max-width:none;
    object-fit:cover;
    object-position:60% center;
  }
  /* subtle readable backing only behind copy; image itself stays untouched */
  .chatbot-grid:after{
    content:"";
    position:absolute;
    z-index:2;
    inset:-42px 28% 0 48%;
    pointer-events:none;
    background:linear-gradient(90deg,rgba(247,251,255,.98) 0%,rgba(247,251,255,.78) 42%,rgba(247,251,255,0) 100%);
  }
}

/* =========================================================
   CHATBOT POLISH 2026-10-06
   ========================================================= */
@media (min-width:901px){
  .chatbot{
    overflow:hidden;
    background:linear-gradient(90deg,#ffffff 0%,#fbfdff 28%,#f4f9fe 52%,#eaf5fd 78%,#e6f2fb 100%);
  }
  .chatbot .support-wrap{position:relative;z-index:2}
  .chatbot-grid:before{
    content:"";
    position:absolute;
    z-index:2;
    inset:-42px 0 0 0;
    pointer-events:none;
    background:linear-gradient(90deg,
      rgba(255,255,255,.98) 0%,
      rgba(255,255,255,.95) 35%,
      rgba(248,252,255,.90) 49%,
      rgba(239,247,253,.68) 61%,
      rgba(232,244,252,.30) 72%,
      rgba(232,244,252,0) 84%);
  }
  .chatbot-grid:after{display:none}
  .chat-copy{position:relative;z-index:4}
  .chat-types{
    width:690px;
    max-width:63%;
    grid-template-columns:minmax(0,1fr) 42px minmax(0,1fr);
    gap:16px;
  }
  .chat-types article{
    min-height:250px;
    padding:22px 20px 18px;
    border-radius:6px;
    border:1px solid #bfd1e6;
    background:rgba(255,255,255,.86);
  }
  .chat-types h3{font-size:18px;margin-bottom:17px}
  .chat-types b{
    min-height:36px;
    display:flex;
    align-items:center;
    justify-content:center;
    margin:7px 0;
    padding:7px 12px;
    font-size:12.5px;
    line-height:1.3;
    border-radius:4px;
  }
  .chat-types p{font-size:12px;line-height:1.75;margin-top:16px;font-weight:650}
  .chat-types i{font-size:32px}
  .chat-points{
    position:absolute;
    z-index:5;
    left:64%;
    top:155px;
    width:330px;
    margin:0;
    color:var(--sp-navy);
    text-shadow:0 1px 1px rgba(255,255,255,.95);
  }
  .chat-points h3{
    margin:0 0 20px;
    font-size:16px;
    line-height:1.75;
    font-weight:800;
  }
  .chat-points p{
    margin:0;
    font-size:13.5px;
    line-height:2.15;
    font-weight:750;
  }
  .chat-points p br{content:""}
  .chatbot-img{
    z-index:1;
    object-position:58% center;
  }
}


/* =========================================================
   SUPPORT iPHONE FINAL OVERRIDE
   PC版には影響させず、iPhone幅のみ調整
   ========================================================= */
@media (max-width:600px){

  .support-wrap{
    width:calc(100% - 24px);
  }

  /* HERO：コピー→写真の順で自然に収める */
  .support-hero{
    height:auto;
    min-height:0;
    padding-bottom:0;
    background:#eef7ff;
    overflow:hidden;
  }

  .support-hero__copy{
    position:relative;
    z-index:2;
    padding-top:28px;
    padding-bottom:250px;
  }

  .support-hero__bg{
    position:absolute;
    z-index:1;
    left:0;
    right:0;
    top:auto;
    bottom:0;
    width:100%;
    height:255px;
    object-fit:cover;
    object-position:67% center;
    opacity:1;
  }

  .support-hero h1{
    font-size:28px;
    line-height:1.22;
    margin:6px 0 4px;
  }

  .support-hero h2{
    font-size:15px;
    line-height:1.45;
    margin:18px 0 2px;
  }

  .support-hero .lead{
    max-width:100%;
    margin-top:14px;
    font-size:10px;
    line-height:1.8;
  }

  .hero-actions{
    width:220px;
    gap:10px;
    margin-top:18px;
  }

  .hero-actions a{
    width:220px;
    height:43px;
    padding:0 14px;
    box-sizing:border-box;
    justify-content:space-between;
    font-size:13px;
    line-height:1.15;
  }

  /* HERO下4項目：縦1列ではなく2×2 */
  .info-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    min-height:0;
  }

  .info-grid>div{
    min-width:0;
    min-height:116px;
    padding:15px 10px;
    gap:9px;
    border-right:1px dotted #7290b6;
    border-bottom:1px dotted #7290b6;
  }

  .info-grid>div:nth-child(2n){
    border-right:0;
  }

  .info-grid>div:nth-last-child(-n+2){
    border-bottom:0;
  }

  .info-grid img{
    flex:0 0 48px;
    width:48px;
    height:48px;
  }

  .info-grid p{
    min-width:0;
    margin:0;
    font-size:10px;
    line-height:1.45;
  }

  .info-grid b{
    font-size:11px;
    line-height:1.4;
  }

  .info-grid small{
    font-size:6.5px;
    letter-spacing:.08em;
  }

  /* 主なサポート内容：スマホは2列 */
  .support-content-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:9px;
  }

  .support-content-grid>div{
    min-width:0;
    min-height:104px;
    padding:10px 9px;
    gap:8px;
  }

  .support-content-grid img{
    width:58px;
    height:58px;
    flex:0 0 58px;
    padding:11px;
  }

  .support-content-grid b{
    min-width:0;
    font-size:10.5px;
    line-height:1.45;
    overflow-wrap:normal;
    word-break:normal;
  }

  /* よくあるご相談：2列を維持 */
  .consult-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .consult-grid>div,
  .consult-grid>div:nth-child(3n){
    min-width:0;
    min-height:178px;
    grid-template-columns:58px 70px 1fr;
    padding:14px 10px;
    border-right:1px dotted #5d779d;
    border-bottom:1px dotted #5d779d;
  }

  .consult-grid>div:nth-child(2n){
    border-right:0;
  }

  .consult-grid>div:nth-last-child(-n+2){
    border-bottom:0;
  }

  .consult-grid strong{
    font-size:32px;
  }

  .consult-grid img{
    width:66px;
    height:66px;
    margin:28px 0 0 6px;
  }

  .consult-grid p{
    min-width:0;
    font-size:11px;
    line-height:1.65;
  }

  /* サポートの流れ：スマホは2列 */
  .process-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    row-gap:26px;
  }

  .process-grid>div{
    min-width:0;
    padding:0 13px 22px;
    border-right:1px solid #d8e0ea;
  }

  .process-grid>div:nth-child(2n){
    border-right:0;
  }

  .process-grid h3{
    font-size:14px;
  }

  .process-grid h3 em{
    font-size:27px;
  }

  .process-grid img{
    width:88px;
    height:76px;
  }

  .process-grid p{
    font-size:10px;
    line-height:1.7;
  }

  /* 私たちの強み：2列 */
  .strength-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .strength-grid article{
    min-width:0;
    padding:18px 16px 24px;
    margin:0;
    border-right:1px solid #617393;
    border-bottom:1px solid #617393;
  }

  .strength-grid article:nth-child(2n){
    border-right:0;
  }

  .strength-grid article:nth-last-child(-n+2){
    border-bottom:0;
  }

  .strength-grid h3{
    font-size:13px;
  }

  .strength-grid li{
    font-size:10px;
  }

  /* 事例：2列 */
  .case-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .case-grid img{
    height:120px;
  }

  /* Chatbot：スマホでは無理な重なりを解除 */
  .chatbot{
    padding-top:34px;
  }

  .chatbot-grid{
    display:block;
  }

  .chat-copy{
    padding-bottom:22px;
  }

  .chatbot .section-title h2{
    font-size:23px;
    line-height:1.3;
    white-space:normal;
  }

  .chat-types{
    width:100%;
    max-width:none;
    grid-template-columns:1fr;
    gap:12px;
  }

  .chat-types i{
    display:none;
  }

  .chat-points{
    position:static;
    width:auto;
    margin:22px 0 0;
  }

  .chatbot-img{
    position:static;
    display:block;
    width:calc(100% + 24px);
    height:245px;
    margin-left:-12px;
    max-width:none;
    object-fit:cover;
    object-position:62% center;
    -webkit-mask-image:none;
    mask-image:none;
  }

  /* サポート効果：1列だと間延びするので2列 */
  .outcome-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .outcome-grid article{
    min-width:0;
    padding:24px 13px;
    border-right:1px solid #d7dee8;
    border-bottom:1px solid #d7dee8;
  }

  .outcome-grid article:nth-child(2n){
    border-right:0;
  }

  .outcome-grid article:last-child{
    grid-column:1 / -1;
    border-right:0;
  }

  .outcome-grid h3{
    font-size:12px;
  }

  .outcome-grid p{
    font-size:10px;
  }
}

@media (max-width:390px){
  .support-wrap{
    width:calc(100% - 20px);
  }

  .support-hero h1{
    font-size:26px;
  }

  .info-grid>div{
    padding-inline:8px;
  }

  .info-grid img{
    width:44px;
    height:44px;
    flex-basis:44px;
  }

  .support-content-grid>div{
    padding-inline:7px;
  }

  .support-content-grid img{
    width:52px;
    height:52px;
    flex-basis:52px;
    padding:10px;
  }
}


/* =========================================================
   SUPPORT MOBILE PHOTO OVERLAY
   iPhone: 既存写真を背景化し、テキストを前面に重ねる
   ========================================================= */
@media (max-width:600px){

  /* ---------- HERO ---------- */
  .support-hero{
    position:relative;
    isolation:isolate;
    min-height:620px;
    padding:0;
    overflow:hidden;
    background:#eef7ff;
  }

  .support-hero__bg{
    position:absolute;
    z-index:-2;
    inset:0;
    display:block;
    width:100%;
    height:100%;
    max-width:none;
    object-fit:cover;
    object-position:66% center;
    opacity:1;
  }

  /* 写真は残しながら、文字側を白〜薄水色で保護 */
  .support-hero:after{
    content:"";
    position:absolute;
    z-index:-1;
    inset:0;
    pointer-events:none;
    background:
      linear-gradient(90deg,
        rgba(242,249,255,.99) 0%,
        rgba(242,249,255,.98) 43%,
        rgba(242,249,255,.88) 58%,
        rgba(242,249,255,.42) 76%,
        rgba(242,249,255,.06) 100%),
      linear-gradient(180deg,
        rgba(242,249,255,.94) 0%,
        rgba(242,249,255,.48) 55%,
        rgba(242,249,255,.04) 100%);
  }

  .support-hero__copy{
    position:relative;
    z-index:2;
    padding-top:28px;
    padding-bottom:30px;
  }

  .support-hero .lead{
    max-width:72%;
  }

  .hero-actions{
    position:relative;
    z-index:3;
  }


  /* ---------- Chatbot / AI ---------- */
  .chatbot{
    position:relative;
    isolation:isolate;
    overflow:hidden;
    padding:34px 0 38px;
    background:#eef7ff;
  }

  .chatbot-grid{
    position:relative;
    z-index:2;
    display:block;
  }

  /*
   * 元のimgをセクション全面へ。
   * HTML変更なしで写真を背景レイヤーとして利用。
   */
  .chatbot-img{
    position:absolute;
    z-index:-2;
    inset:0;
    display:block;
    width:100%;
    height:100%;
    max-width:none;
    margin:0;
    object-fit:cover;
    object-position:67% center;
    opacity:1;
    -webkit-mask-image:none;
    mask-image:none;
  }

  /* 左側のコピーを読みやすくしつつ、右側は写真を見せる */
  .chatbot:before{
    content:"";
    position:absolute;
    z-index:0;
    inset:0;
    pointer-events:none;
    background:
      linear-gradient(90deg,
        rgba(247,251,255,.99) 0%,
        rgba(247,251,255,.98) 46%,
        rgba(247,251,255,.90) 60%,
        rgba(247,251,255,.52) 76%,
        rgba(247,251,255,.10) 100%),
      linear-gradient(180deg,
        rgba(247,251,255,.94) 0%,
        rgba(247,251,255,.68) 42%,
        rgba(247,251,255,.18) 100%);
  }

  .chatbot .support-wrap{
    position:relative;
    z-index:2;
  }

  .chat-copy{
    position:relative;
    z-index:3;
    padding-bottom:0;
  }

  .chatbot .section-title{
    position:relative;
    z-index:4;
  }

  .chat-types{
    position:relative;
    z-index:4;
  }

  .chat-types article{
    background:rgba(255,255,255,.86);
    -webkit-backdrop-filter:blur(1.5px);
    backdrop-filter:blur(1.5px);
  }

  .chat-points{
    position:relative;
    z-index:4;
    width:78%;
    margin:26px 0 0;
    color:var(--sp-navy);
  }

  .chat-points h3{
    font-size:15px;
    line-height:1.65;
    font-weight:800;
  }

  .chat-points p,
  .chat-points li{
    font-weight:700;
  }
}


/* 小さいiPhoneでは文字面積を少し広げる */
@media (max-width:390px){

  .support-hero .lead{
    max-width:78%;
  }

  .support-hero:after{
    background:
      linear-gradient(90deg,
        rgba(242,249,255,.99) 0%,
        rgba(242,249,255,.98) 48%,
        rgba(242,249,255,.88) 65%,
        rgba(242,249,255,.30) 84%,
        rgba(242,249,255,.05) 100%),
      linear-gradient(180deg,
        rgba(242,249,255,.94) 0%,
        rgba(242,249,255,.45) 62%,
        rgba(242,249,255,.04) 100%);
  }

  .chat-points{
    width:84%;
  }
}


/* =========================================================
   SUPPORT MOBILE v2
   2026-10-06
   ・Hero写真を縮小し右下基準
   ・Chatbot写真を右下基準
   ・Chatbot右テキストの崩れを解消
   PC / Tabletには影響させない
   ========================================================= */
@media (max-width:600px){

  /* =========================
     HERO
     写真全体を拡大しすぎず、右下を基準に見せる
     ========================= */
  .support-hero{
    min-height:600px;
    background:#eef7ff;
  }

  .support-hero__bg{
    inset:auto 0 0 auto;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:78% 100%;
    transform:scale(.88);
    transform-origin:right bottom;
  }

  .support-hero:after{
    background:
      linear-gradient(90deg,
        rgba(242,249,255,.99) 0%,
        rgba(242,249,255,.98) 42%,
        rgba(242,249,255,.88) 58%,
        rgba(242,249,255,.46) 73%,
        rgba(242,249,255,.10) 100%),
      linear-gradient(180deg,
        rgba(242,249,255,.96) 0%,
        rgba(242,249,255,.80) 35%,
        rgba(242,249,255,.35) 67%,
        rgba(242,249,255,.03) 100%);
  }

  .support-hero .lead{
    max-width:82%;
  }


  /* =========================
     CHATBOT / AI
     写真を右下に固定し、その上へテキストを配置
     ========================= */
  .chatbot{
    min-height:760px;
    padding:34px 0 36px;
    background:#eef7ff;
  }

  .chatbot .support-wrap{
    min-height:690px;
  }

  .chatbot-grid{
    position:relative;
    z-index:2;
    min-height:690px;
    display:block;
  }

  /* 写真はセクション右下。画面が見える程度に縮小 */
  .chatbot-img{
    position:absolute;
    z-index:-2;
    top:auto;
    left:auto;
    right:-1px;
    bottom:0;
    width:100%;
    height:455px;
    object-fit:cover;
    object-position:72% 100%;
    transform:none;
    margin:0;
  }

  /*
   * 上部は白く、下へ行くほど写真が見える。
   * 横方向にも左側を少し白くして文字を保護。
   */
  .chatbot:before{
    background:
      linear-gradient(90deg,
        rgba(247,251,255,.99) 0%,
        rgba(247,251,255,.98) 34%,
        rgba(247,251,255,.82) 56%,
        rgba(247,251,255,.30) 78%,
        rgba(247,251,255,.04) 100%),
      linear-gradient(180deg,
        rgba(247,251,255,.99) 0%,
        rgba(247,251,255,.97) 45%,
        rgba(247,251,255,.76) 59%,
        rgba(247,251,255,.28) 76%,
        rgba(247,251,255,.02) 100%);
  }

  .chat-types{
    margin-bottom:0;
  }

  /*
   * 問題になっていた3段目テキスト。
   * 幅を固定しすぎず、画像上の左側に収める。
   */
  .chat-points{
    position:relative;
    z-index:5;
    width:72%;
    max-width:360px;
    margin:28px 0 0;
    padding:0 0 225px;
    box-sizing:border-box;
    color:var(--sp-navy);
  }

  .chat-points h3{
    margin:0 0 14px;
    font-size:14px;
    line-height:1.65;
    font-weight:800;
    overflow-wrap:normal;
    word-break:normal;
  }

  .chat-points p,
  .chat-points ul,
  .chat-points li{
    font-size:13px;
    line-height:1.75;
    font-weight:700;
    overflow-wrap:normal;
    word-break:normal;
  }

  .chat-points ul{
    margin-bottom:0;
  }
}


@media (max-width:390px){

  .support-hero{
    min-height:580px;
  }

  .support-hero__bg{
    object-position:80% 100%;
    transform:scale(.86);
  }

  .support-hero .lead{
    max-width:88%;
  }

  .chatbot{
    min-height:750px;
  }

  .chatbot .support-wrap,
  .chatbot-grid{
    min-height:680px;
  }

  .chatbot-img{
    height:430px;
    object-position:74% 100%;
  }

  .chat-points{
    width:76%;
    padding-bottom:210px;
  }
}


/* =========================================================
   SUPPORT MOBILE v3
   2026-10-06
   v2のモバイル指定を最終上書き
   ・Heroを短くし、写真の見え方を約2/3へ
   ・Chatbot写真を薄い背景化
   ・Chatbot説明文を左側に固定し、画像との競合を解消
   ========================================================= */
@media (max-width:600px){

  /* ---------- HERO ---------- */
  .support-hero{
    min-height:0 !important;
    height:auto !important;
    padding-bottom:0 !important;
    overflow:hidden;
    background:#eef7ff;
  }

  .support-hero .support-wrap{
    min-height:0 !important;
    padding-bottom:330px !important;
  }

  .support-hero__bg{
    top:auto !important;
    right:0 !important;
    bottom:0 !important;
    left:auto !important;
    width:100% !important;
    height:390px !important;
    object-fit:cover !important;
    object-position:78% 100% !important;
    transform:scale(.72) !important;
    transform-origin:right bottom !important;
  }

  .support-hero:after{
    background:
      linear-gradient(90deg,
        rgba(242,249,255,.99) 0%,
        rgba(242,249,255,.97) 31%,
        rgba(242,249,255,.78) 50%,
        rgba(242,249,255,.30) 70%,
        rgba(242,249,255,.04) 100%),
      linear-gradient(180deg,
        rgba(242,249,255,.82) 0%,
        rgba(242,249,255,.48) 34%,
        rgba(242,249,255,.10) 72%,
        rgba(242,249,255,0) 100%);
  }


  /* ---------- CHATBOT ---------- */
  .chatbot{
    min-height:0 !important;
    height:auto !important;
    padding:30px 0 34px !important;
    overflow:hidden;
    background:#f4f9fe;
  }

  .chatbot .support-wrap,
  .chatbot-grid{
    min-height:0 !important;
    height:auto !important;
  }

  .chatbot-grid{
    display:block !important;
    position:relative;
    z-index:1;
    padding-bottom:315px;
  }

  /* 写真は「コンテンツ」ではなく薄い背景として使用 */
  .chatbot-img{
    position:absolute !important;
    z-index:-2 !important;
    top:auto !important;
    right:-2% !important;
    bottom:0 !important;
    left:auto !important;
    width:104% !important;
    height:390px !important;
    margin:0 !important;
    object-fit:cover !important;
    object-position:72% 100% !important;
    opacity:.30 !important;
    transform:none !important;
    filter:saturate(.82) contrast(.92) brightness(1.08);
  }

  /* 写真の上を白くフェード。左側の文字を最優先で読みやすく */
  .chatbot:before{
    z-index:0 !important;
    background:
      linear-gradient(90deg,
        rgba(248,252,255,1) 0%,
        rgba(248,252,255,.99) 40%,
        rgba(248,252,255,.88) 60%,
        rgba(248,252,255,.42) 82%,
        rgba(248,252,255,.14) 100%),
      linear-gradient(180deg,
        rgba(248,252,255,1) 0%,
        rgba(248,252,255,.98) 48%,
        rgba(248,252,255,.72) 65%,
        rgba(248,252,255,.20) 100%);
  }

  .chatbot .support-wrap{
    position:relative;
    z-index:2;
  }

  .chat-types{
    position:relative;
    z-index:3;
  }

  /* 説明文は左に見せる。画像上に無理に重ねない */
  .chat-points{
    position:relative !important;
    z-index:4 !important;
    width:88% !important;
    max-width:none !important;
    margin:24px 0 0 !important;
    padding:0 !important;
    box-sizing:border-box;
    color:var(--sp-navy) !important;
    text-align:left !important;
  }

  .chat-points h3{
    margin:0 0 13px !important;
    font-size:14px !important;
    line-height:1.65 !important;
    font-weight:800 !important;
    color:var(--sp-navy) !important;
    word-break:normal !important;
    overflow-wrap:normal !important;
  }

  .chat-points p,
  .chat-points ul,
  .chat-points li{
    font-size:13px !important;
    line-height:1.7 !important;
    font-weight:700 !important;
    color:var(--sp-navy) !important;
    word-break:normal !important;
    overflow-wrap:normal !important;
  }

  .chat-points ul{
    margin:0 !important;
    padding:0 !important;
  }

  .chat-points li{
    margin-bottom:4px !important;
  }
}


@media (max-width:390px){

  .support-hero .support-wrap{
    padding-bottom:300px !important;
  }

  .support-hero__bg{
    height:360px !important;
    object-position:80% 100% !important;
    transform:scale(.70) !important;
  }

  .chatbot-grid{
    padding-bottom:285px;
  }

  .chatbot-img{
    width:106% !important;
    height:355px !important;
    object-position:74% 100% !important;
    opacity:.28 !important;
  }

  .chat-points{
    width:92% !important;
  }
}


/* =========================================================
   SUPPORT MOBILE v4
   ・Hero：現在の写真サイズを維持し、上部テキストと写真を自然に重ねる
   ・Chatbot：説明テキストを確実に左揃え
   ========================================================= */
@media (max-width:600px){

  /* =========================
     HERO
     ========================= */
  .support-hero .support-wrap{
    /* v3の大きな写真用余白を減らし、写真をテキスト側へ上げる */
    padding-bottom:245px !important;
  }

  .support-hero__bg{
    /* 写真サイズはv3とほぼ同じ */
    height:390px !important;
    transform:scale(.72) !important;
    transform-origin:right bottom !important;
    object-position:78% 100% !important;
  }

  /* テキスト側から写真側へ自然につなぐ */
  .support-hero:after{
    background:
      linear-gradient(90deg,
        rgba(242,249,255,.99) 0%,
        rgba(242,249,255,.97) 34%,
        rgba(242,249,255,.76) 54%,
        rgba(242,249,255,.28) 76%,
        rgba(242,249,255,.03) 100%),
      linear-gradient(180deg,
        rgba(242,249,255,.97) 0%,
        rgba(242,249,255,.91) 42%,
        rgba(242,249,255,.57) 59%,
        rgba(242,249,255,.14) 77%,
        rgba(242,249,255,0) 100%);
  }


  /* =========================
     CHATBOT
     ========================= */

  /* 既存gridの列位置を完全解除 */
  .chatbot .chat-points,
  .chatbot-grid .chat-points{
    position:relative !important;
    inset:auto !important;
    grid-column:auto !important;
    grid-row:auto !important;
    justify-self:auto !important;
    align-self:auto !important;

    display:block !important;
    width:100% !important;
    max-width:none !important;
    min-width:0 !important;

    margin:24px 0 0 !important;
    padding:0 18px 0 0 !important;

    transform:none !important;
    box-sizing:border-box !important;

    text-align:left !important;
    color:var(--sp-navy) !important;
  }

  .chatbot .chat-points h3,
  .chatbot .chat-points p,
  .chatbot .chat-points ul,
  .chatbot .chat-points li{
    position:static !important;
    left:auto !important;
    right:auto !important;
    width:auto !important;
    max-width:none !important;
    transform:none !important;
    text-align:left !important;
    white-space:normal !important;
  }

  .chatbot .chat-points h3{
    margin:0 0 14px !important;
  }

  .chatbot .chat-points ul{
    margin:0 !important;
    padding:0 !important;
    list-style:none !important;
  }

  .chatbot .chat-points li{
    margin:0 0 5px !important;
    padding:0 0 0 16px !important;
  }

  .chatbot .chat-points li:before{
    left:0 !important;
  }
}


@media (max-width:390px){

  .support-hero .support-wrap{
    padding-bottom:225px !important;
  }

  .support-hero__bg{
    height:360px !important;
    transform:scale(.70) !important;
    object-position:80% 100% !important;
  }

  .chatbot .chat-points,
  .chatbot-grid .chat-points{
    padding-right:10px !important;
  }
}


/* =========================================================
   SUPPORT MOBILE v5
   最終微調整
   1. Hero写真を上へ重ねる（写真サイズは維持）
   2. Chatbot説明を他コンテンツと同じ左右余白へ
   3. Chatbot文字組をカンプ寄りに
   ========================================================= */
@media (max-width:600px){

  /* ---------- HERO ---------- */
  .support-hero .support-wrap{
    /* 写真がテキスト下端へ入り込む分だけ全体高を詰める */
    padding-bottom:205px !important;
  }

  .support-hero__bg{
    /* 大きさはv4を維持。位置だけ上へ */
    height:390px !important;
    transform:translateY(-42px) scale(.72) !important;
    transform-origin:right bottom !important;
    object-position:78% 100% !important;
  }

  /* 写真が文字に近づいても左側の可読性を保つ */
  .support-hero:after{
    background:
      linear-gradient(90deg,
        rgba(242,249,255,.995) 0%,
        rgba(242,249,255,.98) 38%,
        rgba(242,249,255,.82) 55%,
        rgba(242,249,255,.34) 77%,
        rgba(242,249,255,.04) 100%),
      linear-gradient(180deg,
        rgba(242,249,255,.98) 0%,
        rgba(242,249,255,.92) 39%,
        rgba(242,249,255,.56) 57%,
        rgba(242,249,255,.12) 78%,
        rgba(242,249,255,0) 100%);
  }


  /* ---------- CHATBOT ---------- */
  .chatbot .chat-points,
  .chatbot-grid .chat-points{
    /* 他のChatbot内容と同じ左右マージン */
    width:auto !important;
    margin:26px 18px 0 !important;
    padding:0 !important;
    box-sizing:border-box !important;

    text-align:left !important;
    color:var(--sp-navy) !important;

    /* 写真より前面 */
    position:relative !important;
    z-index:4 !important;
  }

  .chatbot .chat-points h3{
    margin:0 0 15px !important;
    padding:0 !important;
    font-size:15px !important;
    line-height:1.65 !important;
    font-weight:700 !important;
    letter-spacing:0 !important;
    text-align:left !important;
  }

  .chatbot .chat-points ul{
    margin:0 !important;
    padding:0 !important;
    list-style:none !important;
  }

  .chatbot .chat-points li{
    position:relative !important;
    margin:0 0 5px !important;
    padding:0 0 0 16px !important;
    font-size:14px !important;
    line-height:1.55 !important;
    font-weight:700 !important;
    letter-spacing:0 !important;
    text-align:left !important;
  }

  .chatbot .chat-points li:before{
    content:"" !important;
    position:absolute !important;
    left:0 !important;
    top:.62em !important;
    width:8px !important;
    height:8px !important;
    border-radius:50% !important;
    background:var(--sp-navy) !important;
  }

  /* Chatbot写真は背景としてテキストの後ろへ */
  .chatbot .chat-bg,
  .chatbot-grid .chat-bg{
    z-index:1 !important;
  }
}

@media (max-width:390px){

  .support-hero .support-wrap{
    padding-bottom:190px !important;
  }

  .support-hero__bg{
    height:360px !important;
    transform:translateY(-38px) scale(.70) !important;
    transform-origin:right bottom !important;
    object-position:80% 100% !important;
  }

  .chatbot .chat-points,
  .chatbot-grid .chat-points{
    margin-left:14px !important;
    margin-right:14px !important;
  }

  .chatbot .chat-points h3{
    font-size:14px !important;
  }

  .chatbot .chat-points li{
    font-size:13px !important;
  }
}


/* =========================================================
   SUPPORT MOBILE v6
   背景画像を上基準へ
   - Hero: 写真を上へ、テキスト背面に回す
   - Chatbot: 写真を説明文の上端付近から背景として開始
   ========================================================= */
@media (max-width:600px){

  /* HERO：背景写真をもっと上から始める */
  .support-hero .support-wrap{
    padding-bottom:165px !important;
  }

  .support-hero__bg{
    height:390px !important;
    transform:translateY(-118px) scale(.72) !important;
    transform-origin:right top !important;
    object-position:78% 0% !important;
    z-index:0 !important;
  }

  .support-hero .support-wrap{
    position:relative !important;
    z-index:2 !important;
  }

  /* 背景写真が上まで来ても文字は読みやすく */
  .support-hero:after{
    z-index:1 !important;
    background:
      linear-gradient(90deg,
        rgba(242,249,255,.995) 0%,
        rgba(242,249,255,.97) 42%,
        rgba(242,249,255,.76) 61%,
        rgba(242,249,255,.30) 82%,
        rgba(242,249,255,.05) 100%),
      linear-gradient(180deg,
        rgba(242,249,255,.90) 0%,
        rgba(242,249,255,.74) 38%,
        rgba(242,249,255,.40) 66%,
        rgba(242,249,255,.10) 100%);
  }


  /* CHATBOT：画像を下の独立画像ではなく背景として上へ */
  .chatbot{
    position:relative !important;
    overflow:hidden !important;
  }

  .chatbot .chat-bg,
  .chatbot-grid .chat-bg{
    top:auto !important;
    bottom:0 !important;
    height:430px !important;
    transform:translateY(-150px) !important;
    object-position:72% 0% !important;
    opacity:.32 !important;
    z-index:1 !important;
  }

  .chatbot .chat-points,
  .chatbot-grid .chat-points{
    position:relative !important;
    z-index:4 !important;
    margin-top:26px !important;
    padding-bottom:135px !important;
  }

  /* 左側を白くして、背景画像上でも文字を優先 */
  .chatbot:after{
    content:"" !important;
    position:absolute !important;
    left:0 !important;
    right:0 !important;
    top:0 !important;
    bottom:0 !important;
    pointer-events:none !important;
    z-index:2 !important;
    background:
      linear-gradient(90deg,
        rgba(247,251,255,.98) 0%,
        rgba(247,251,255,.94) 42%,
        rgba(247,251,255,.67) 66%,
        rgba(247,251,255,.12) 100%);
  }

  /* カード等はオーバーレイより前面 */
  .chatbot > *,
  .chatbot-grid > *{
    position:relative;
    z-index:3;
  }

  .chatbot .chat-bg,
  .chatbot-grid .chat-bg{
    position:absolute !important;
    z-index:1 !important;
  }
}

@media (max-width:390px){

  .support-hero .support-wrap{
    padding-bottom:150px !important;
  }

  .support-hero__bg{
    height:360px !important;
    transform:translateY(-105px) scale(.70) !important;
    transform-origin:right top !important;
    object-position:80% 0% !important;
  }

  .chatbot .chat-bg,
  .chatbot-grid .chat-bg{
    height:400px !important;
    transform:translateY(-135px) !important;
    object-position:72% 0% !important;
  }

  .chatbot .chat-points,
  .chatbot-grid .chat-points{
    padding-bottom:120px !important;
  }
}

/* =========================================================
   2026-11-04 Responsive refinements: consultations + mobile hero
   ========================================================= */
@media (max-width: 900px) {
  .consultations .consult-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0 !important;
  }
  .consultations .consult-grid > div,
  .consultations .consult-grid > div:nth-child(3n) {
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    min-width: 0 !important;
    min-height: 0 !important;
    padding: 19px 18px 24px !important;
    border-right: 1px dotted #5d779d !important;
    border-bottom: 1px dotted #5d779d !important;
  }
  .consultations .consult-grid > div:nth-child(2n) {border-right: 0 !important;}
  .consultations .consult-grid > div:nth-last-child(-n+2) {border-bottom: 0 !important;}
  .consultations .consult-grid strong {
    position: static !important;
    display: block !important;
    font-size: clamp(25px, 4vw, 34px) !important;
    line-height: 1.15 !important;
    margin: 0 0 12px !important;
    font-weight: 500 !important;
  }
  .consultations .consult-grid img {
    display: block !important;
    align-self: center !important;
    width: clamp(65px, 12vw, 92px) !important;
    height: clamp(65px, 12vw, 92px) !important;
    max-width: 100% !important;
    object-fit: contain !important;
    margin: 0 auto 14px !important;
  }
  .consultations .consult-grid p {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    font-size: clamp(12px, 1.8vw, 15px) !important;
    line-height: 1.85 !important;
    letter-spacing: .015em !important;
    text-align: left !important;
    overflow-wrap: anywhere !important;
    word-break: normal !important;
  }
  .consultations .consult-grid p br {display: none !important;}
}
@media (max-width: 600px) {
  .support-page .support-hero {
    height: auto !important;
    min-height: 0 !important;
    padding: 0 !important;
    background: #eef7ff !important;
    isolation: isolate;
  }
  .support-page .support-hero .support-wrap,
  .support-page .support-hero .support-hero__copy {
    position: relative !important;
    z-index: 3 !important;
    padding: 25px 0 110px !important;
  }
  .support-page .support-hero__bg {
    position: absolute !important;
    top: auto !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 215px !important;
    transform: none !important;
    object-fit: cover !important;
    object-position: 72% center !important;
    opacity: .68 !important;
    z-index: 0 !important;
  }
  .support-page .support-hero::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 1 !important;
    pointer-events: none !important;
    background: linear-gradient(180deg,#eef7ff 0%,rgba(238,247,255,.98) 55%,rgba(238,247,255,.65) 80%,rgba(238,247,255,.10) 100%) !important;
  }
  .support-page .support-hero h1 {font-size: clamp(24px, 6.5vw, 29px) !important; line-height: 1.35 !important;}
  .support-page .support-hero h2 {margin-top: 17px !important; line-height: 1.55 !important;}
  .support-page .support-hero .lead {font-size: 11px !important; line-height: 1.8 !important; margin-top: 13px !important;}
  .support-page .hero-actions {display: flex !important; flex-direction: column !important; width: min(100%, 275px) !important; gap: 10px !important; margin-top: 17px !important;}
  .support-page .hero-actions a {box-sizing: border-box !important; width: 100% !important; min-width: 0 !important; min-height: 46px !important; height: auto !important; padding: 10px 14px !important; font-size: 13px !important; line-height: 1.4 !important; gap: 12px !important;}
  .support-page .hero-actions a small {flex-shrink: 0 !important; font-size: 8px !important; margin-left: 0 !important;}
  .consultations .consult-grid > div,
  .consultations .consult-grid > div:nth-child(3n) {padding: 16px 13px 21px !important;}
  .consultations .consult-grid strong {font-size: 28px !important; margin-bottom: 10px !important;}
  .consultations .consult-grid img {width: 70px !important; height: 70px !important; margin-bottom: 12px !important;}
  .consultations .consult-grid p {font-size: 12px !important; line-height: 1.85 !important;}
}
@media (max-width: 390px) {
  .support-page .support-hero .support-wrap,
  .support-page .support-hero .support-hero__copy {padding-bottom: 92px !important;}
  .consultations .consult-grid > div {padding-inline: 10px !important;}
  .consultations .consult-grid p {font-size: 11.5px !important;}
}

/* 2026-11-04: mobile hero spacing and process 04 lower rule */
@media (max-width:600px) {
  .support-page .support-hero .support-wrap,
  .support-page .support-hero .support-hero__copy {
    padding-bottom: 42px !important;
  }
  .support-page .support-hero__bg {
    height: 205px !important;
    object-position: 72% center !important;
    opacity: .78 !important;
  }
  .support-page .support-hero::after {
    background: linear-gradient(180deg, #eef7ff 0%, rgba(238,247,255,.98) 49%, rgba(238,247,255,.62) 72%, rgba(238,247,255,.06) 100%) !important;
  }
  .support-page .process-grid > div:last-child {
    border-bottom: 1px solid #d8e0ea !important;
  }
}
@media (max-width:390px) {
  .support-page .support-hero .support-wrap,
  .support-page .support-hero .support-hero__copy {
    padding-bottom: 42px !important;
  }
}


/* 2026-11-04 v3: tablet/mobile chatbot title and background spacing */
@media (max-width: 900px) {
  .support-page .chatbot .section-title {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 0 !important;
    margin-bottom: 24px !important;
  }
  .support-page .chatbot .section-title h2 {
    width: 100% !important;
    max-width: 100% !important;
    line-height: 1.45 !important;
    overflow-wrap: anywhere !important;
    margin: 0 !important;
  }
  .support-page .chatbot .section-title h2::after {
    display: block !important;
    position: static !important;
    margin-top: 12px !important;
    margin-bottom: 0 !important;
  }
  .support-page .chatbot .section-title span {
    position: static !important;
    display: block !important;
    margin: 10px 0 0 !important;
    padding: 0 !important;
    line-height: 1.5 !important;
  }
  .support-page .chatbot-grid {
    position: relative !important;
    display: block !important;
    min-height: 0 !important;
    padding-bottom: 220px !important;
  }
  .support-page .chatbot .chat-copy {
    position: relative !important;
    z-index: 3 !important;
    padding-bottom: 0 !important;
  }
  .support-page .chatbot .chat-points,
  .support-page .chatbot-grid .chat-points {
    position: relative !important;
    z-index: 3 !important;
    margin-top: 20px !important;
    padding-bottom: 0 !important;
  }
  .support-page .chatbot .chatbot-img {
    position: absolute !important;
    display: block !important;
    z-index: 1 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    top: auto !important;
    width: 100% !important;
    height: 350px !important;
    min-height: 0 !important;
    margin: 0 !important;
    transform: none !important;
    object-fit: cover !important;
    object-position: center 68% !important;
    opacity: 1 !important;
    mix-blend-mode: normal !important;
    -webkit-mask-image: none !important;
    mask-image: none !important;
  }
}
@media (max-width: 600px) {
  .support-page .chatbot-grid { padding-bottom: 175px !important; }
  .support-page .chatbot .chatbot-img {
    height: 320px !important;
    object-position: 65% 70% !important;
  }
  .support-page .chatbot .section-title h2 { font-size: 23px !important; }
}
@media (max-width: 390px) {
  .support-page .chatbot-grid { padding-bottom: 160px !important; }
  .support-page .chatbot .chatbot-img { height: 300px !important; }
}


/* =========================================================
   OUR STRENGTHS: 見出し・本文の左端統一と自然な改行
   ========================================================= */
.support-page .strength-grid {
  width: 100%;
  align-items: stretch;
}
.support-page .strength-grid > article {
  min-width: 0;
  box-sizing: border-box;
  padding-inline: 24px;
  text-align: left;
}
.support-page .strength-grid > article h3 {
  margin: 0 0 16px;
  padding: 0;
  font-size: clamp(14px, 1.2vw, 16px);
  line-height: 1.55;
  text-align: left;
  overflow-wrap: anywhere;
}
.support-page .strength-grid > article h3::after {
  margin: 10px 0 0;
}
.support-page .strength-grid > article ul {
  list-style: none;
  margin: 0;
  padding: 0;
  text-align: left;
}
.support-page .strength-grid > article li {
  margin: 0 0 9px;
  padding: 0;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.85;
  letter-spacing: .015em;
  overflow-wrap: anywhere;
  word-break: normal;
  line-break: strict;
}
@media (min-width: 901px) and (max-width: 1120px) {
  .support-page .strength-grid > article { padding-inline: 18px; }
  .support-page .strength-grid > article li { font-size: 11px; }
}
@media (min-width: 601px) and (max-width: 900px) {
  .support-page .strength-grid > article { padding: 20px 22px 24px; }
  .support-page .strength-grid > article h3 { font-size: 16px; }
  .support-page .strength-grid > article li { font-size: 12px; }
}
@media (max-width: 600px) {
  .support-page .strength-grid > article { padding: 22px 14px 24px; }
  .support-page .strength-grid > article h3 { font-size: 16px; }
  .support-page .strength-grid > article li { font-size: 13px; }
}


/* ==========================================================
   BPO SUPPORT — TYPOGRAPHY / LINE BREAKS ONLY
   2026-11-04
   ※ Chatbot セクションには一切変更を加えない
   ========================================================== */

/* メインビジュアル下：見出しと説明の強弱 */
.support-page .info-grid > div {
  min-width: 0;
}
.support-page .info-grid > div p {
  min-width: 0;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.65;
  overflow-wrap: anywhere;
}
.support-page .info-grid > div p b {
  display: inline-block;
  margin-bottom: 5px;
  font-size: 16px;
  font-weight: 800;
  line-height: 1.35;
  letter-spacing: .015em;
}
.support-page .info-grid > div p small {
  line-height: 1.5;
}

/* 主なサポート内容：不自然な単語途中の折り返しを軽減 */
.support-page .support-content-grid > div {
  min-width: 0;
}
.support-page .support-content-grid b {
  min-width: 0;
  font-size: 13px;
  line-height: 1.7;
  word-break: normal;
  overflow-wrap: anywhere;
  line-break: strict;
}

/* よくあるご相談：文章の行間を確保 */
.support-page .consultations .consult-grid p {
  word-break: normal;
  line-break: strict;
  overflow-wrap: anywhere;
  line-height: 1.85 !important;
}

/* サポートの流れ：本文の文字を拡大 */
.support-page .process-grid p {
  font-size: 13px;
  line-height: 1.85;
  font-weight: 600;
  word-break: normal;
  line-break: strict;
}

/* サポート効果：見出しと本文の読みやすさ */
.support-page .outcome-grid h3 {
  font-size: 16px;
  line-height: 1.65;
  overflow-wrap: anywhere;
}
.support-page .outcome-grid p {
  font-size: 12px;
  line-height: 1.85;
  overflow-wrap: anywhere;
}

/* iPad：幅の狭い4列で見出しがつぶれないようにする */
@media (min-width: 601px) and (max-width: 900px) {
  .support-page .info-grid > div {
    gap: 12px;
    padding: 16px;
  }
  .support-page .info-grid > div p b {
    font-size: 16px;
  }
  .support-page .support-content-grid b {
    font-size: 13px;
  }
  .support-page .process-grid p {
    font-size: 13px;
  }
}

/* iPhone：既存の2×2レイアウトは維持 */
@media (max-width: 600px) {
  .support-page .info-grid > div {
    gap: 8px;
  }
  .support-page .info-grid > div p b {
    font-size: 14px;
    line-height: 1.4;
  }
  .support-page .info-grid > div p {
    font-size: 11px;
    line-height: 1.65;
  }
  .support-page .support-content-grid b {
    font-size: 12px;
    line-height: 1.7;
  }
  .support-page .process-grid p {
    font-size: 13px;
    line-height: 1.85;
  }
  .support-page .outcome-grid h3 {
    font-size: 16px;
  }
  .support-page .outcome-grid p {
    font-size: 12px;
  }
}


/* ============================================================
   主なサポート内容：アイコン縮小・余白調整・自然な折り返し
   Chatbotおよび他のセクションは変更しない
   ============================================================ */
.support-page .support-content-grid {
  gap: 12px;
}
.support-page .support-content-grid > div {
  min-width: 0;
  min-height: 104px;
  padding: 12px 11px;
  gap: 10px;
  display: flex;
  align-items: center;
}
.support-page .support-content-grid img {
  box-sizing: border-box;
  display: block;
  width: 56px;
  height: 56px;
  flex: 0 0 56px;
  padding: 10px;
  object-fit: contain;
  border-radius: 50%;
}
.support-page .support-content-grid b {
  display: block;
  flex: 1 1 auto;
  min-width: 0;
  font-size: 13px;
  line-height: 1.65;
  font-weight: 700;
  letter-spacing: 0;
  word-break: normal;
  overflow-wrap: anywhere;
  line-break: strict;
}
@media (min-width: 601px) and (max-width: 900px) {
  .support-page .support-content-grid > div {
    padding: 12px 12px;
    gap: 12px;
  }
  .support-page .support-content-grid img {
    width: 56px;
    height: 56px;
    flex-basis: 56px;
  }
  .support-page .support-content-grid b { font-size: 13px; }
}
@media (max-width: 600px) {
  .support-page .support-content-grid { gap: 9px; }
  .support-page .support-content-grid > div {
    min-height: 100px;
    padding: 10px 8px;
    gap: 7px;
  }
  .support-page .support-content-grid img {
    width: 46px;
    height: 46px;
    flex-basis: 46px;
    padding: 8px;
  }
  .support-page .support-content-grid b {
    font-size: 11px;
    line-height: 1.6;
  }
}


/* ==========================================================
   Chatbot: 601–900px only — text/photo separation
   Prevent overlay on laptop screen; leave desktop/phone alone.
   ========================================================== */
@media screen and (min-width: 601px) and (max-width: 900px) {
  .support-page .chatbot .chatbot-grid {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    height: auto !important;
    min-height: 0 !important;
    padding-bottom: 0 !important;
    overflow: hidden !important;
  }
  .support-page .chatbot .chat-copy {
    display: block !important;
    position: relative !important;
    z-index: 2 !important;
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
    padding: 0 0 20px !important;
    margin: 0 !important;
    transform: none !important;
  }
  .support-page .chatbot .chat-points,
  .support-page .chatbot-grid .chat-points {
    position: static !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    margin: 24px 0 0 !important;
    padding: 0 !important;
    transform: none !important;
    color: #071a3e !important;
  }
  .support-page .chatbot .chat-points h3,
  .support-page .chatbot .chat-points p {
    max-width: 100% !important;
    line-height: 1.8 !important;
    overflow-wrap: anywhere !important;
  }
  .support-page .chatbot .chatbot-img {
    display: block !important;
    position: relative !important;
    z-index: 1 !important;
    inset: auto !important;
    width: 100% !important;
    height: auto !important;
    max-height: 330px !important;
    min-height: 0 !important;
    aspect-ratio: 16 / 9;
    object-fit: cover !important;
    object-position: center 60% !important;
    opacity: .64 !important;
    margin: 0 !important;
    transform: none !important;
    mix-blend-mode: normal !important;
    -webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 20%, #000 100%) !important;
    mask-image: linear-gradient(to bottom, transparent 0%, #000 20%, #000 100%) !important;
  }
  .support-page .chatbot .chatbot-grid::before,
  .support-page .chatbot .chatbot-grid::after {
    display: none !important;
  }
}


/* Chatbot：PC版のみ写真に白フィルター相当の効果を追加
   既存のタブレット・スマホ表示は変更しません。 */
@media screen and (min-width: 901px) {
  .support-page .chatbot .chatbot-grid {
    background-color: #ffffff;
  }

  .support-page .chatbot .chatbot-img {
    opacity: 0.65 !important;
    mix-blend-mode: normal !important;
  }
}


/* =========================================================
   2026-11-04: 読みやすさ改善（サポートの流れ／強み／支援事例／効果）
   チャットボットには変更なし
   ========================================================= */
@media (min-width: 601px) {
  /* サポートの流れ：4列から2列へ。本文の横幅と文字サイズを確保 */
  .support-page .process-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 30px 24px;
    padding-top: 12px;
  }
  .support-page .process-line { display: none; }
  .support-page .process-grid > div {
    min-width: 0;
    padding: 20px 28px 24px;
    border: 1px solid #d7e1ed;
    border-radius: 6px;
  }
  .support-page .process-grid h3:after { display: none; }
  .support-page .process-grid h3 { margin-bottom: 12px; padding: 0; }
  .support-page .process-grid img { margin: 12px auto 16px; }
  .support-page .process-grid p {
    font-size: 15px;
    line-height: 1.9;
    font-weight: 600;
    word-break: normal;
    overflow-wrap: anywhere;
  }
  /* 私たちの強み：4列のまま本文を拡大 */
  .support-page .strength-grid > article { min-width: 0; padding-inline: 20px; }
  .support-page .strength-grid > article h3 { font-size: 17px; line-height: 1.55; }
  .support-page .strength-grid > article li { font-size: 13px; line-height: 1.9; }
  /* 支援事例 */
  .support-page .case-grid article { min-width: 0; }
  .support-page .case-grid h3 { font-size: 16px; line-height: 1.65; }
  .support-page .case-grid p { font-size: 13px; line-height: 1.85; }
  /* サポート効果 */
  .support-page .outcome-grid article { min-width: 0; padding-inline: 22px; }
  .support-page .outcome-grid h3 { font-size: 17px; line-height: 1.65; }
  .support-page .outcome-grid p { font-size: 13px; line-height: 1.9; }
}
@media (min-width: 601px) and (max-width: 900px) {
  .support-page .process-grid > div { padding: 18px 20px 22px; }
  .support-page .process-grid p { font-size: 14px; }
  .support-page .strength-grid > article { padding-inline: 16px; }
  .support-page .strength-grid > article h3 { font-size: 16px; }
  .support-page .strength-grid > article li { font-size: 13px; }
  .support-page .case-grid h3 { font-size: 15px; }
  .support-page .case-grid p { font-size: 12px; }
  .support-page .outcome-grid h3 { font-size: 16px; }
  .support-page .outcome-grid p { font-size: 12px; }
}
@media (max-width: 600px) {
  .support-page .process-grid p { font-size: 14px; line-height: 1.85; }
  .support-page .strength-grid > article li { font-size: 13px; line-height: 1.85; }
  .support-page .case-grid h3 { font-size: 16px; line-height: 1.6; }
  .support-page .case-grid p { font-size: 13px; line-height: 1.85; }
  .support-page .outcome-grid h3 { font-size: 17px; line-height: 1.6; }
  .support-page .outcome-grid p { font-size: 13px; line-height: 1.85; }
}


/* 私たちの強み：箇条書き・ぶら下がりインデント */
.support-page .strength-grid ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
.support-page .strength-grid li {
  display: block;
  position: relative;
  padding-left: 1.15em !important;
  margin: 0 0 9px !important;
  text-indent: 0 !important;
  font-size: 12px !important;
  line-height: 1.8 !important;
  font-weight: 600;
  overflow-wrap: anywhere;
}
.support-page .strength-grid li::before {
  content: "・";
  position: absolute;
  left: 0;
  top: 0;
}
@media (min-width: 601px) and (max-width: 900px) {
  .support-page .strength-grid li { font-size: 11.5px !important; }
}
@media (max-width: 600px) {
  .support-page .strength-grid li { font-size: 11px !important; line-height: 1.75 !important; }
}


/* iPad / tablet: 2列レイアウトに合わせて区切り線を再配置 */
@media screen and (min-width: 601px) and (max-width: 1100px) {
  .support-page .strength-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .support-page .strength-grid > article {
    border: 0 !important;
    margin-bottom: 0;
  }
  .support-page .strength-grid > article:nth-child(odd) {
    border-right: 1px solid #617393 !important;
  }
  .support-page .info-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .support-page .info-grid > div {
    border: 0 !important;
  }
  .support-page .info-grid > div:nth-child(odd) {
    border-right: 1px dotted #7290b6 !important;
  }
}


/* 2026-11-04 iPad: 2×2 grid dividers aligned to true midpoint */
@media screen and (min-width: 601px) and (max-width: 1100px) {
  .support-page .info-grid,
  .support-page .strength-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    column-gap: 0 !important;
    row-gap: 0 !important;
    width: 100%;
    box-sizing: border-box;
  }
  .support-page .info-grid > div,
  .support-page .strength-grid > article {
    min-width: 0;
    box-sizing: border-box;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0;
  }
  .support-page .info-grid > div:nth-child(odd) {
    border-right: 1px dotted #7290b6 !important;
  }
  .support-page .info-grid > div:nth-child(-n+2) {
    border-bottom: 1px dotted #7290b6 !important;
  }
  .support-page .strength-grid > article:nth-child(odd) {
    border-right: 1px solid #617393 !important;
  }
  .support-page .strength-grid > article:nth-child(-n+2) {
    border-bottom: 1px solid #617393 !important;
  }
  .support-page .strength-grid > article {
    padding: 24px clamp(16px, 3vw, 30px) 28px !important;
  }
  .support-page .info-grid > div {
    padding: 18px clamp(12px, 2.5vw, 24px) !important;
  }
}