:root{
      --navy:#0b2f4f;
      --ink:#111827;
      --muted:#64748b;
      --line:#e5e7eb;
      --soft:#f8fafc;
      --bg:#ffffff;
      --dark:#0f172a;
      --radius:22px;
      --shadow:0 18px 50px rgba(15,23,42,.08);
    }

    *{box-sizing:border-box}

    html{
      scroll-behavior:smooth;
      -webkit-text-size-adjust:100%;
    }

    body{
      margin:0;
      color:var(--ink);
      background:linear-gradient(180deg,#f8fafc 0%,#fff 24%,#fff 100%);
      font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue","Hiragino Sans","Yu Gothic UI","Yu Gothic",Meiryo,sans-serif;
      font-weight:400;
      line-height:1.75;
      letter-spacing:.02em;
    }

    a{
      color:inherit;
      text-decoration:none;
    }

    .wrap{
      width:min(1120px,100%);
      margin:0 auto;
      padding:0 18px;
    }

    /* =========================
       TOP BAR 高級版
    ========================= */

    .topbar{
      border-bottom:1px solid #e5e7eb;
      background:#f8fafc;
    }

    .topbar-inner{
      display:flex;
      justify-content:center;
      align-items:center;
      gap:14px;
      padding:12px 20px;
      font-size:12px;
      color:#475569;
      flex-wrap:wrap;
    }

    .topbar-inner::-webkit-scrollbar{
      display:none;
    }

    .pill{
      display:inline-flex;
      align-items:center;
      gap:6px;
      padding:6px 14px;
      border:1px solid #dbe2ea;
      border-radius:999px;
      background:#ffffff;
      box-shadow:0 1px 2px rgba(15,23,42,.03);
      font-weight:500;
    }

    .pill b{
      font-weight:600;
      color:#0f172a;
    }

    /* =========================
       HEADER 高級版
    ========================= */

    header{
      position:sticky;
      top:0;
      z-index:20;
      border-bottom:1px solid #e5e7eb;
      background:rgba(255,255,255,.95);
      backdrop-filter:blur(18px);
      box-shadow:0 2px 10px rgba(15,23,42,.03);
    }

    .header-inner{
      min-height:78px;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:32px;
    }

    .brand{
      display:flex;
      align-items:center;
      gap:14px;
      min-width:0;
      flex-shrink:0;
    }

.brand-mark{
  width:64px;
  height:64px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  overflow:hidden;

  background:#ffffff;
  border-radius:50%;
}

.brand-mark img{
  width:64px;
  height:64px;
  display:block;
  object-fit:cover;
  object-position:center center;
  border-radius:50%;
}
    .brand-name{
      font-size:18px;
      font-weight:600;
      line-height:1.2;
      color:#0f172a;
      white-space:nowrap;
    }

    .brand-sub{
      font-size:12px;
      color:#94a3b8;
      margin-top:3px;
      line-height:1.2;
      white-space:nowrap;
    }

    nav{
      display:flex;
      align-items:center;
      gap:24px;
      font-size:14px;
      margin-left:auto;
    }

    nav a{
      color:#334155;
      font-weight:500;
      transition:.25s;
      white-space:nowrap;
    }

    nav a:hover{
      color:#0b2f4f;
      opacity:.82;
    }

    .header-cta{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      min-height:46px;
      padding:0 22px;
      border-radius:999px;
      background:#0f172a;
      color:#fff;
      font-size:14px;
      font-weight:600;
      box-shadow:0 8px 20px rgba(15,23,42,.12);
      transition:.25s;
      white-space:nowrap;
      flex-shrink:0;
    }

    .header-cta:hover{
      transform:translateY(-2px);
      box-shadow:0 12px 30px rgba(15,23,42,.18);
    }

    /* =========================
       HERO
    ========================= */

    .hero{
      position:relative;
      overflow:hidden;
      background:
        radial-gradient(circle at 16% 10%, rgba(11,47,79,.10), transparent 34%),
        linear-gradient(180deg,#f8fafc 0%,#fff 78%);
    }

    .hero-grid{
      display:grid;
      grid-template-columns:1.1fr .9fr;
      gap:42px;
      align-items:center;
      padding:64px 18px 56px;
    }

    .eyebrow{
      display:inline-flex;
      align-items:center;
      gap:8px;
      margin-bottom:16px;
      padding:6px 12px;
      border:1px solid #dbeafe;
      border-radius:999px;
      color:var(--navy);
      background:#eff6ff;
      font-size:12px;
      font-weight:500;
    }

.hero h1,
.hero h2{
  margin:0;
  color:#0f172a;
  font-size:clamp(38px,5.5vw,62px);
  line-height:1.12;
  letter-spacing:-.035em;
  font-weight:700;
}

    .hero-copy{
      margin:20px 0 0;
      color:#475569;
      font-size:clamp(15px,2vw,18px);
      line-height:1.9;
      font-weight:400;
    }

    .hero-copy strong{
      font-weight:500;
      color:#243244;
    }

    .actions{
      display:flex;
      flex-wrap:wrap;
      gap:12px;
      margin-top:26px;
    }

    .btn{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      min-height:46px;
      padding:0 18px;
      border-radius:999px;
      font-size:15px;
      font-weight:500;
      border:1px solid transparent;
      transition:.25s;
    }

    .btn.primary{
      background:var(--dark);
      color:#fff;
    }

    .btn.secondary{
      background:#fff;
      border-color:#cbd5e1;
      color:#1e293b;
    }

    .btn:hover{
      transform:translateY(-2px);
      box-shadow:0 10px 25px rgba(15,23,42,.12);
    }

    .trust{
      display:grid;
      gap:10px;
      margin-top:28px;
      color:#64748b;
      font-size:13px;
      line-height:1.65;
    }

    .trust span{
      display:flex;
      gap:8px;
    }

    .status-card{
      border:1px solid rgba(226,232,240,.95);
      background:rgba(255,255,255,.86);
      border-radius:28px;
      box-shadow:var(--shadow);
      padding:22px;
    }

    .status-title{
      margin:0 0 16px;
      font-size:13px;
      color:#64748b;
      font-weight:400;
      text-align:center;
    }

    .status-grid{
      display:grid;
      grid-template-columns:1fr 1fr;
      gap:12px;
    }

    .status-item{
      min-height:74px;
      border:1px solid #e2e8f0;
      border-radius:18px;
      padding:13px 14px;
      background:#fff;
    }

    .status-label{
      font-size:11px;
      color:#64748b;
      font-weight:400;
    }

    .status-value{
      margin-top:5px;
      font-size:17px;
      line-height:1.25;
      font-weight:500;
      letter-spacing:.01em;
      color:#111827;
      overflow-wrap:anywhere;
    }

    /* =========================
       COMMON
    ========================= */

    section{
      scroll-margin-top:92px;
    }

    .section{
      padding:64px 0;
    }

    .section.gray{
      background:#f8fafc;
    }

    .section.dark{
      background:#0f172a;
      color:#fff;
    }

    .section-head{
      display:flex;
      align-items:end;
      justify-content:space-between;
      gap:18px;
      margin-bottom:26px;
    }

h2{
  margin:0;
  color:#0f172a;
  font-size:clamp(26px,3.4vw,40px);
  line-height:1.3;
  letter-spacing:-.02em;
  font-weight:650;
}

    .section-lead{
      margin:12px 0 0;
      color:#64748b;
      font-size:15px;
      line-height:1.85;
    }

    .mini-link{
      display:inline-flex;
      align-items:center;
      min-height:38px;
      padding:0 14px;
      border:1px solid #cbd5e1;
      border-radius:999px;
      font-size:13px;
      background:#fff;
      color:#1e293b;
      font-weight:500;
      white-space:nowrap;
    }

    .grid-3{
      display:grid;
      grid-template-columns:repeat(3,1fr);
      gap:18px;
    }

    .grid-4{
      display:grid;
      grid-template-columns:repeat(4,1fr);
      gap:14px;
    }

    .card{
      border:1px solid #e2e8f0;
      border-radius:var(--radius);
      background:#fff;
      padding:22px;
    }

    .card h3{
      margin:4px 0 0;
      font-size:20px;
      line-height:1.55;
      font-weight:500;
    }

    .label{
      color:#64748b;
      font-size:12px;
      font-weight:400;
      letter-spacing:.04em;
    }

    .list{
      margin:0;
      padding:0;
      list-style:none;
      display:grid;
      gap:9px;
      color:#475569;
      font-size:14px;
    }

    .list li{
      display:flex;
      gap:8px;
    }

    .service-card h3{
      font-size:18px;
    }

    .sector-title{
      display:flex;
      align-items:center;
      gap:8px;
      color:#64748b;
      font-size:14px;
      font-weight:500;
    }

    .sector-title .icon{
      width:28px;
      height:28px;
      border-radius:10px;
      display:grid;
      place-items:center;
      background:#eff6ff;
      color:var(--navy);
      font-size:15px;
    }

    .card p{
      margin:10px 0 0;
      color:#475569;
      font-size:14px;
      line-height:1.75;
    }

/* =========================
   COUNTRY
========================= */

.country-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
  align-items:stretch;
}

.country-card{
  display:flex;
  flex-direction:column;
  min-width:0;
  border:1px solid #e2e8f0;
  border-radius:24px;
  background:#ffffff;
  padding:24px;
  box-shadow:0 1px 2px rgba(15,23,42,.02);
}

.country-card-head{
  display:flex;
  align-items:center;
  gap:12px;
  padding-bottom:18px;
  border-bottom:1px solid #e5e7eb;
}

.country-icon{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  flex:0 0 auto;
  border-radius:14px;
  background:#eff6ff;
  color:#0b2f4f;
  font-size:12px;
  font-weight:700;
  letter-spacing:.05em;
}

.country-name{
  margin:0;
  color:#111827;
  font-size:21px;
  line-height:1.4;
  font-weight:600;
}

.country-info{
  display:grid;
  gap:0;
  margin:0;
}

.country-info-row{
  display:grid;
  gap:7px;
  padding:17px 0;
  border-bottom:1px solid #edf0f4;
}

.country-info-row:last-child{
  border-bottom:0;
}

.country-info-row dt{
  margin:0;
  color:#64748b;
  font-size:12px;
  line-height:1.5;
  font-weight:600;
  letter-spacing:.04em;
}

.country-info-row dd{
  margin:0;
  color:#334155;
  font-size:14px;
  line-height:1.8;
}

.country-tags{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
}

.country-tags span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:30px;
  padding:3px 11px;
  border:1px solid #dbeafe;
  border-radius:999px;
  background:#eff6ff;
  color:#0b2f4f;
  font-size:12px;
  font-weight:600;
}

