:root{--navy:#172127;--orange:#ff4b00;--text:#1f2933;--line:#e7ebee;--soft:#f6f7f8;--white:#fff}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--text);background:#fff;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans JP",sans-serif;line-height:1.75;letter-spacing:.02em}.container{width:min(1080px,calc(100% - 40px));margin:0 auto}.narrow{width:min(820px,calc(100% - 40px))}.site-header{position:sticky;top:0;z-index:10;background:rgba(23,33,39,.96);border-bottom:3px solid var(--orange)}.header-inner{min-height:72px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand img{display:block;width:210px;height:auto}.nav{display:flex;gap:24px;font-size:.92rem;color:#fff}.nav a{text-decoration:none;opacity:.92}.nav a:hover{color:var(--orange);opacity:1}.hero{background:radial-gradient(circle at 20% 20%,rgba(255,75,0,.08),transparent 28%),linear-gradient(180deg,#fff 0%,#f7f8f9 100%);padding:74px 0 56px;text-align:center}.hero-logo{width:min(360px,86%);height:auto;display:block;margin:0 auto 22px}.eyebrow{margin:0 0 8px;color:var(--orange);font-weight:700}h1,h2,h3,p{margin-top:0}h1{margin-bottom:18px;color:var(--navy);font-size:clamp(2rem,5vw,3.5rem);line-height:1.25;letter-spacing:.03em}.lead{margin:0 auto 28px;max-width:720px;font-size:clamp(1.04rem,2.5vw,1.24rem);color:#39434b}.section{padding:64px 0}.section.light{background:var(--soft)}.section h2{color:var(--navy);font-size:clamp(1.65rem,3vw,2.2rem);line-height:1.35;margin-bottom:28px;padding-left:14px;border-left:6px solid var(--orange)}.intro{padding-top:54px;padding-bottom:46px}.check-list{display:grid;gap:10px;padding-left:0;list-style:none;font-size:1.04rem}.check-list li{position:relative;padding-left:28px}.check-list li::before{content:"";position:absolute;left:0;top:.72em;width:10px;height:10px;background:var(--orange);border-radius:50%}.cards{display:grid;gap:22px}.cards.three{grid-template-columns:repeat(3,1fr)}.card{background:#fff;border:1px solid var(--line);border-top:5px solid var(--orange);border-radius:16px;padding:28px;box-shadow:0 12px 30px rgba(23,33,39,.06)}.card h3{color:var(--navy);font-size:1.25rem;margin-bottom:12px}.card p{margin-bottom:0}.tags{display:flex;flex-wrap:wrap;gap:12px}.tags span{display:inline-flex;align-items:center;min-height:40px;padding:8px 16px;background:#fff;border:1px solid var(--line);border-radius:999px;font-weight:700}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.step{background:#fff;border-radius:16px;padding:26px 22px 24px;border:1px solid var(--line)}.step .number{display:inline-grid;place-items:center;width:36px;height:36px;margin-bottom:14px;border-radius:50%;background:var(--orange);color:#fff;font-weight:800}.step h3{color:var(--navy);font-size:1.08rem;margin-bottom:8px}.step p{margin-bottom:0;font-size:.96rem}.contact{text-align:center}.contact p{text-align:left}.button{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:10px 24px;background:var(--orange);color:#fff;border-radius:999px;text-decoration:none;font-weight:800;box-shadow:0 10px 20px rgba(255,75,0,.22)}.button:hover{filter:brightness(.96)}.button.large{min-width:220px;margin-top:18px}.site-footer{background:var(--navy);color:#fff;padding:28px 0;text-align:center}.site-footer p{margin:0}.pc-only{display:inline}@media(max-width:820px){.container,.narrow{width:min(100% - 28px,680px)}.header-inner{min-height:68px;justify-content:center}.brand img{width:185px}.nav{display:none}.hero{padding:44px 0 40px}.hero-logo{width:min(300px,88%)}.section{padding:46px 0}.cards.three,.steps{grid-template-columns:1fr}.card,.step{padding:22px}.tags{gap:10px}.tags span{width:100%;justify-content:center;border-radius:12px}.button.large{width:100%}.pc-only{display:none}}


/* v2 adjustments */
.site-header {
  background: #172127;
}

.nav a {
  color: #ffffff;
  font-weight: 700;
  opacity: 1;
  text-shadow: 0 1px 2px rgba(0,0,0,.35);
}

.nav a:hover,
.nav a:focus {
  color: #ff4b00;
}

.hero .eyebrow {
  color: #172127;
  font-size: 1.08rem;
  letter-spacing: .06em;
}

.hero h1 {
  font-size: clamp(2.25rem, 5.4vw, 4rem);
  line-height: 1.15;
  margin-bottom: 16px;
}

.hero h1 span {
  color: #ff4b00;
  white-space: nowrap;
}

@media (max-width: 820px) {
  .hero h1 {
    font-size: clamp(2rem, 9vw, 3rem);
    line-height: 1.18;
  }

  .hero h1 span {
    display: block;
    white-space: normal;
  }
}


/* v3 header logo adjustment */
.brand {
  display: inline-flex;
  align-items: center;
  background: #ffffff;
  border-radius: 4px;
  padding: 4px 8px;
}

.brand img {
  width: 210px;
  height: auto;
}

@media (max-width: 820px) {
  .brand img {
    width: 180px;
  }
}


/* v4 header logo correction: dark navy logo, no white plate */
.brand {
  display: inline-flex;
  align-items: center;
  background: transparent !important;
  border-radius: 0 !important;
  padding: 0 !important;
}

.brand img {
  width: 220px;
  height: auto;
  display: block;
}

@media (max-width: 820px) {
  .brand img {
    width: 185px;
  }
}


/* v5: 実績セクション調整 */
.section-intro {
  margin: -6px 0 22px;
  color: #39434b;
  font-size: 1rem;
}


/* v6: 名刺文言に合わせたサービス4分割 */
.cards.four {
  grid-template-columns: repeat(4, 1fr);
}

.cards.four .card {
  padding: 24px 22px;
}

.cards.four .card h3 {
  font-size: 1.12rem;
}

@media (max-width: 1020px) {
  .cards.four {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 820px) {
  .cards.four {
    grid-template-columns: 1fr;
  }
}




/* v11: 「このようなお困りごとに」ブロック再調整
   v10のカード型は破棄。v9のシンプルさを残し、縦のリズムだけ整える。 */
.intro {
  padding-top: 52px;
  padding-bottom: 50px;
  background: #ffffff;
}

.intro-clean {
  width: min(760px, calc(100% - 40px));
}

.intro-clean h2 {
  margin-bottom: 20px;
}

.intro-list {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  margin: 0;
  padding: 4px 0 0;
  font-size: 1.04rem;
}

.intro-list li {
  position: relative;
  min-height: 46px;
  padding: 11px 0 11px 30px;
  border-bottom: 1px solid #e7ebee;
}

.intro-list li:first-child {
  border-top: 1px solid #e7ebee;
}

.intro-list li::before {
  top: 50%;
  transform: translateY(-50%);
}

@media (max-width: 820px) {
  .intro-clean {
    width: min(100% - 28px, 680px);
  }
}


/* v13: 「このようなお困りごとに」
   右余白のスカスカ感を減らす。
   ただし全面センタリング・カード化はしない。左揃えのまま2列の罫線リストへ。 */
.intro {
  padding-top: 54px;
  padding-bottom: 50px;
  background: #ffffff;
}

.intro-clean {
  width: min(980px, calc(100% - 40px));
  margin-left: auto;
  margin-right: auto;
}

.intro-clean h2 {
  margin-bottom: 22px;
}

.intro-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 56px;
  row-gap: 0;
  margin: 0;
  padding: 2px 0 0;
  font-size: 1.04rem;
}

.intro-list li {
  position: relative;
  min-height: 48px;
  padding: 12px 0 12px 30px;
  border-top: 1px solid #e7ebee;
  border-bottom: 0;
}

.intro-list li:nth-last-child(-n+2) {
  border-bottom: 1px solid #e7ebee;
}

.intro-list li::before {
  top: 50%;
  transform: translateY(-50%);
}

@media (max-width: 820px) {
  .intro-clean {
    width: min(100% - 28px, 680px);
  }

  .intro-list {
    grid-template-columns: 1fr;
    column-gap: 0;
  }

  .intro-list li:nth-last-child(-n+2) {
    border-bottom: 0;
  }

  .intro-list li:last-child {
    border-bottom: 1px solid #e7ebee;
  }
}


/* v14: お困りごとを6項目に。2列×3行で収まりを整える。 */
.intro-list {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.intro-list li:nth-last-child(-n+2) {
  border-bottom: 1px solid #e7ebee;
}