/* ============================================================
   新トップページ（page-newtop.php）専用スタイル
   このファイルは page-newtop.php テンプレートが使われている
   ページにだけ読み込まれます（functions.php で条件付き読込）。
   すべて .nt-scope の中だけに効くようにしてあるので、
   既存のヘッダー・フッターや他ページには影響しません。
   ============================================================ */

.nt-scope{
  --primary:#43a548;
  --primary-dark:#2f7a34;
  --primary-tint:#eef8ee;
  --orange:#f0901e;
  --teal:#1ba9a6;
  --pink:#b45fa8;
  --bg:#ffffff;
  --ink:#2a3438;
  --line:#e5ece5;

  font-family:"Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;
  color:var(--ink);
  background:var(--bg);
}
.nt-scope, .nt-scope *{box-sizing:border-box;}
.nt-scope a{color:inherit;text-decoration:none;}
.nt-scope img{max-width:100%;display:block;}

/* WordPressがブロックの中身に自動でつける幅制限（wp-block-group__inner-container）を、
   nt-scopeの中だけ解除する。これが無いと、Bootstrapのcontainer幅より内側で、
   さらに690px前後に固定されてしまい、デザインが常に狭いままになる。
   ※ .nt-scope 自身は alignfull の幅計算を使うので、ここでは触らない。 */
.nt-scope .wp-block-group__inner-container{
  max-width:none !important;
  width:auto !important;
}

.nt-scope .wrap{max-width:1140px;margin:0 auto;padding:0 20px;}

