:root{
    /* 配色：メインアクセント #0c1b31 ／ サブ・引き締め #80b4c3 ／
       テキスト #222222 ／ ベース #FFFFFF ／ サブ背景 #f3f3ec */
    --base:#FFFFFF;
    --sub-bg:#f3f3ec;
    --accent:#0c1b31;
    --accent-dark:#1d3a5f;
    --blue:#80b4c3;
    --blue-pale:#dfe9ee;
    --gold:#9d942e;
    --gold-pale:#ebe9cf;
    --navy:#0c1b31;
    --ink:#222222;
    --ink-soft:#222222;
    --line:#e3e3da;
    --white:#FFFFFF;
    --serif:"Shippori Mincho","Noto Serif JP",serif;
    --sans:"Noto Sans JP",sans-serif;
    --din:"Shippori Mincho","Noto Serif JP",serif;
  }
  *{margin:0;padding:0;box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    font-family:var(--sans);
    color:var(--ink);
    background:var(--base);
    line-height:1.9;
    font-size:15px;
  }
  img{max-width:100%;display:block;}
  a{color:inherit;}
  .inner{max-width:1080px;margin:0 auto;padding:0 40px;}
  @media(max-width:768px){.inner{padding:0 20px;}}

  /* ===== ボタン ===== */
  .btn{
    display:inline-block;text-decoration:none;
    border-radius:999px;font-weight:700;letter-spacing:.08em;
    text-align:center;cursor:pointer;
    transition:background .2s, transform .15s, box-shadow .2s, color .2s;
  }
  .btn-primary{
    background:var(--accent);color:#fff;
    padding:16px 44px;font-size:15px;
    box-shadow:0 4px 14px rgba(12,27,49,.25);
  }
  .btn-primary:hover{background:var(--accent-dark);transform:translateY(-2px);}
  .btn-ghost{
    background:transparent;color:var(--ink);
    padding:15px 44px;font-size:15px;
    border:1px solid var(--ink);
  }
  .btn-ghost:hover{background:var(--ink);color:#fff;}

  /* ===== 固定サイドタブ ===== */
  .side-tab{
    position:fixed;top:50%;right:0;transform:translateY(-50%);
    writing-mode:vertical-rl;
    background:var(--accent);color:#fff;
    font-size:13px;font-weight:700;letter-spacing:.2em;
    padding:24px 12px;border-radius:6px 0 0 6px;
    text-decoration:none;z-index:200;
    box-shadow:-2px 2px 10px rgba(51,48,42,.15);
    transition:background .2s;
  }
  .side-tab:hover{background:var(--accent-dark);}

  /* ===== ヘッダー ===== */
  header{
    position:sticky;top:0;z-index:100;
    background:rgba(255,255,255,.92);
    backdrop-filter:blur(6px);
    border-bottom:1px solid var(--line);
  }
  .header-inner{
    max-width:1360px;margin:0 auto;
    display:flex;align-items:center;justify-content:space-between;
    padding:0 24px;height:64px;
  }
  .logo{
    font-family:var(--serif);
    font-size:20px;font-weight:700;
    text-decoration:none;display:flex;align-items:center;gap:8px;
    flex:none;
  }
    .gnav{display:flex;align-items:center;gap:26px;}
  .gnav a{
    font-size:13px;text-decoration:none;letter-spacing:.04em;
    transition:color .2s;
  }
  .gnav a:not(.btn):hover{color:var(--accent-dark);}
  .gnav .btn-primary:hover{color:#fff;}
  .gnav .btn-primary{padding:10px 22px;font-size:13px;box-shadow:none;}
  @media(max-width:960px){.gnav a:not(.btn){display:none;}}

  /* ===== ヒーロー ===== */
  .hero{
    position:relative;
    overflow:hidden;
    /* 1行目のグラデーションは文字を読みやすくするための被せです */
    background:
      linear-gradient(90deg, var(--base) 0%, var(--base) 36%, rgba(255,255,255,.65) 52%, rgba(255,255,255,0) 70%),
      url('../images/hero.jpg') var(--base);
    background-size:auto, auto 120%;
    background-position:center, right center;
    background-repeat:no-repeat, no-repeat;
  }
  .hero-grid{
    max-width:1360px;margin:0 auto;
    padding:72px 24px 150px 64px;
    min-height:520px;
    display:flex;align-items:center;
  }
  .hero-content{max-width:820px;}
  .hero h1{
    /* 上2行はゴシック太字（カンプ準拠） */
    font-family:var(--sans);
    font-weight:700;letter-spacing:.06em;
    line-height:1.75;
    font-size:clamp(24px,2.8vw,36px);
    color:var(--navy);
    margin-bottom:28px;
  }
  .hero h1 .big{
    display:block;
    font-family:var(--serif);
    font-weight:700;
    font-size:min(6.2vw,72px);
    line-height:1.25;
    margin-top:20px;
    white-space:nowrap;
    letter-spacing:-0.05em;
    font-style:italic; /* タイトル全体を斜体に */
  }
  .hero h1 .big .c1{
    font-size:1.55em;
    line-height:1;
    color:var(--accent); /* #0c1b31 */
  }
  .hero h1 .en{
    font-family:Georgia,"Times New Roman",serif;
    font-style:italic;
    font-size:1.6em;
    line-height:1;
    color:var(--blue); /* #80b4c3 */
    padding:0 8px 0 4px;
  }
  .hero h1 .big .tail{font-size:.82em;}
  .hero-lead{
    font-size:16px;color:var(--ink-soft);
    margin-bottom:32px;max-width:750px;
  }
  .hero-btns{display:flex;flex-wrap:wrap;gap:14px;}
  /* ===== SPヒーロー（hero-sp.jpg・カンプ準拠） ===== */
  .br-sp{display:none;}
  .br-pc{display:inline;}
  @media(max-width:860px){
    .br-sp{display:inline;}
    .hero{
      background:
        linear-gradient(180deg,
          rgba(255,255,255,0) 0%,
          rgba(255,255,255,0) 66%,
          rgba(255,255,255,.9) 90%,
          #ffffff 100%),
        url('../images/hero-sp.jpg') var(--base);
      /* グラデーションは写真の高さ（105vw）にだけ掛ける */
      background-size:100% 105vw, 100% auto;
      background-position:top center, top center;
      background-repeat:no-repeat, no-repeat;
    }
    .hero-grid{padding:13vw 20px 40px;min-height:0;align-items:flex-start;}
    /* 上3行：人物に被らないよう小さめ */
    .hero h1{
      font-size:4.6vw;
      line-height:1.8;
      letter-spacing:.05em;
      margin-bottom:0;
    }
    /* 辞めない／AI人材チームを。の2行 */
    .hero h1 .big{
      white-space:normal;
      font-size:9.5vw;
      line-height:1.3;
      margin-top:21vw;
      letter-spacing:-0.03em;
    }
    .hero-lead{margin-top:7vw;font-size:14px;}
  }

  /* ===== 特徴アイコンバー ===== */
  .features{
    background:#f9f9f5;
    padding:0 24px 72px;
  }
  .features-grid{
    max-width:1120px;margin:0 auto;
    position:relative;z-index:2;
    margin-top:-80px; /* ヒーロー写真に重ねる */
    display:grid;grid-template-columns:repeat(4,1fr);gap:16px;
  }
  @media(max-width:960px){.features-grid{grid-template-columns:repeat(2,1fr);gap:12px;}}
  .feature-card{
    background:#eaead4;
    border-radius:8px;
    padding:32px 20px 26px;
    text-align:center;
  }
  .feature-card .icon{
    width:112px;height:112px;margin:0 auto 18px;
    background:var(--white);border-radius:50%;
    display:flex;align-items:center;justify-content:center;
  }
  .feature-card .icon img{height:77px;width:auto;}

  .feature-card h3{
    font-size:20px;font-weight:700;letter-spacing:.04em;
    margin-bottom:8px;line-height:1.5;
  }
  .feature-card p{font-size:16px;color:var(--ink-soft);line-height:1.7;}
  @media(max-width:560px){
    .feature-card{padding:22px 14px 20px;}
    .feature-card h3{font-size:18px;}
    .feature-card p{font-size:13px;}
    /* スマホはPCと同じくらいの見え方になるよう縮小 */
    .feature-card .icon{width:80px;height:80px;margin-bottom:12px;}
    .feature-card .icon img{height:46px;}
  }


  /* ===== セクション共通 ===== */
  section{position:relative;}
  .sec-title{
    font-family:var(--serif);
    font-size:clamp(28px,4.2vw,45px);
    font-weight:700;letter-spacing:.08em;
    text-align:center;line-height:1.6;
    margin-bottom:40px;
  }
  .sec-lead{
    text-align:center;font-size:16px;color:var(--ink-soft);
    margin-bottom:48px;
  }
  .watermark{
    display:block;
    text-align:center;
    font-family:var(--din);font-weight:900;
    font-size:clamp(44px,8vw,100px);letter-spacing:.12em;
    color:var(--sub-bg);
    user-select:none;pointer-events:none;
    line-height:1;z-index:0;
    white-space:nowrap;
    overflow:hidden;
    margin-bottom:12px;
  }

  .watermark-v{
    position:absolute;left:-7px;top:48px;
    font-family:var(--din);font-weight:900;
    font-size:clamp(44px,8vw,100px);letter-spacing:.14em;
    writing-mode:vertical-rl;
    line-height:1;user-select:none;pointer-events:none;z-index:0;
  }
  .solution .watermark-v{color:var(--white);}
  .price .watermark-v{color:var(--white);}

  /* ===== お悩みセクション ===== */
  .problem{
    background:var(--white);
    padding:72px 0 96px;
    overflow:hidden;
  }
  @media (max-width: 860px) {
      .problem {
          padding:40px 0 96px;
      }
  }

  .problem-grid{
    display:grid;grid-template-columns:1.1fr 1fr;gap:0 56px;
    grid-template-areas:
      "list diagram"
      "list msg";
    grid-template-rows:auto 1fr;
    align-items:start;position:relative;z-index:1;
    margin-top:8px;
    padding: 40px 0 0;
  }
  .problem-list{grid-area:list;}
  .problem-right{grid-area:diagram;align-self:center;}
  .problem-msg{grid-area:msg;}
  /* SP：画像 → お悩みリスト → メッセージの順に並べ替え */
  @media(max-width:900px){
    .problem-grid{
      grid-template-columns:1fr;
      grid-template-areas:
        "list"
        "diagram"
        "msg";
      grid-template-rows:auto;
      gap:0;
      padding: 0;
    }
    .problem-right{margin-top:28px;}
  }
  .problem-list{list-style:none;}
  .problem-list li{
    border-bottom:1px solid var(--line);
    padding:18px 10px;
  }
  .problem-list .num{
    display:block;
    /*font-family:var(--serif);*/
    font-size:20px;
    /*font-weight:600;*/
    color:var(--gold);letter-spacing:.15em;
    margin-bottom:4px;
  }
  .problem-list .num .maru{font-size:23px;letter-spacing:0;}
  .problem-list .txt{
    font-family:var(--serif);
    font-size:22px;
    /*font-weight:600;*/
    letter-spacing:.05em;
    line-height: 1.3;
  }
  .problem-diagram{
    max-width:480px;margin:0 auto;width:100%;height:auto;
  }
  .problem-msg{
    position:relative;z-index:1;
    text-align:center;margin-top:36px;
  }
  .problem-msg .strong{
    font-family:var(--serif);
    font-size:clamp(16px,1.6vw,20px);font-weight:700;
    letter-spacing:.06em;line-height:2;
  }
  .problem-msg .note{
    display:inline-block;
    margin-top:20px;
    background:var(--sub-bg);
    padding:14px 32px;
    font-size:16px;font-weight:500;
    line-height:2;
    color:var(--gold);
  }

  /* ===== ソリューションセクション ===== */
  .solution{
    background:var(--sub-bg);
    padding:72px 0 96px;
    overflow:hidden;
  }
  .solution .support-card{border:none;}
  .sec-label{
    display:block;width:fit-content;margin:0 auto 30px;
    color:var(--gold);
    font-size:16px;font-weight:700;letter-spacing:.15em;
    position:relative;z-index:1;
    border: 1px solid #9d942e;
    padding: 10px 20px;
    background: #fff;
  }
  /* 上のセクションから差し込む▽ */
  .solution::before{
    content:"";position:absolute;top:0;left:50%;
    transform:translateX(-50%);
    border-left:40px solid transparent;
    border-right:40px solid transparent;
    border-top:30px solid var(--white);
    z-index:1;
  }
  .solution-copy{
    font-family:var(--serif);
    font-size:clamp(20px,2.6vw,28px);font-weight:500;
    letter-spacing:.08em;line-height:1.5;
    text-align:center;margin-bottom:15px;
    position:relative;z-index:1;
  }
  .support-title{
    font-family:var(--serif);
    font-size:clamp(28px,4.2vw,45px);font-weight:700;
    letter-spacing:.1em;text-align:center;
    width:fit-content;margin:0 auto 30px;padding:0 14px;
    background:linear-gradient(transparent 67%, #dcdbc9 62%);
    position:relative;z-index:1;
  }
  .support-lead{
    font-size:16px;color:var(--ink-soft);
    max-width:780px;margin:0 auto 52px;
    position:relative;z-index:1;
  }
  .support-grid{
    display:grid;grid-template-columns:1fr 1fr;gap:20px;
    position:relative;z-index:1;
  }
  @media(max-width:768px){.support-grid{grid-template-columns:1fr;}}
  .support-card{
    background:var(--white);
    border:1px solid var(--line);
    border-radius:8px;
    padding:30px 28px 26px;
    display:flex;gap:20px;
  }
  .support-card .num{
    font-family:var(--serif);
    font-size:44px;font-weight:700;line-height:1;
    color:var(--blue);flex:none;
  }
  .support-card h3{
    font-family:var(--serif);
    font-size:22px;font-weight:800;letter-spacing:.04em;
    margin-bottom:8px;
  }
  .support-card p{font-size:16px;color:var(--ink-soft);}

  /* ===== AI人材チーム（SOLUTION内・白パネル） ===== */
  .team-panel{
    background:var(--white);
    border-radius:6px;
    margin-top:80px;
    padding:72px 48px 80px;
    position:relative;z-index:1;
  }
  @media(max-width:768px){
    .team-panel{margin-top:56px;padding:35px 20px 60px;}
  }
  .team-grid{
    display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:36px 24px;
    margin-bottom:36px;
  }
  /* 下段：同じ4列グリッドにカード3枚を配置（4列目は空＝白背景） */
  .team-grid.sub{grid-template-columns:repeat(4,minmax(0,1fr));margin:0 0 56px;}
  @media(max-width:960px){
    .team-grid{grid-template-columns:repeat(2,1fr);}
    .team-grid.sub{grid-template-columns:repeat(2,1fr);}
  }
  @media(max-width:560px){
    .team-grid,.team-grid.sub{grid-template-columns:1fr;width:85%;margin:0 auto 36px;}
    .team-grid.sub{margin-bottom:56px;}
  }
  .team-card{
    min-width:0; /* グリッドからはみ出さないように */
    background:var(--white);
    border:1px solid var(--gold); /* #9d942e */
    border-radius:10px;
    padding:10px 16px 30px;
    text-align:center;
  }
  .team-card .icon{
    height:170px;margin:0 auto 22px;
    display:flex;align-items:center;justify-content:center;
  }
  .team-card .icon img{max-height:170px;max-width:100%;object-fit:contain;}
  .team-card h3{
    font-size:15px;font-weight:700;letter-spacing:.04em;
    margin-bottom:6px;
  }
  .team-card .tag{
    display:inline-flex;align-items:center;justify-content:center;
    width:100%;height:37px;
    background:var(--gold);color:#fff; /* #9d942e */
    font-size:16px;font-weight:500;letter-spacing:.05em;
    border-radius:0;
    margin-bottom:22px;
  }
  .team-card p{font-size:16px;color:#222222;line-height:2;text-align:left;}
  .movie-en{
    font-family:var(--din);font-weight:900;letter-spacing:.14em;
    font-size:clamp(30px,4.4vw,40px);font-weight:700;
    letter-spacing:.18em;text-align:center;
    line-height:1.2;margin-top:56px;
  }
  .movie-wrap{
    max-width:760px;margin:0 auto;
    aspect-ratio:16/9;
  }
  .movie-wrap iframe{width:100%;height:100%;display:block;}
  .movie-title{
    font-family:var(--serif);
    font-size:clamp(16px,2vw,20px);font-weight:600;
    letter-spacing:.12em;text-align:center;
    margin-bottom:28px;color:var(--ink-soft);
  }

  /* ===== 導入の流れ ===== */
  .flow{
    background:var(--white);
    padding:118px 0 96px;
  }

  @media(max-width:860px){
    .flow{
      padding:76px 0 0;
    }
  }
  /* SOLUTIONセクションが下へはみ出す▼ */
  .flow::before{
    content:"";position:absolute;top:0;left:50%;
    transform:translateX(-50%);
    border-left:40px solid transparent;
    border-right:40px solid transparent;
    border-top:30px solid var(--sub-bg);
    z-index:1;
  }
  .flow-list{
    max-width:720px;margin:0 auto;
    position:relative;
  }
  .flow-item{
    display:flex;gap:56px;
    position:relative;
    padding-bottom:25px;
  }
  .flow-item:last-child{padding-bottom:12px;}
  /* 点線 */
  .flow-item::before{
    content:"";position:absolute;
    left:119px;top:42px;bottom:-39px;
    border-left:2px dotted #cfcfcf;
  }
  .flow-item:last-child::before{bottom:14px;} /* 最後は点線を短く */
  /* 点線上の青丸 */
  .flow-item::after{
    content:"";position:absolute;
    left:108px;top:36px;
    width:24px;height:24px;border-radius:50%;
    background:var(--blue);
  }
  .flow-step{
    flex:none;
    width:96px;height:96px;border-radius:50%;
    background:var(--blue-pale);
    display:flex;flex-direction:column;align-items:center;justify-content:center;
    color:var(--accent);
    line-height:1.3;
  }
  .flow-step .s{font-size:12px;letter-spacing:.3em;text-indent:.3em;font-weight:500;}
  .flow-step .n{font-size:26px;font-weight:700;}
  /* 見出しをSTEP円の垂直中央に揃える */
  .flow-body{padding-top:32px;}
  .flow-body h3{
    font-size:22px;font-weight:700;letter-spacing:.08em;
    margin-bottom:6px;
  }
  .flow-body p{font-size:16px;color:var(--ink-soft);letter-spacing:.06em;}

  /* ===== 導入事例 ===== */
  .cases{
    background:var(--base);
    padding:88px 0 96px;
  }
  .cases-grid{
    display:grid;grid-template-columns:repeat(3,1fr);gap:40px;
  }
  @media(max-width:860px){.cases-grid{grid-template-columns:1fr;max-width:480px;margin:0 auto;}}
  .case-card{
    background:var(--white);
    padding:16px 20px;
    text-align:center;
  }
  .case-card .illust{
    width:220px;height:220px;margin:0 auto 28px;
    background:var(--white);
    border:14px solid var(--gold-pale);
    border-radius:50%;
    display:flex;align-items:center;justify-content:center;
  }
  @media(max-width:1080px){.case-card .illust{width:200px;height:200px;}}
  .case-card .illust img{max-width:68%;max-height:74%;object-fit:contain;}
  .case-card h3{
    font-size:23px;font-weight:600;letter-spacing:.06em;
    line-height:1.5;
    margin-bottom:16px;
  }
  .case-card p{font-size:16px;color:var(--ink-soft);line-height:1.9;}
  .cases-note{
    text-align:center;font-size:16px;color:var(--ink-soft);
    margin-top:28px;
  }

  /* ===== 料金プラン ===== */
  .price{
    background:var(--sub-bg);
    padding:72px 0 96px;
    overflow:hidden;
  }
  /* 上のセクション（白）から差し込む▽ */
  .price::before{
    content:"";position:absolute;top:0;left:50%;
    transform:translateX(-50%);
    border-left:40px solid transparent;
    border-right:40px solid transparent;
    border-top:30px solid var(--white);
    z-index:1;
  }
  .price-lead-copy{
    font-family:var(--serif);
    font-size:clamp(18px,2.2vw,22px);font-weight:600;
    letter-spacing:.06em;text-align:center;
    margin-bottom:14px;position:relative;z-index:1;
  }
  .price-lead-sub{
    text-align:center;font-size:16px;color:var(--ink-soft);
    max-width:680px;margin:0 auto 56px;
    position:relative;z-index:1;
  }
  .price-pack{
    position:relative;z-index:1;
    max-width:760px;margin:0 auto 56px;
    background:var(--white);
    border:2px solid var(--accent);
    border-radius:8px;
    padding:44px 40px 32px;
    text-align:center;
  }
  .price-pack .pack-label{
    position:absolute;top:-17px;left:50%;transform:translateX(-50%);
    background:var(--accent);color:#fff;
    font-size:14px;font-weight:700;letter-spacing:.1em;
    padding:7px 26px;white-space:nowrap;
  }
  .price-pack h3{
    font-family:var(--serif);
    font-size:24px;font-weight:700;letter-spacing:.08em;
    margin-bottom:8px;
  }
  .price-pack .amount{
    font-family:var(--serif);
    font-size:47px;font-weight:700;color:var(--accent-dark);
    line-height:1.3;
  }
  .price-pack .amount small{font-size:18px;color:var(--accent-dark);font-family:var(--serif);font-weight:600;}
  .price-pack .pack-copy{
    font-family:var(--serif);
    font-size:clamp(16px,2vw,19px);font-weight:600;
    letter-spacing:.04em;margin-top:22px;
  }
  .price-pack .pack-sub{
    font-size:16px;color:var(--ink-soft);
    letter-spacing:.06em;margin-top:16px;
  }
  .price-pack .pack-limited{
    display:inline-block;
    background:var(--gold-pale);color:#7d741f;
    font-size:14px;font-weight:700;letter-spacing:.1em;
    padding:6px 20px;border-radius:2px;
    margin:14px 0 2px;
  }
  .price-pack ul{
    list-style:none;
    display:flex;flex-wrap:wrap;justify-content:center;gap:8px 20px;
    margin-top:12px;font-size:16px;color:var(--ink-soft);
  }
  .price-pack li::before{content:"・";color:var(--accent-dark);}
  .plan-title{
    font-family:var(--serif);
    font-size:22px;font-weight:700;letter-spacing:.1em;
    text-align:center;margin-bottom:36px;
    position:relative;z-index:1;
  }
  .plan-grid{
    display:grid;grid-template-columns:repeat(3,1fr);gap:20px;
    position:relative;z-index:1;
  }
  @media(max-width:860px){.plan-grid{grid-template-columns:1fr;max-width:440px;margin:0 auto;}}
  .plan-card{
    background:var(--white);
    border:1px solid var(--line);
    border-radius:8px;
    padding:32px 24px 30px;
    text-align:center;
    display:flex;flex-direction:column;
  }
  .plan-card.recommended{
    border:2px solid var(--accent);
    position:relative;
  }
  .plan-card.recommended::before{
    content:"人気";
    position:absolute;top:-12px;left:50%;transform:translateX(-50%);
    background:var(--accent);color:#fff;
    font-size:12px;font-weight:700;letter-spacing:.1em;
    padding:3px 18px;border-radius:999px;
  }
  .plan-card h4{
    font-family:var(--serif);
    font-size:18px;font-weight:600;letter-spacing:.06em;
    margin-bottom:14px;
  }
  .plan-card .amount{
    font-family:var(--serif);
    font-size:30px;font-weight:700;color:var(--accent-dark);
    line-height:1.3;margin-bottom:4px;
  }
  .plan-card .amount small{font-size:14px;font-family:var(--serif);font-weight:600;}
  .plan-card .for{
    font-size:16px;font-weight:500;margin-bottom:10px;
  }
  .plan-card .hours{
    font-size:14px;color:var(--ink-soft);
    background:#dfe9ee;border-radius:999px;
    padding:5px 14px;width:fit-content;margin:0 auto;
  }
  .price-note{
    position:relative;z-index:1;
    text-align:center;font-size:16px;color:var(--ink-soft);
    margin-top:36px;max-width:680px;
    margin-left:auto;margin-right:auto;
  }

  /* ===== よくあるご質問 ===== */
  .faq{
    background:var(--base);
    padding:100px 0 96px;
  }
  /* PLANセクションが下へはみ出す▼ */
  .faq::before{
    content:"";position:absolute;top:0;left:50%;
    transform:translateX(-50%);
    border-left:40px solid transparent;
    border-right:40px solid transparent;
    border-top:30px solid var(--sub-bg);
    z-index:1;
  }
  .faq-list{max-width:760px;margin:0 auto;}
  /* ITOKI参考：枠カードをやめ、罫線区切りリスト＋Q番号のアコーディオン */
  .faq-list{counter-reset:faq;}
  .faq-item{
    background:transparent;
    border:none;
    border-bottom:1px solid var(--line);
    border-radius:0;
    margin-bottom:0;
    overflow:hidden;
    counter-increment:faq;
  }
  .faq-item:first-child{border-top:1px solid var(--line);}
  .faq-item summary{
    list-style:none;cursor:pointer;
    -webkit-tap-highlight-color:transparent; /* スマホタップ時の水色ハイライトを無効化 */
    display:flex;align-items:baseline;gap:18px;
    padding:28px 44px 28px 6px;
    font-size:17px;letter-spacing:.04em;
    line-height:1.7;
    position:relative;
    transition:color .2s;
  }
  .faq-item summary::-webkit-details-marker{display:none;}
  .faq-item summary:hover{color:var(--accent-dark);}
  .faq-item summary .q{
    flex:none;
    font-family:var(--serif);font-size:22px;font-weight:700;
    color:var(--gold);
    letter-spacing:.02em;
  }
  .faq-item summary .q::after{content:counter(faq) ".";}
  .faq-item summary .plus{
    position:absolute;right:8px;top:50%;
    margin-top:-11px;flex:none;
    width:22px;height:22px;
  }
  .faq-item summary .plus::before,
  .faq-item summary .plus::after{
    content:"";position:absolute;background:var(--gold);
    top:50%;left:50%;transform:translate(-50%,-50%);
  }
  .faq-item summary .plus::before{width:16px;height:2px;}
  .faq-item summary .plus::after{width:2px;height:16px;transition:transform .2s;}
  .faq-item[open] summary .plus::after{transform:translate(-50%,-50%) rotate(90deg);}
  .faq-answer{
    display:flex;gap:18px;align-items:baseline;
    padding:0 44px 30px 6px;
    font-size:16px;color:var(--ink-soft);
    line-height:1.9;
  }
  .faq-answer .a{
    flex:none;
    font-family:var(--serif);font-size:22px;font-weight:700;
    color:var(--accent-dark);
  }
  .faq-answer .a::after{content:".";}
  @media(max-width:560px){
    .faq-item summary{padding:22px 36px 22px 2px;font-size:16px;gap:12px;}
    .faq-answer{padding:0 10px 24px 2px;gap:12px;}
  }

  /* ===== フッターCTA ===== */
  .footer-cta{
    background:var(--navy);color:#fff;
    padding:88px 0 72px;
    text-align:center;
  }
  .footer-cta h2{
    font-family:var(--serif);
    font-size:clamp(28px,4.2vw,40px);font-weight:700;
    letter-spacing:.1em;margin-bottom:24px;
  }
  .footer-cta p{
    font-size:16px;color:rgba(255,255,255,.75);
    margin-bottom:36px;line-height:2.2;
  }
  .footer-cta .hero-btns{justify-content:center;margin-bottom:52px;}
  /* フッターの2連ボタン */
  .footer-btns{
    display:flex;justify-content:center;gap:24px;
    margin-bottom:52px;flex-wrap:wrap;
  }
  .f-btn{
    display:flex;align-items:center;justify-content:center;
    width:340px;max-width:100%;
    padding:26px 20px;
    font-size:17px;font-weight:700;letter-spacing:.1em;
    text-decoration:none;border-radius:4px;
    transition:opacity .2s, transform .15s;
  }
  .f-btn:hover{opacity:.85;transform:translateY(-2px);}
  .f-btn-gold{background:#9d942e;color:#fff;}
  .f-btn-white{background:#fff;color:var(--navy);}
  .footer-cta .btn-ghost{
    color:#fff;border-color:rgba(255,255,255,.6);
  }
  .footer-cta .btn-ghost:hover{background:#fff;color:var(--navy);}
  .trust{
    display:flex;justify-content:center;flex-wrap:wrap;gap:14px 44px;
  }
  .trust span{
    font-size:14px;color:rgba(255,255,255,.8);
    display:flex;align-items:center;gap:8px;
  }
  .trust svg{flex:none;}

  /* ===== フッター ===== */
  footer{
    background:var(--navy);color:#fff;
    border-top:1px solid rgba(255,255,255,.12);
    text-align:center;padding:32px 24px;
  }
  footer .f-logo{
    font-family:var(--serif);font-size:18px;font-weight:700;
    letter-spacing:.1em;margin-bottom:8px;
  }
  footer .f-links{
    display:flex;justify-content:center;gap:24px;
    font-size:13px;margin-bottom:14px;
  }
  footer .f-links a{color:rgba(255,255,255,.7);text-decoration:none;}
  footer .f-links a:hover{color:#fff;}
  footer small{font-size:12px;color:rgba(255,255,255,.5);}


  /* ===== SP全体調整（表示崩れ対策） ===== */
  @media(max-width:860px){
    /* 英語ウォーターマークはSPでは非表示 */
    .watermark,.watermark-v{display:none;}

    .features-grid{margin-top:-45px;}

    /* 本文16pxはSPでは15pxに */
    .sec-lead,.support-lead,.support-card p,.team-card p,.case-card p,
    .price-lead-sub,.price-note,.cases-note,.problem-msg .note,
    .price-pack .pack-sub,.price-pack ul,.plan-card .for,
    .faq-item summary,.faq-answer,.footer-cta p{font-size:15px;}

    /* AI人材チームの見出し：改行なし・左寄せ */
    .br-pc{display:none;}
    .team-panel .sec-title{text-align:left;}

    /* センター寄せの説明文は左寄せに（読みやすさ・崩れ防止） */
    .sec-lead,
    .support-lead,
    .problem-msg,
    .problem-msg .note,
    .price-lead-sub,
    .price-note,
    .cases-note,
    .team-card p,
    .case-card p,
    .footer-cta p{
      text-align:left;
    }
    .problem-msg .strong{display:block;text-align:center;} /* ここだけセンター */
    .problem-msg .note br,
    .footer-cta p br{display:none;} /* 固定改行を解除して自然に折り返す */
    .problem-msg .note{padding:14px 18px;display:block;}

    /* お悩みリスト：2カラム・文字は控えめに */
    .problem-list{
      display:grid;grid-template-columns:1fr 1fr;gap:0 18px;margin: 0 0 30px;
    }
    .problem-list li{padding:16px 2px;}
    .problem-list .num{font-size:14px;margin-bottom:6px;}
    .problem-list .num .maru{font-size:20px;}
    .problem-list .txt{font-size:18px;line-height:1.7;display:block;}

    /* 見出し：長文が崩れないようサイズと余白を調整 */
    .sec-title{font-size:30px;margin-bottom:44px;line-height:1.7;letter-spacing:.06em;}
    .sec-lead{margin-bottom:32px;}
    .support-title{font-size:30px;line-height: 1.2;padding: 0 0 15px;}
    .solution-copy{margin-bottom:16px;font-size: 19px;}
    .plan-title{font-size:24px;}
    .movie-en{font-size:28px;margin-top:44px;}
    .footer-cta h2{font-size:26px;}

    /* セクション余白の詰め */
    .team-panel .sec-title{margin-bottom:36px;}

    /* 導入の流れ：円と点線の位置を再調整（本文と重ならないように） */
    .flow-item{gap:28px;}
    .flow-step{width:72px;height:72px;margin:0 10px 0 0;}
    .flow-step .s{font-size:10px;}
    .flow-step .n{font-size:20px;}
    .flow-item::before{left:85px;top:32px;}
    .flow-item::after{left:76px;top:26px;width:20px;height:20px;}
    .flow-body{padding:22px 0 0 0;min-width:0;}
    .flow-body h3{font-size:19px;}
    .flow-body p{font-size:15px;}

    /* 料金 */
    .price-pack{padding:30px 20px 32px;}
    .price-pack ul{flex-direction:column;gap:6px;align-items:flex-start;text-align:left;max-width:fit-content;margin-left:auto;margin-right:auto;}

    /* 導入事例 */
    .case-card .illust{width:190px;height:190px;border-width:12px;}
    .case-card h3{font-size:21px;}
  }


  /* ▼ スクロールアニメーション（不要になったらこのブロックと、ページ末尾のアニメーションscriptを削除） */
  .js-fade{
    opacity:0;
    transform:translateY(30px);
    transition:opacity .9s ease, transform .9s cubic-bezier(.22,.65,.3,1);
    transition-delay:var(--fd,0s);
    will-change:opacity,transform;
  }
  .js-fade.is-view{opacity:1;transform:none;}
  @media (prefers-reduced-motion: reduce){
    .js-fade{opacity:1;transform:none;transition:none;}
  }
  /* ▲ スクロールアニメーションここまで */

  @media (prefers-reduced-motion: reduce){
    *{transition:none !important;}
    html{scroll-behavior:auto;}
  }
