:root{--brand:#d71920;--brand-deep:#a90f17;--accent:#ffbd2e;--cta:#d71920;--pale:#fff1f2;--ink:#1e1f29}
html{background-color:var(--brand-deep)}
.sec_02{background-color:var(--brand-deep)}
.sec_03{background-color:color-mix(in srgb,var(--accent) 38%,white)}
.sec_04{background-color:var(--pale)}
#sec_07{background-color:var(--pale)}
.ansin{background-color:var(--pale)}
.step_title{color:var(--brand)}
.sec_06_h2,.q_box{background-color:var(--brand-deep)}
.qa_contents{border-color:var(--brand-deep)}
#sec_07 h2{background-color:var(--brand-deep)}
.form_lead{color:var(--brand-deep)}
.footer{background-color:var(--brand-deep)}

/* レッド固有のCSSワードマーク */
.brand-red-mark{
  display:grid;
  width:42px;
  height:42px;
  flex:0 0 42px;
  place-items:center;
  color:#fff;
  background:var(--brand);
  border:3px solid var(--ink);
  border-radius:11px;
  box-shadow:3px 3px 0 var(--ink);
  font-size:25px;
  line-height:1;
}
.header_right{width:46%}
.header_tel{width:100%}
.header_tel span{font-size:12px}
.header_tel strong{font-size:clamp(14px,3.6vw,20px)}

/* ④ ご相談から作業完了までの流れ */
.step_box{
  display:grid;
  grid-template-columns:38% minmax(0,1fr);
  grid-template-rows:auto 1fr;
  column-gap:1rem;
  align-items:center;
  width:100%;
  padding:2.75rem 1rem 1.5rem;
  text-align:left;
  writing-mode:horizontal-tb;
}
.step_number{
  position:absolute;
  top:0;
  left:20%;
  width:20%;
  transform:translate(-50%,-50%);
  font-size:clamp(1.45rem,6vw,2.7rem);
  line-height:1;
  text-align:center;
  white-space:nowrap;
  writing-mode:horizontal-tb;
}
.step_box img{
  grid-column:1;
  grid-row:1 / 3;
  width:100%;
  margin:0;
  writing-mode:horizontal-tb;
}
.step_box h3{
  grid-column:2;
  grid-row:1;
  margin:0 0 .5rem;
  font-size:clamp(1.35rem,5vw,2.2rem);
  line-height:1.35;
  word-break:normal;
  writing-mode:horizontal-tb;
}
.step_box p{
  grid-column:2;
  grid-row:2;
  margin:0;
  word-break:normal;
  writing-mode:horizontal-tb;
}

/* FV 主見出し */
.fv h1{
  position:relative;
  display:inline-block;
  width:100%;
  margin:7% 0 0;
  padding:.18em .28em .25em;
  color:var(--accent);
  background:#fff;
  border:4px solid var(--ink);
  border-radius:18px;
  box-shadow:5px 7px 0 var(--ink);
  font-size:clamp(34px,8.5vw,58px);
  line-height:1.12;
  letter-spacing:0;
  word-break:keep-all;
  overflow-wrap:normal;
  transform:rotate(-2deg);
}
.fv h1::before,
.fv h1::after{
  position:absolute;
  left:18%;
  width:0;
  height:0;
  content:"";
  border-right:16px solid transparent;
  border-left:16px solid transparent;
}
.fv h1::before{
  bottom:-24px;
  border-top:24px solid var(--ink);
}
.fv h1::after{
  bottom:-16px;
  margin-left:3px;
  border-top:19px solid #fff;
  border-right-width:13px;
  border-left-width:13px;
}
.fv-board{font-size:clamp(15px,3.9vw,25px)!important}
.fv-copy-side{width:44%;max-width:44%}
.fv-lead{
  font-size:clamp(9px,1.85vw,12px)!important;
  white-space:nowrap;
}
.fv-tags{grid-template-columns:repeat(2,minmax(0,1fr))}
.fv-tags li:nth-child(n+4){grid-column:auto}
.fv-tags li:last-child{grid-column:1 / -1}

/* FV 月桂樹バッジ */
.laurel::before{
  position:absolute;
  z-index:0;
  inset:17%;
  content:"";
  background:#fff;
  border-radius:50%;
}
.laurel img{z-index:1}
.laurel strong{
  position:relative;
  z-index:2;
  max-width:62%;
  color:var(--brand-deep);
  font-size:clamp(10px,2.8vw,18px);
  font-weight:900;
  line-height:1.15;
  word-break:keep-all;
}

/* ① 悩み見出しとお任せ帯 */
.trouble-title{
  word-break:keep-all;
  overflow-wrap:normal;
}
.nayami_grid figcaption{
  display:flex;
  min-height:3.65em;
  align-items:center;
  justify-content:center;
  font-size:clamp(14px,3.6vw,23px);
  line-height:1.25;
  word-break:keep-all;
  overflow-wrap:normal;
}
.nayami_grid figcaption span{display:block}
.omakase>div{width:76%;padding-top:30px}
.omakase strong{font-size:clamp(23px,5.8vw,38px)}

/* 共通電話CTA */
.tel_btn{
  background:var(--cta);
  box-shadow:0 5px 0 var(--brand-deep);
}
.tel_btn span{background:var(--brand-deep)}
.tel_btn strong{
  color:#fff;
  font-size:clamp(31px,8.1vw,52px);
  font-weight:900;
  line-height:1.12;
  white-space:nowrap;
  paint-order:stroke fill;
  -webkit-text-stroke:clamp(1px,.3vw,2px) var(--ink);
}
.tel_btn strong i{
  color:#fff;
  font-style:normal;
  -webkit-text-stroke:0;
}
.tel_btn small{
  display:block;
  font-size:clamp(11px,2.8vw,15px);
  line-height:1.3;
  letter-spacing:-.02em;
  white-space:nowrap;
}

/* ② 事例の相談チップ */
.jirei_sub_icon{
  padding:.4rem 1.2rem;
  font-size:14px;
}
.sec_02>.banner-title{
  background:var(--brand-deep);
  font-size:clamp(24px,6vw,39px);
  word-break:keep-all;
  overflow-wrap:normal;
}

/* ⑤ 料金目安 */
.price-inner{padding:20px 14px 30px}
.price-lead{
  margin:0 6px 22px!important;
  color:var(--brand-deep);
  font-weight:700;
  text-align:center;
}
.price-list{display:grid;gap:14px}
.price-card{
  display:grid;
  min-height:142px;
  padding:14px;
  background:#fff;
  border:4px solid var(--ink);
  border-radius:18px;
  grid-template-columns:125px minmax(0,1fr);
  align-items:center;
  gap:16px;
}
.price-card h3{
  display:flex;
  width:118px;
  height:118px;
  margin:0;
  padding:9px;
  align-items:center;
  justify-content:center;
  color:var(--ink);
  background:var(--accent);
  border:3px solid var(--ink);
  border-radius:50%;
  font-size:clamp(17px,4vw,23px);
  line-height:1.15;
  text-align:center;
  flex-direction:column;
}
.price-card div{display:grid;gap:4px}
.price-card p{font-weight:900}
.price-card strong{font-size:clamp(22px,5vw,31px)}
.price-card span{color:var(--brand);font-size:clamp(21px,5vw,30px);font-weight:900}
.price-card h3 strong{
  font-size:clamp(22px,5vw,30px);
  font-weight:900;
  line-height:1;
}
.price-card h3 span{
  color:var(--ink);
  font-size:clamp(12px,2.8vw,16px);
  font-weight:700;
  line-height:1.15;
}
.price-card:last-child h3 strong{font-size:clamp(14px,3.5vw,20px)}
.price-note{margin:18px 5px 0!important}

/* ⑦ 電話CTA再掲 */
.contact-call{padding:14px 20px 26px}
.contact-text-link{
  display:block;
  margin-top:18px;
  color:var(--brand-deep)!important;
  font-weight:900;
  text-align:center;
  text-decoration:underline;
}

/* 下部固定CTAは電話だけ */
.bottom_tel{width:100%}

.footer strong{display:block;font-size:20px}
.footer p{margin-top:7px!important}

@media(max-width:480px){
  .header_logo{min-width:0}
  .brand-name{font-size:11px}
  .brand-red-mark{width:34px;height:34px;flex-basis:34px;font-size:21px}
  .header_right{width:47%}
  .header_tel strong{font-size:13px}
  .fv-copy-side{width:54%;max-width:54%}
  .fv-tags li{padding:2px 3px;font-size:11px}
  .price-card{grid-template-columns:96px minmax(0,1fr);gap:11px}
  .price-card h3{width:90px;height:90px}
}