/* ヒーロー */
.nt-scope .hero{
  background:linear-gradient(180deg,var(--primary-tint) 0%, #ffffff 100%);
  color:var(--ink);
}
.nt-scope .hero-inner{
  gap:40px;
  align-items:stretch;
  padding:48px 20px;
  max-width:1140px;
  margin:0 auto;
}
.nt-scope .hero-eyebrow{
  font-size:18px;font-weight:bold;color:var(--primary-dark);
  margin-bottom:10px;letter-spacing:.05em;
}
.nt-scope .hero-text h2{font-size:34px;line-height:1.5;margin:0 0 14px;color:var(--ink);word-break:keep-all;overflow-wrap:break-word;}
.nt-scope .hero-text h2 .accent{color:var(--primary-dark);border-bottom:4px solid var(--orange);}
.nt-scope .hero p.lead{font-size:18px;line-height:1.8;margin:0 0 22px;color:var(--ink);}

.nt-scope .usp-row{margin:0 auto 48px;padding:0 20px;max-width:1140px;}
.nt-scope .usp-row > .wp-block-group__inner-container{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.nt-scope .usp-card{
  flex:1 1 150px;
  background:#fff;
  border:1px solid var(--line);
  border-radius:8px;
  padding:12px 14px;
  box-shadow:0 2px 8px rgba(20,60,60,.05);
}
.nt-scope .usp-card p{font-size:18px;line-height:1.6;color:var(--ink);margin:0;}
.nt-scope .usp-card strong{display:block;font-size:18px;margin-bottom:4px;color:var(--ink);}
.nt-scope .usp-icon{
  width:26px;height:26px;border-radius:6px;
  display:flex;align-items:center;justify-content:center;
  margin-bottom:6px;
  color:#fff;
}
.nt-scope .usp-card.c1 .usp-icon{background:var(--primary);}
.nt-scope .usp-card.c2 .usp-icon{background:var(--teal);}
.nt-scope .usp-card.c3 .usp-icon{background:var(--orange);}

.nt-scope .hero-photo{position:relative;height:100%;}
.nt-scope .hero-photo-img{
  width:100%;
  height:100%;
  min-height:320px;
  overflow:hidden;
  margin:0;
  border-radius:12px;
  box-shadow:0 12px 30px rgba(30,60,40,.12);
  mask-image:linear-gradient(to right, transparent 0%, black 10%);
  -webkit-mask-image:linear-gradient(to right, transparent 0%, black 10%);
}
.nt-scope .hero-photo-img img{width:100%;height:100%;object-fit:cover;object-position:50% 40%;display:block;}
.nt-scope .free-badge{
  position:absolute;
  right:-16px;bottom:-16px;
  width:190px;height:190px;border-radius:50%;
  background:var(--orange);color:#fff;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;padding:0 8px;box-sizing:border-box;
  font-weight:bold;box-shadow:0 6px 18px rgba(0,0,0,.15);
  font-size:18px;line-height:1.35;
}
.nt-scope .free-badge-line{display:block;white-space:nowrap;}
.nt-scope .free-badge strong{font-size:22px;display:block;margin-top:2px;}

/* 症状セクション */
.nt-scope .symptoms{padding:56px 20px;}
.nt-scope .section-title{
  text-align:center;font-size:22px;margin:0 0 32px;
}
.nt-scope .symptom-row{gap:16px;margin-bottom:16px;max-width:1140px;margin-left:auto;margin-right:auto;}
.nt-scope .symptom-row:last-child{margin-bottom:0;}
.nt-scope .symptom-pair{gap:16px;}
.nt-scope .symptom-card{
  display:block;
  background:#fff;
  border:1px solid var(--line);
  border-radius:10px;
  overflow:hidden;
  text-align:center;
  transition:box-shadow .15s, transform .15s;
}
.nt-scope .symptom-card:hover{box-shadow:0 8px 20px rgba(0,0,0,.08);transform:translateY(-2px);}
.nt-scope .symptom-photo{
  width:100%;
  aspect-ratio:1/1;
  overflow:hidden;
  margin:0;
}
.nt-scope .symptom-photo img{width:100%;height:100%;object-fit:cover;display:block;}
.nt-scope .symptom-card .symptom-body{padding:14px 12px 18px;}
.nt-scope .symptom-card p{font-size:18px;font-weight:bold;margin:0 0 8px;line-height:1.5;}
.nt-scope .symptom-card span.more{font-size:18px;color:var(--primary-dark);font-weight:bold;}

/* 解決メッセージ バナー */
.nt-scope .solve-banner-section{padding:0 20px 56px;text-align:center;}
.nt-scope .solve-banner-img{max-width:700px;width:100%;margin:0 auto;}

/* 料金セクション */
.nt-scope .pricing{padding:56px 20px;background:var(--primary-tint);}
.nt-scope .section-sub{text-align:center;font-size:18px;color:var(--ink);margin:-16px 0 28px;}
.nt-scope .price-grid{
  gap:16px;
  max-width:760px;margin:0 auto 24px;
}
.nt-scope .price-card{
  background:#fff;border:1px solid var(--line);border-radius:10px;
  text-align:center;padding:22px 10px;
}
.nt-scope .price-card.featured{border:2px solid var(--primary);position:relative;}
.nt-scope .price-card-label{font-size:18px;color:var(--ink);margin-bottom:6px;}
.nt-scope .price-card-amount{font-size:28px;font-weight:bold;color:var(--primary-dark);}
.nt-scope .price-card-amount span{display:block;font-size:18px;font-weight:normal;color:var(--ink);}
.nt-scope .price-notes{
  list-style:none;padding:0;margin:0 auto 24px;max-width:520px;
  font-size:18px;color:var(--ink);line-height:2;
}
.nt-scope .price-notes li{padding-left:1.2em;position:relative;}
.nt-scope .price-notes li::before{content:"✓";position:absolute;left:0;color:var(--primary);font-weight:bold;}
.nt-scope .btn-outline{
  display:block;width:fit-content;margin:0 auto;
  border:1px solid var(--primary);color:var(--primary-dark);
  padding:10px 24px;border-radius:6px;font-size:18px;font-weight:bold;
}

/* 対応地域 */
.nt-scope .area-section{padding:56px 20px;}
.nt-scope .area-inner{
  gap:40px;align-items:center;
  max-width:1140px;margin-left:auto;margin-right:auto;
}
.nt-scope .area-title{text-align:left;margin-bottom:16px;}
.nt-scope .area-chip-row{
  display:flex;flex-wrap:wrap;justify-content:flex-start;gap:8px;
  margin:0 0 20px;
}
.nt-scope .area-chip{
  background:var(--primary-tint);color:var(--primary-dark);
  border:1px solid var(--line);border-radius:99px;
  font-size:18px;font-weight:bold;padding:6px 16px;
}
.nt-scope .area-chip.alt{background:#eef3fb;color:var(--teal);}
.nt-scope .area-notes{margin:0 0 0;max-width:none;text-align:left;}
.nt-scope .area-map-img{
  width:100%;border-radius:12px;border:1px solid var(--line);margin:0;overflow:hidden;
}
.nt-scope .area-map-img img{width:100%;display:block;}

/* 代表プロフィール */
.nt-scope .profile{padding:56px 20px;background:var(--primary-tint);}
.nt-scope .profile-inner{
  gap:40px;align-items:center;
  max-width:960px;margin:0 auto;
}
.nt-scope .profile-photo{
  width:100%;aspect-ratio:1/1;overflow:hidden;border-radius:50%;margin:0;
  box-shadow:0 12px 30px rgba(30,60,40,.12);
}
.nt-scope .profile-photo img{width:100%;height:100%;object-fit:cover;display:block;}
.nt-scope .profile-name{font-size:28px;margin:6px 0 14px;color:var(--ink);}
.nt-scope .profile-text p{font-size:18px;line-height:1.9;color:var(--ink);margin:0 0 16px;}
.nt-scope .profile-points{list-style:none;padding:0;margin:0 0 20px;font-size:18px;color:var(--ink);line-height:2;}
.nt-scope .profile-points li{padding-left:1.2em;position:relative;}
.nt-scope .profile-points li::before{content:"✓";position:absolute;left:0;color:var(--primary);font-weight:bold;}

.nt-scope .company-table{
  margin:20px 0 0;padding:14px 16px;background:#fff;
  border:1px solid var(--line);border-radius:8px;
}
.nt-scope .company-table > div{
  display:flex;gap:14px;padding:6px 0;font-size:18px;line-height:1.7;
  border-bottom:1px solid var(--line);
}
.nt-scope .company-table > div:last-child{border-bottom:none;}
.nt-scope .company-table dt{
  flex:0 0 70px;font-weight:bold;color:var(--ink);margin:0;
}
.nt-scope .company-table dd{flex:1;margin:0;color:var(--ink);}

/* 修理事例・お客様の声 共通 */
.nt-scope .section-head-row{
  display:flex;align-items:baseline;justify-content:center;gap:16px;position:relative;margin-bottom:8px;
}
.nt-scope .section-head-row .see-all{
  position:absolute;right:0;font-size:18px;color:var(--primary-dark);font-weight:bold;
}
.nt-scope .sample-note{
  text-align:center;font-size:18px;color:#b4791e;background:#fff6e8;
  border:1px solid #f0d9ab;border-radius:6px;padding:8px 12px;
  max-width:560px;margin:0 auto 28px;
}

.nt-scope .cases{padding:56px 20px;}
.nt-scope .case-grid{gap:18px;max-width:1140px;margin-left:auto;margin-right:auto;}
.nt-scope .case-card{border:1px solid var(--line);border-radius:10px;overflow:hidden;background:#fff;}
.nt-scope .case-photo{
  width:100%;aspect-ratio:16/10;overflow:hidden;margin:0;
}
.nt-scope .case-photo img{width:100%;height:100%;object-fit:cover;display:block;}
.nt-scope .case-tag{
  display:block;width:100%;margin:0;
  background:var(--primary);color:#fff;font-size:18px;font-weight:bold;
  padding:8px 14px;
}
.nt-scope .case-body{padding:10px 14px 16px;}
.nt-scope .case-body p{font-size:18px;font-weight:bold;margin:0 0 6px;line-height:1.5;}
.nt-scope .case-area{font-size:18px;color:var(--ink);}

.nt-scope .voices{padding:56px 20px;background:var(--primary-tint);}
.nt-scope .voice-grid{gap:18px;max-width:1140px;margin-left:auto;margin-right:auto;}
.nt-scope .voice-card{
  background:#fff;border:1px solid var(--line);border-radius:10px;padding:20px;
}
.nt-scope .voice-card p{font-size:18px;line-height:1.8;margin:0 0 12px;color:var(--ink);}
.nt-scope .voice-area{font-size:18px;color:var(--ink);font-weight:bold;}
.nt-scope .rating-badge{
  display:flex;align-items:center;justify-content:center;gap:8px;
  margin:0 0 6px;font-size:18px;
}
.nt-scope .rating-stars{color:var(--orange);letter-spacing:1px;}
.nt-scope .rating-score{font-weight:bold;color:var(--ink);}
.nt-scope .rating-count{color:var(--ink);font-size:18px;}

/* よくあるご質問 */
.nt-scope .faq{padding:56px 20px;}
.nt-scope .faq-list{max-width:760px;margin:0 auto;display:flex;flex-direction:column;gap:10px;}
.nt-scope .faq-item{
  border:1px solid var(--line);border-radius:10px;padding:14px 18px;background:#fff;
}
.nt-scope .faq-item summary{
  font-size:18px;font-weight:bold;color:var(--ink);cursor:pointer;
  list-style:none;display:flex;align-items:flex-start;gap:10px;
  padding-bottom:12px;margin-bottom:12px;border-bottom:1px solid var(--line);
}
.nt-scope .faq-item summary::-webkit-details-marker{display:none;}
.nt-scope .faq-item summary::before{
  content:"Q";flex:0 0 26px;width:26px;height:26px;border-radius:50%;
  background:var(--primary);color:#fff;font-size:14px;
  display:flex;align-items:center;justify-content:center;
}
.nt-scope .faq-item p{
  font-size:18px;line-height:1.8;color:var(--ink);margin:0;
  display:flex;align-items:flex-start;gap:10px;
}
.nt-scope .faq-item p::before{
  content:"A";flex:0 0 26px;width:26px;height:26px;border-radius:50%;
  background:var(--orange);color:#fff;font-size:14px;
  display:flex;align-items:center;justify-content:center;
}

/* フッターCTA */
.nt-scope .footer-cta{
  background:var(--primary-dark);color:#fff;padding:48px 20px;text-align:center;
}
.nt-scope .footer-photo-row{
  margin:0 auto 24px;max-width:420px;
}
.nt-scope .footer-photo-row > .wp-block-group__inner-container{
  display:flex;justify-content:center;gap:12px;
}
.nt-scope .footer-photo-row .wp-block-image{flex:1;margin:0;}
.nt-scope .footer-photo-row img{
  width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:10px;
  box-shadow:0 8px 20px rgba(0,0,0,.2);
}
.nt-scope .footer-cta h2{font-size:20px;margin:0 0 18px;color:#fff;}
.nt-scope .footer-tel-row{margin-bottom:18px;}
.nt-scope .footer-tel{font-size:32px;font-weight:bold;color:#fff;}
.nt-scope .footer-tel-row span{display:block;font-size:18px;opacity:.85;margin-top:4px;color:#fff;}
.nt-scope .btn-call-big{
  display:inline-flex;align-items:center;gap:8px;
  background:var(--orange);color:#fff;font-weight:bold;font-size:18px;
  padding:14px 32px;border-radius:8px;margin-bottom:36px;
}
.nt-scope .maker-block{
  max-width:760px;margin:0 auto 14px;font-size:18px;line-height:1.9;
  text-align:left;opacity:.95;color:#fff;
}
.nt-scope .maker-block b{display:block;font-size:18px;margin-bottom:4px;}

/* モバイル固定電話バー */
.nt-mobile-only{display:none;}
.nt-mobile-cta-bar a{
  flex:1;display:flex;align-items:center;justify-content:center;gap:8px;
  text-align:center;padding:14px 4px;font-size:18px;font-weight:bold;color:#fff;
}
.nt-mobile-cta-bar .c1{background:var(--orange);}

/* ===== モバイル =====
   カラムの「積み重ね／並び」自体はWordPress標準のカラムブロックの機能に任せています。
   ここでは余白・文字サイズなど、見た目の微調整だけを行っています。 */
@media (max-width:781px){
  .nt-scope{font-size:18px;}
  .nt-scope .hero-inner{padding:24px 16px 28px;gap:16px;}
  .nt-scope .hero-eyebrow{font-size:18px;}
  .nt-scope .hero-text h2{font-size:26px;line-height:1.5;}
  .nt-scope .hero p.lead{font-size:18px;line-height:1.8;}
  .nt-scope .hero-photo{height:auto;}
  .nt-scope .hero-photo-img{
    height:auto;
    min-height:0;
    aspect-ratio:4/3;
    mask-image:none;-webkit-mask-image:none;
    margin-bottom:16px;
  }
  .nt-scope .hero-photo-img img{object-position:50% 30%;}
  .nt-scope .usp-row{margin:0 auto 24px;padding:0 16px;}
  .nt-scope .usp-row > .wp-block-group__inner-container{grid-template-columns:1fr;gap:10px;}
  .nt-scope .usp-card{padding:12px 14px;}
  .nt-scope .usp-card p{font-size:18px;}
  .nt-scope .usp-card strong{font-size:18px;}

  .nt-scope .symptoms{padding:20px 16px;}
  .nt-scope .section-title{font-size:22px;margin-bottom:12px;}
  .nt-scope .symptom-row{gap:6px;margin-bottom:6px;}
  .nt-scope .symptom-pair{gap:6px;}
  .nt-scope .symptom-photo{aspect-ratio:4/3;}
  .nt-scope .symptom-photo img{object-position:top;}
  .nt-scope .symptom-card .symptom-body{padding:6px 6px 8px;}
  .nt-scope .symptom-card p{font-size:18px;margin:0 0 4px;}
  .nt-scope .symptom-card span.more{font-size:18px;}
  .nt-scope .solve-banner-section{padding:0 16px 16px;}

  .nt-mobile-only{display:flex;}
  .nt-mobile-cta-bar{
    position:sticky;bottom:0;left:0;right:0;
    display:flex;
    z-index:60;
  }
  .nt-mobile-cta-bar a{font-size:18px;}

  .nt-scope .pricing{padding:20px 12px;}
  .nt-scope .section-sub{font-size:18px;margin:-8px 0 14px;}
  .nt-scope .price-grid{gap:6px;max-width:none;margin:0 0 14px;}
  .nt-scope .price-card{padding:10px 4px;}
  .nt-scope .price-card-label{font-size:18px;}
  .nt-scope .price-card-amount{font-size:20px;}
  .nt-scope .price-card-amount span{font-size:18px;}
  .nt-scope .price-notes{font-size:18px;margin:0 auto 16px;}

  .nt-scope .area-section{padding:20px 10px;}
  .nt-scope .area-inner{gap:14px;}
  .nt-scope .area-title{text-align:center;margin-bottom:10px;}
  .nt-scope .area-chip-row{justify-content:center;margin-bottom:12px;gap:6px;}
  .nt-scope .area-notes{text-align:left;max-width:320px;margin:0 auto;font-size:18px;}
  .nt-scope .area-chip{font-size:18px;padding:5px 10px;}

  .nt-scope .profile{padding:24px 12px;}
  .nt-scope .profile-inner{gap:14px;text-align:center;}
  .nt-scope .profile-photo{max-width:150px;margin:0 auto;}
  .nt-scope .profile-name{font-size:21px;margin:10px 0 10px;}
  .nt-scope .profile-text p{font-size:18px;margin:0 0 12px;}
  .nt-scope .profile-points{text-align:left;max-width:280px;margin-left:auto;margin-right:auto;font-size:18px;}
  .nt-scope .company-table{
    max-width:none;margin-left:0;margin-right:0;font-size:18px;
    padding:12px 10px;
    display:grid;grid-template-columns:1fr 1fr;gap:0 10px;
  }
  .nt-scope .company-table > div{flex-direction:column;gap:2px;padding:8px 0;border-bottom:1px solid var(--line);}
  .nt-scope .company-table > div:nth-last-child(1),
  .nt-scope .company-table > div:nth-last-child(2){border-bottom:none;}
  .nt-scope .company-table dt{flex:none;font-size:18px;}

  .nt-scope .section-head-row{flex-direction:column;gap:4px;margin-bottom:12px;}
  .nt-scope .section-head-row .see-all{position:static;font-size:18px;}
  .nt-scope .cases{padding:24px 16px;}
  .nt-scope .case-grid{gap:12px;}
  .nt-scope .case-tag{font-size:18px;}
  .nt-scope .case-body p{font-size:18px;}
  .nt-scope .case-area{font-size:18px;}

  .nt-scope .voices{padding:24px 16px;}
  .nt-scope .voice-grid{gap:12px;}
  .nt-scope .voice-card{padding:16px;}
  .nt-scope .voice-card p{font-size:18px;}
  .nt-scope .voice-area{font-size:18px;}
  .nt-scope .rating-badge{font-size:18px;}
  .nt-scope .rating-count{font-size:18px;}

  .nt-scope .faq{padding:24px 16px;}
  .nt-scope .faq-list{gap:8px;}
  .nt-scope .faq-item{padding:14px 16px;}
  .nt-scope .faq-item summary{font-size:18px;}
  .nt-scope .faq-item p{font-size:18px;}

  .nt-scope .footer-cta{padding:24px 16px;}
  .nt-scope .footer-photo-row{margin:0 auto 16px;}
  .nt-scope .footer-cta h2{font-size:20px;margin:0 0 12px;}
  .nt-scope .footer-tel-row span{font-size:18px;}
  .nt-scope .footer-tel{font-size:28px;}
  .nt-scope .btn-call-big{width:100%;justify-content:center;margin-bottom:16px;font-size:18px;}
  .nt-scope .maker-block{font-size:18px;}

  /* 固定の電話バーの分、最後のセクションが隠れないよう余白を追加 */
  .nt-scope .footer-cta{padding-bottom:70px;}
}