/* ===== FLOW page (scoped by wrapper) ===== */
#flow-page.flow-page .flow-page-section{ background: var(--color-white); }

/* JSで .anim が発火しない場合でも「見出しが薄くなる」事故を防ぐ */
#flow-page.flow-page .flow-page-section .anim{
  opacity: 1 !important;
  transform: none !important;
}

/* Intro（見出しデザインは維持：あなたのHTML構造前提） */
#flow-page.flow-page .flow-page-intro{
  text-align:center;
  margin-bottom:70px;
}
#flow-page.flow-page .flow-page-intro-label{
  font-family:'Oswald',sans-serif;
  font-size:12px;
  font-weight:600;
  letter-spacing:.3em;
  color:var(--color-primary);
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin-bottom:16px;
}
#flow-page.flow-page .flow-page-intro-line{
  display:block;
  width:30px;
  height:1px;
  background:var(--color-primary);
}
#flow-page.flow-page .flow-page-intro-title{
  font-size:clamp(26px,3.5vw,38px);
  font-weight:900;
  color:var(--color-dark);
}
#flow-page.flow-page .flow-page-intro-title .accent{ color: var(--color-primary); }
#flow-page.flow-page .flow-page-intro-desc{
  font-size:14px;
  color:var(--color-gray);
  margin-top:12px;
}

/* Timeline */
#flow-page.flow-page .flow-timeline{
  position: relative;
  max-width: 900px;
  margin: 0 auto;
}
#flow-page.flow-page .flow-timeline::before{
  content:'';
  position:absolute;
  left:60px;
  top:80px;
  bottom:80px;
  width:3px;
  background:linear-gradient(to bottom, var(--color-primary) 0%, rgba(230,0,18,0.2) 100%);
}

#flow-page.flow-page .flow-tl-item{
  display:grid;
  grid-template-columns:120px 1fr;
  align-items:start;
  margin-bottom:60px;
  position:relative;
}
#flow-page.flow-page .flow-tl-item:last-child{ margin-bottom:0; }

#flow-page.flow-page .flow-tl-left{
  display:flex;
  flex-direction:column;
  align-items:center;
  padding-top:0;
}

#flow-page.flow-page .flow-tl-num{
  width:80px;
  height:80px;
  background:var(--color-primary);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  position:relative;
  z-index:1;
}
#flow-page.flow-page .flow-tl-num::after{
  content:'';
  position:absolute;
  right:-12px;
  top:50%;
  transform:translateY(-50%);
  border-top:8px solid transparent;
  border-bottom:8px solid transparent;
  border-left:12px solid var(--color-primary);
}
#flow-page.flow-page .flow-tl-num .step-label{
  font-family:'Oswald',sans-serif;
  font-size:9px;
  font-weight:600;
  color:rgba(255,255,255,0.7);
  letter-spacing:0.15em;
  line-height:1;
}
#flow-page.flow-page .flow-tl-num .step-digit{
  font-family:'Oswald',sans-serif;
  font-size:32px;
  font-weight:700;
  color:var(--color-white);
  line-height:1;
}

#flow-page.flow-page .flow-tl-content{
  background:var(--color-light-gray);
  padding:36px 40px;
  margin-left:28px;
  position:relative;
}
#flow-page.flow-page .flow-tl-content::before{
  content:'';
  position:absolute;
  left:-20px;
  top:28px;
  border-top:12px solid transparent;
  border-bottom:12px solid transparent;
  border-right:20px solid var(--color-light-gray);
}

#flow-page.flow-page .flow-tl-content-inner{
  display:grid;
  grid-template-columns:1fr auto;
  gap:30px;
  align-items:start;
}

#flow-page.flow-page .flow-tl-title{
  font-size:clamp(18px, 2.5vw, 24px);
  font-weight:900;
  color:var(--color-dark);
  margin-bottom:12px;
  display:flex;
  align-items:center;
  gap:12px;
}
#flow-page.flow-page .flow-tl-title i{
  color:var(--color-primary);
  font-size:18px;
}
#flow-page.flow-page .flow-tl-desc{
  font-size:14px;
  color:var(--color-gray);
  line-height:1.9;
}

#flow-page.flow-page .flow-tl-points{
  margin-top:16px;
  display:flex;
  flex-direction:column;
  gap:8px;
}
#flow-page.flow-page .flow-tl-point{
  display:flex;
  align-items:flex-start;
  gap:8px;
  font-size:13px;
  color:var(--color-dark);
}
#flow-page.flow-page .flow-tl-point i{
  color:var(--color-primary);
  font-size:11px;
  margin-top:4px;
  flex-shrink:0;
}

#flow-page.flow-page .flow-tl-img{
  width:200px;
  height:140px;
  object-fit:cover;
  flex-shrink:0;
  display:block;
}

/* Note box */
#flow-page.flow-page .flow-note-box{
  background:rgba(230,0,18,0.05);
  border:1px solid rgba(230,0,18,0.2);
  padding:24px 28px;
  margin-top:60px;
  display:flex;
  gap:16px;
  align-items:flex-start;
}
#flow-page.flow-page .flow-note-box i{
  color:var(--color-primary);
  font-size:20px;
  flex-shrink:0;
  margin-top:2px;
}
#flow-page.flow-page .flow-note-box div{
  font-size:14px;
  color:var(--color-dark);
  line-height:1.8;
}
#flow-page.flow-page .flow-note-box strong{ color:var(--color-primary); }

/* SP */
@media (max-width: 768px){
  #flow-page.flow-page .flow-timeline::before{ left:40px; }
  #flow-page.flow-page .flow-tl-item{ grid-template-columns:80px 1fr; }
  #flow-page.flow-page .flow-tl-num{ width:60px; height:60px; }
  #flow-page.flow-page .flow-tl-num .step-digit{ font-size:24px; }
  #flow-page.flow-page .flow-tl-num::after{ right:-10px; }
  #flow-page.flow-page .flow-tl-content{ padding:20px; margin-left:20px; }
  #flow-page.flow-page .flow-tl-content-inner{ grid-template-columns:1fr; }
  #flow-page.flow-page .flow-tl-img{ width:100%; height:180px; }
}
.cta-box img {
  display: block;
  margin: 0 auto 10px;
}