@charset "utf-8";

/* ══════════════════════════════════════════
   PROVITY — 販売パートナー向けページ専用スタイル
   (partner.css)
   common.css / index-pc.css / index-sp.css の後に読み込む。
   既存の #id / .class と衝突しないよう、
   すべて #pt-* / .pt-* 接頭辞でスコープする。
   ※ header / #menu / #gnavi / footer / div.tel / #contact フォーム /
     h2.h2-title / .btn-primary / .send / .form-check-row は
     common.css・index-pc.css・index-sp.css のものをそのまま流用する。
   ══════════════════════════════════════════ */

/* ─── 共通ラッパー・セクション ───────────── */
.pt-inner {
  width:      84.0rem;
  margin:     0 auto;
  box-sizing: border-box;
}
.pt-sec { padding: 9.0rem 0; }
.pt-sec.pt-gray { background: var(--color-bg-gray); }
.pt-sec p {
  font-size:     1.6rem;
  line-height:   1.9;
  margin-bottom: 1.8rem;
}
.pt-sec p:last-child { margin-bottom: 0; }
.pt-sec a { color: var(--color-primary); text-decoration: underline; }
.pt-sec a:hover { opacity: 0.7; }

/* ─── ヒーロー（ファーストビュー） ───────── */
#pt-hero {
  padding-top:    8.0rem; /* 固定ヘッダー分 */
  padding-bottom: 7.0rem;
  background:     linear-gradient(135deg, #14264f 0%, var(--color-navy) 55%, var(--color-primary) 100%);
  text-align:     center;
}
#pt-hero .breadcrumb {
  padding:   2.0rem 0 3.0rem;
  font-size: 1.3rem;
  color:     rgba(255,255,255,.6);
}
#pt-hero .breadcrumb a { color: rgba(255,255,255,.75); }
#pt-hero .breadcrumb a:hover { text-decoration: underline; }
#pt-hero .breadcrumb span { margin: 0 0.8rem; }
#pt-hero h1 {
  font-size:     3.4rem;
  font-weight:   700;
  color:         #fff;
  line-height:   1.5;
  margin-bottom: 2.6rem;
  padding:       0 2.0rem;
}
#pt-hero .pt-hero-sub {
  font-size:     1.9rem;
  font-weight:   700;
  color:         rgba(255,255,255,.9);
  line-height:   1.8;
  margin-bottom: 4.0rem;
  padding:       0 2.0rem;
}

/* ─── リード：お客様からのご相談（引用リスト） ─ */
.pt-quote-list {
  list-style:            none;
  padding:               0;
  margin:                0 0 4.0rem;
  display:               grid;
  grid-template-columns: 1fr 1fr;
  gap:                   2.0rem;
}
.pt-quote-list li {
  background:    #fff;
  border:        1px solid #d7deef;
  border-left:   4px solid var(--color-primary);
  border-radius: 8px;
  padding:       2.4rem 2.8rem;
  font-size:     1.7rem;
  line-height:   1.8;
  box-shadow:    var(--shadow-card);
}
.pt-quote-list li strong {
  display:        inline-block;
  color:          var(--color-primary);
  font-family:    var(--font-latin);
  font-size:      1.4rem;
  letter-spacing: 0.06em;
  margin-right:   0.4rem;
}
.pt-lead-turn {
  font-size:     2.2rem !important;
  font-weight:   700;
  color:         var(--color-navy);
  text-align:    center;
  line-height:   1.7;
  margin-bottom: 3.0rem !important;
}

/* ─── 箇条書き（共通） ───────────────────── */
.pt-bullets {
  list-style: none;
  padding:    0;
  margin:     0 0 2.0rem;
}
.pt-bullets > li {
  position:      relative;
  padding-left:  2.2rem;
  margin-bottom: 1.2rem;
  font-size:     1.6rem;
  line-height:   1.9;
}
.pt-bullets > li::before {
  content:       '';
  position:      absolute;
  left:          0;
  top:           0.95em;
  transform:     translateY(-50%);
  width:         0.8rem;
  height:        0.8rem;
  border-radius: 50%;
  background:    var(--color-primary);
}
.pt-bullets > li:last-child { margin-bottom: 0; }