.country-point{
  margin-top:auto;
}

.country-point dd{
  padding:12px 14px;
  border-radius:14px;
  background:#f8fafc;
  color:#475569;
}

    .note{
      margin:14px 0 0;
      color:#64748b;
      font-size:12px;
    }

    .step{
      position:relative;
      border:1px solid #e2e8f0;
      border-radius:22px;
      padding:20px;
      background:#fff;
      min-height:132px;
    }

    .step-num{
      font-size:12px;
      color:#64748b;
      letter-spacing:.06em;
    }

    .step-title{
      margin-top:4px;
      font-size:18px;
      font-weight:500;
    }

    .step-text{
      margin-top:8px;
      color:#475569;
      font-size:14px;
      line-height:1.65;
    }

    /* =========================
       REGISTERED SUPPORT CTA - 別サービス
    ========================= */

    .partner-separate{
      background:#ffffff;
      padding-top:24px;
    }

    .partner-banner{
      position:relative;
      overflow:hidden;
      display:grid;
      grid-template-columns:1fr auto;
      align-items:center;
      gap:28px;

      padding:34px 38px;

      border:1px solid rgba(255,255,255,.14);
      border-radius:28px;

      background:
        radial-gradient(circle at 12% 0%, rgba(255,255,255,.12), transparent 34%),
        linear-gradient(135deg,#0f172a 0%,#102c49 100%);

      color:#ffffff;

      box-shadow:
        0 24px 70px rgba(15,23,42,.18);
    }

    .partner-banner::before{
      content:"";
      position:absolute;
      inset:0;
      background:
        linear-gradient(90deg, rgba(255,255,255,.05), transparent 34%, rgba(255,255,255,.03));
      pointer-events:none;
    }

    .partner-banner-text,
    .partner-banner-btn{
      position:relative;
      z-index:1;
    }

    .partner-banner-label{
      display:inline-flex;
      align-items:center;
      gap:8px;

      padding:6px 12px;

      border:1px solid rgba(255,255,255,.22);
      border-radius:999px;

      background:rgba(255,255,255,.08);

      color:#dbeafe;

      font-size:12px;
      font-weight:700;

      margin-bottom:12px;
      letter-spacing:.04em;
    }

    .partner-banner-label::before{
      content:"別サービス";
      display:inline-flex;
      padding:2px 8px;
      border-radius:999px;
      background:#ffffff;
      color:#0f172a;
      font-size:11px;
      letter-spacing:0;
    }

    .partner-banner h3{
      margin:0;

      font-size:clamp(22px,2.8vw,32px);

      line-height:1.42;

      color:#ffffff;
    }

    .partner-banner p{
      margin-top:12px;

      color:#cbd5e1;

      font-size:14px;

      line-height:1.9;
    }

    .partner-banner-btn{
      flex-shrink:0;

      display:inline-flex;
      align-items:center;
      justify-content:center;

      min-height:54px;

      padding:0 26px;

      border-radius:999px;

      background:#ffffff;

      color:#0f172a;

      font-weight:700;

      transition:.25s;
      white-space:nowrap;
      box-shadow:0 12px 28px rgba(0,0,0,.16);
    }

    .partner-banner-btn:hover{
      transform:translateY(-2px);

      box-shadow:
        0 16px 34px rgba(0,0,0,.20);
    }


/* =========================
   CONTACT
========================= */

#contact.section{
  padding:90px 0;
  background:#0f172a;
  color:#fff;
}

#contact .contact-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(420px,1fr);
  gap:64px;
  align-items:center;
}

#contact .contact-copy{
  display:block;
  align-self:center;
  min-width:0;
}

#contact .contact-label{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:auto;
  margin:0 0 28px;
  padding:9px 22px;
  border:2px solid rgba(255,255,255,.25);
  border-radius:999px;
  background:rgba(255,255,255,.06);
  color:#dbeafe;
  font-size:14px;
  line-height:1;
  font-weight:700;
  letter-spacing:.1em;
}

#contact .contact-copy h2{
  display:block;
  margin:0;
  color:#fff;
  font-size:clamp(36px,4vw,54px);
  line-height:1.15;
  letter-spacing:-.02em;
  font-weight:700;
}

#contact .contact-copy p,
#contact.section p{
  color:#cbd5e1;
}

#contact .contact-copy p{
  max-width:650px;
  margin:24px 0 0;
  font-size:17px;
  line-height:2;
}

#contact .contact-list{
  display:grid;
  gap:18px;
  margin-top:34px;
  color:#e2e8f0;
  font-size:16px;
}

#contact .contact-list div{
  display:flex;
  align-items:flex-start;
  gap:14px;
}

#contact .contact-list i{
  width:22px;
  margin-top:6px;
  color:#93c5fd;
  text-align:center;
  flex:0 0 22px;
}