/* ─── 関わり方 2カラム ───────────────────── */
.pt-cols {
  display:               grid;
  grid-template-columns: 1fr 1fr;
  gap:                   3.0rem;
  align-items:           stretch;
}
.pt-col {
  display:        flex;
  flex-direction: column;
  background:     #fff;
  border:         2px solid #d7deef;
  border-radius:  1.2rem;
  padding:        3.2rem 3.0rem;
  box-shadow:     var(--shadow-card);
}
.pt-col h3 {
  font-size:      2.2rem;
  font-weight:    700;
  color:          var(--color-primary);
  line-height:    1.5;
  margin-bottom:  1.8rem;
  padding-bottom: 1.4rem;
  border-bottom:  2px solid var(--color-accent);
}
.pt-col p {
  font-size:     1.55rem;
  line-height:   1.9;
  margin-bottom: 1.6rem;
}
.pt-col .pt-bullets {
  margin:      auto 0 0;
  padding-top: 1.8rem;
  border-top:  1px dotted var(--color-border);
}
.pt-col .pt-bullets > li { font-size: 1.5rem; line-height: 1.8; }
.pt-cols-note {
  margin-top:  3.0rem;
  text-align:  center;
  font-size:   1.8rem !important;
  font-weight: 700;
  color:       var(--color-primary);
  line-height: 1.8;
}

/* ─── 注記ボックス ───────────────────────── */
.pt-note {
  background:    var(--color-bg-blue-light);
  border-left:   4px solid var(--color-primary);
  border-radius: 0 8px 8px 0;
  padding:       2.0rem 2.6rem;
  font-size:     1.5rem !important;
  line-height:   1.85 !important;
  color:         #444;
  box-sizing:    border-box;
}

/* ─── 向いている案件 / 向かない案件 ───────── */
.pt-block {
  border-radius: 1.2rem;
  padding:       3.0rem 3.2rem;
  margin-bottom: 3.0rem;
}
.pt-block.pt-good { background: #eef3ff; border: 1px solid #c7deff; }
.pt-block.pt-bad  { background: #f5f5f5; border: 1px solid #ddd; }
.pt-block h3 {
  font-size:     2.0rem;
  font-weight:   700;
  line-height:   1.5;
  margin-bottom: 2.0rem;
}
.pt-block.pt-good h3 { color: var(--color-primary); }
.pt-block.pt-bad  h3 { color: #666; }
.pt-block.pt-bad .pt-bullets > li::before { background: #999; }

.pt-subhead {
  font-size:   1.8rem;
  font-weight: 700;
  color:       var(--color-navy);
  line-height: 1.5;
  margin:      3.0rem 0 1.4rem;
}

/* ─── 「要件が固まっていなくて構いません」 ─── */
.pt-highlight {
  background:    linear-gradient(135deg, var(--color-navy) 0%, var(--color-primary) 100%);
  border-radius: 1.2rem;
  padding:       4.0rem 4.2rem;
  margin:        4.0rem 0;
}
.pt-highlight h3 {
  font-size:      2.8rem;
  font-weight:    700;
  color:          #fff;
  line-height:    1.5;
  margin-bottom:  2.4rem;
  padding-bottom: 1.8rem;
  position:       relative;
}
.pt-highlight h3::after {
  content:       '';
  position:      absolute;
  left:          0;
  bottom:        0;
  width:         8.0rem;
  height:        0.6rem;
  border-radius: 1.0rem;
  background:    var(--color-accent);
}
.pt-highlight p {
  font-size:     1.7rem !important;
  line-height:   1.95 !important;
  color:         rgba(255,255,255,.95);
  margin-bottom: 1.6rem;
}
.pt-highlight p:last-child { margin-bottom: 0; }

/* ─── 導入までの流れ（6ステップ） ─────────── */
.pt-steps {
  list-style:    none;
  counter-reset: pt-step;
  padding:       0;
  margin:        0 0 3.0rem;
}
.pt-steps > li {
  counter-increment: pt-step;
  display:           flex;
  gap:               2.4rem;
  align-items:       center;
  font-size:         1.7rem;
  line-height:       1.8;
  margin-bottom:     2.2rem;
  padding-bottom:    2.2rem;
  border-bottom:     1px dotted var(--color-border);
}
.pt-steps > li:last-child {
  margin-bottom:  0;
  padding-bottom: 0;
  border-bottom:  none;
}
.pt-steps > li::before {
  content:         counter(pt-step);
  background:      var(--color-primary);
  color:           #fff;
  font-family:     var(--font-latin);
  font-size:       1.8rem;
  font-weight:     700;
  width:           4.8rem;
  height:          4.8rem;
  border-radius:   50%;
  display:         flex;
  align-items:     center;
  justify-content: center;
  flex-shrink:     0;
}

/* ─── お渡しできるもの ───────────────────── */
.pt-materials {
  list-style:            none;
  padding:               0;
  margin:                0;
  display:               grid;
  grid-template-columns: 1fr 1fr;
  gap:                   1.6rem;
}
.pt-materials > li {
  background:    #fff;
  border:        1px solid #e0e8f8;
  border-radius: 1.0rem;
  padding:       2.2rem 2.4rem;
  font-size:     1.55rem;
  line-height:   1.7;
  box-shadow:    var(--shadow-card);
}
.pt-materials > li a { font-weight: 700; }

/* ─── 最後に（全幅・中央寄せ・装飾なし） ──── */
#pt-closing { padding: 11.0rem 0; }
#pt-closing .pt-inner { text-align: center; }
#pt-closing p {
  font-size:     1.8rem !important;
  line-height:   2.2 !important;
  margin-bottom: 3.2rem !important;
}
#pt-closing p:last-child { margin-bottom: 0 !important; }

/* ─── 未確定箇所のプレースホルダー ───────── */
/* 公開前に必ず実数へ差し替えるか、この span ごと削除すること */
.pt-placeholder {
  display:       inline-block;
  background:    #fff7cc;
  border:        1px dashed #d4a800;
  border-radius: 0.4rem;
  padding:       0.2rem 0.8rem;
  font-size:     1.4rem;
  font-weight:   700;
  color:         #8a6d00;
  line-height:   1.6;
}

/* ─── ラジオ選択肢（選択肢の途中で改行させない） ─── */
#contact form dl dd .pt-radio-group {
  display:     flex;
  flex-wrap:   wrap;
  align-items: center;
  gap:         1.2rem 3.0rem;
}
/* ラベルを inline-flex にすることで、行末で丸と文字が分断されない。
   長い選択肢はラベル内で折り返すが、ラジオは常に文字の左に残る。 */
#contact form dl dd .pt-radio-group > label {
  display:     inline-flex;
  align-items: flex-start;
  gap:         0.6rem;
  max-width:   100%;
  cursor:      pointer;
}
#contact form dl dd .pt-radio-group input[type="radio"] {
  margin:      0.35em 0 0;  /* 1行目の文字に高さを合わせる */
  flex-shrink: 0;
}
/* 「その他」のテキスト欄はラジオ群の下に置く */
#contact form dl dd .pt-radio-group + input.short[type="text"] {
  margin-left: 0;
  margin-top:  1.4rem;
}

/* ─── お問い合わせセクションの見出し補足 ──── */
#contact .pt-contact-sub {
  text-align:    center;
  font-size:     1.6rem;
  line-height:   1.8;
  margin-bottom: 4.0rem;
  color:         var(--color-text-muted);
}

/* ════════════════════════════════════════════
   レスポンシブ: スマートフォン (〜750px)
   common.css で 1rem ≒ 1.333vw に縮むため文字を拡大
   ════════════════════════════════════════════ */
@media only screen and (max-width: 750px) {
  .pt-inner { width: 65.0rem; }
  .pt-sec   { padding: 11.0rem 0; }
  .pt-sec p { font-size: 2.5rem; }
  /* 長い見出しが画面端に張り付かないよう左右に余白を持たせる */
  .pt-sec > h2.h2-title,
  #contact > h2.h2-title { padding-left: 3.0rem; padding-right: 3.0rem; }

  /* SPの固定ヘッダーは 11.0rem あるため、ヒーロー上部の余白も合わせる */
  #pt-hero { padding-top: 11.0rem; padding-bottom: 10.0rem; }
  #pt-hero .breadcrumb  { font-size: 2.0rem; }
  #pt-hero h1           { font-size: 4.4rem; }
  #pt-hero .pt-hero-sub { font-size: 2.8rem; }

  .pt-quote-list { grid-template-columns: 1fr; }
  .pt-quote-list li        { font-size: 2.6rem; }
  .pt-quote-list li strong { font-size: 2.2rem; }
  .pt-lead-turn { font-size: 3.2rem !important; }

  .pt-bullets > li { font-size: 2.5rem; }

  .pt-cols { grid-template-columns: 1fr; gap: 4.0rem; }
  .pt-col h3 { font-size: 3.2rem; }
  .pt-col p  { font-size: 2.4rem; }
  .pt-col .pt-bullets > li { font-size: 2.4rem; }
  .pt-cols-note { font-size: 2.8rem !important; }

  .pt-note { font-size: 2.4rem !important; }

  .pt-block    { padding: 4.0rem 3.4rem; }
  .pt-block h3 { font-size: 3.0rem; }
  .pt-subhead  { font-size: 2.8rem; }

  .pt-highlight    { padding: 5.0rem 3.6rem; }
  .pt-highlight h3 { font-size: 3.6rem; }
  .pt-highlight p  { font-size: 2.6rem !important; }

  .pt-steps > li { font-size: 2.5rem; gap: 2.6rem; }
  .pt-steps > li::before { width: 7.0rem; height: 7.0rem; font-size: 2.8rem; }

  .pt-materials { grid-template-columns: 1fr; }
  .pt-materials > li { font-size: 2.5rem; }

  #pt-closing p { font-size: 2.8rem !important; }

  .pt-placeholder { font-size: 2.2rem; }

  #contact .pt-contact-sub { font-size: 2.6rem; }
}