#contact .contact-list span{
  line-height:1.7;
}

#contact .form-card{
  width:100%;
  min-width:0;
  margin:0;
  padding:28px;
  border-radius:28px;
  background:#fff;
  color:#111827;
  box-shadow:0 24px 60px rgba(0,0,0,.22);
}

#contact form{
  display:grid;
  gap:14px;
}

#contact label{
  display:grid;
  gap:6px;
  color:#334155;
  font-size:13px;
}

#contact input,
#contact textarea{
  width:100%;
  min-height:46px;
  padding:11px 13px;
  border:1px solid #cbd5e1;
  border-radius:14px;
  background:#fff;
  color:#111827;
  font:inherit;
}

#contact textarea{
  min-height:116px;
  resize:vertical;
}

#contact .form-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}

#contact .agree{
  display:flex;
  align-items:flex-start;
  gap:8px;
  color:#64748b;
  font-size:12px;
  line-height:1.6;
}

#contact .agree input{
  width:auto;
  min-height:auto;
  margin-top:4px;
}

#contact .submit{
  width:100%;
  min-height:50px;
  border:0;
  border-radius:16px;
  background:#0f172a;
  color:#fff;
  font:inherit;
  font-weight:500;
  cursor:pointer;
  transition:.25s;
}

#contact .submit:hover{
  transform:translateY(-2px);
  box-shadow:0 10px 25px rgba(15,23,42,.18);
}

    /* =========================
       FOOTER
    ========================= */

    footer{
      border-top:1px solid #e2e8f0;
      background:#fff;
    }

    .footer-grid{
      display:grid;
      grid-template-columns:1.3fr 1fr 1fr 1fr;
      gap:24px;
      padding:42px 0 22px;
    }

    .footer-title{
      font-weight:500;
      margin-bottom:8px;
    }

    .footer-text,
    .footer-list{
      color:#64748b;
      font-size:13px;
      line-height:1.8;
    }

    .footer-list{
      margin:0;
      padding:0;
      list-style:none;
    }

    .footer-list a:hover{
      color:#0b2f4f;
    }

    .copyright{
      padding:16px 0 36px;
      color:#94a3b8;
      font-size:12px;
    }

    .footer-sns{
      display:flex;
      gap:14px;
      margin-top:18px;
    }

    .footer-sns a{
      width:44px;
      height:44px;
      border-radius:14px;
      display:flex;
      align-items:center;
      justify-content:center;
      background:#0f172a;
      color:#ffffff;
      font-size:20px;
      border:1px solid rgba(255,255,255,.08);
      transition:
        transform .25s ease,
        background .25s ease,
        box-shadow .25s ease;
    }

    .footer-sns a:hover{
      background:#16304d;
      transform:translateY(-3px);
      box-shadow:0 10px 25px rgba(15,23,42,.25);
    }

/* =========================
   RESPONSIVE
========================= */

@media (max-width:1080px){
  nav{
    gap:16px;
    font-size:13px;
  }

  .header-inner{
    gap:20px;
  }

  .brand-name{
    font-size:16px;
  }
}

@media (max-width:900px){
  nav,
  .header-cta{
    display:none;
  }

  .topbar-inner{
    justify-content:flex-start;
    overflow-x:auto;
    white-space:nowrap;
    flex-wrap:nowrap;
    -webkit-overflow-scrolling:touch;
  }

  .hero-grid{
    grid-template-columns:1fr;
    padding:42px 18px 40px;
    gap:28px;
  }

  .status-card{
    order:-1;
  }

  .grid-3,
  .country-grid{
    grid-template-columns:1fr;
  }

  .grid-4{
    grid-template-columns:1fr 1fr;
  }

  .partner-banner{
    grid-template-columns:1fr;
    align-items:flex-start;
  }

  .partner-banner-btn{
    width:100%;
  }

  .footer-grid{
    grid-template-columns:1fr 1fr;
  }
}

/* PC・タブレットでは左右2列、760px以下で縦並び */
@media (max-width:760px){
  #contact .contact-grid{
    grid-template-columns:1fr;
    gap:42px;
  }

  #contact .form-card{
    max-width:none;
  }
}

@media (max-width:560px){
  body{
    line-height:1.72;
  }

  .wrap{
    padding:0 16px;
  }

  .topbar-inner{
    padding:9px 16px;
    gap:8px;
  }

  .pill{
    padding:5px 10px;
    font-size:11px;
  }

  .header-inner{
    min-height:70px;
  }

  .brand-mark{
    width:50px;
    height:50px;
    min-width:50px;
    min-height:50px;
    overflow:hidden;
    border-radius:50%;
    background:transparent;
    padding:0;
  }

  .brand-mark img{
    width:100%;
    height:100%;
    display:block;
    object-fit:cover;
    object-position:50% 50%;
    border-radius:50%;
    padding:0;
    margin:0;
  }

  .brand-name{
    font-size:15px;
  }

  .brand-sub{
    font-size:10px;
  }

  .hero-grid{
    padding:34px 16px 36px;
  }

  .eyebrow{
    font-size:11px;
  }

  .hero h1,
  .hero h2{
    font-size:31px;
  }

  .hero-copy{
    font-size:15px;
  }

  .actions .btn,
  .partner-actions .btn{
    width:100%;
  }

  .status-card{
    padding:18px;
    border-radius:26px;
  }

  .status-title{
    text-align:left;
  }

  .status-grid{
    grid-template-columns:1fr 1fr;
    gap:10px;
  }

  .status-item{
    min-height:72px;
    padding:12px;
  }

  .status-value{
    font-size:15px;
  }

  .section{
    padding:48px 0;
  }

  .section-head{
    align-items:flex-start;
    flex-direction:column;
    margin-bottom:20px;
  }

  .card{
    padding:19px;
    border-radius:20px;
  }

  .country-name{
    font-size:19px;
  }

  .country-info-row{
    padding:15px 0;
  }

  .grid-4{
    grid-template-columns:1fr;
  }

  .partner-banner{
    padding:24px;
    border-radius:24px;
  }

  .partner-banner h3{
    font-size:22px;
  }

  #contact.section{
    padding:58px 0;
  }

  #contact .contact-label{
    margin-bottom:22px;
    padding:8px 18px;
    font-size:12px;
  }

  #contact .contact-copy h2{
    font-size:36px;
  }

  #contact .contact-copy p{
    margin-top:18px;
    font-size:15px;
    line-height:1.9;
  }

  #contact .contact-list{
    gap:15px;
    margin-top:28px;
    font-size:14px;
  }

  #contact .form-card{
    padding:20px;
    border-radius:22px;
  }

  #contact .form-row{
    grid-template-columns:1fr;
  }

  .footer-grid{
    grid-template-columns:1fr;
  }

  .footer-sns{
    gap:12px;
  }

  .footer-sns a{
    width:42px;
    height:42px;
    font-size:18px;
  }

  .copyright{
    padding-bottom:28px;
  }
}
