.dtf-lp{
  --blue:#0064C8;
  --blue-d:#0a4fb0;
  --navy:#12237a;
  --red:#FF2D00;
  --red-d:#e02800;

  --ink:#2b2f38;
  --sub:#6a7280;
  --line:#d9e0ea;
  --line-d:#c4cedb;

  --bg:#ffffff;
  --bg-soft:#f1f5fb;
  --wrap:1120px;

  scroll-behavior:smooth;
  font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;
  color:var(--ink);
  background:var(--bg);
  line-height:1.8;
  font-size:15.5px;
  -webkit-font-smoothing:antialiased;
}

.dtf-lp *{
  box-sizing:border-box;
  margin:0;
  padding:0;
}

.dtf-lp .wrap{
  max-width:var(--wrap);
  margin:0 auto;
  padding:0 22px;
}

.dtf-lp > section{
  padding:60px 0;
}

.dtf-lp a{
  color:inherit;
  text-decoration:none;
}

.dtf-lp img{
  max-width:100%;
  display:block;
}

  /* 見出しバー */
  .dtf-lp .sec-head{text-align:center;margin-bottom:38px;}
  .dtf-lp .sec-bar{display:inline-block;background:var(--blue);color:#fff;font-weight:900;font-size:clamp(20px,3vw,29px);line-height:1.4;letter-spacing:.02em;padding:13px 40px;border-radius:6px;position:relative;}
  .dtf-lp .sec-bar::after{content:"";position:absolute;left:50%;bottom:-9px;transform:translateX(-50%);border-left:9px solid transparent;border-right:9px solid transparent;border-top:9px solid var(--blue);}
  .dtf-lp .sec-bar.navy{background:var(--navy);}
  .dtf-lp .sec-bar.navy::after{border-top-color:var(--navy);}
  .dtf-lp .sec-lead{
    color:var(--sub);
    font-size:14.5px;
    line-height:1.8;
    margin-top:22px;
    text-align:center;
  }

  .dtf-lp .kicker{text-align:center;color:var(--red);font-weight:900;font-size:clamp(17px,2.4vw,22px);margin-bottom:16px;display:flex;align-items:center;justify-content:center;gap:14px;}
  .dtf-lp .kicker::before, .dtf-lp .kicker::after{content:"";width:2px;height:26px;background:var(--red);}
  .dtf-lp .kicker::before{transform:rotate(-22deg);}
  .dtf-lp .kicker::after{transform:rotate(22deg);}

  /* ボタン */
  .dtf-lp .btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;background:var(--red);color:#fff;font-weight:900;font-size:17px;padding:19px 40px;border-radius:999px;box-shadow:0 6px 0 var(--red-d);transition:transform .1s ease,box-shadow .1s ease;border:none;cursor:pointer;}
  .dtf-lp .btn:hover{transform:translateY(2px);box-shadow:0 4px 0 var(--red-d);}
  .dtf-lp .btn:active{transform:translateY(6px);box-shadow:0 0 0 var(--red-d);}
  .dtf-lp .btn:focus-visible{outline:3px solid #ffb3a3;outline-offset:3px;}
  .dtf-lp .btn-sub{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:#fff;color:var(--blue);font-weight:700;font-size:15px;padding:15px 30px;border-radius:999px;border:2px solid var(--blue);transition:background .12s ease;}
  .dtf-lp .btn-sub:hover{background:#eef5fe;}
  .dtf-lp .btn-sub:focus-visible{outline:3px solid #9fc6f2;outline-offset:3px;}
  /* CTA縦積み・同幅で整列 */
  .dtf-lp .cta-col{display:flex;flex-direction:column;align-items:center;gap:14px;margin-top:32px;}
  .dtf-lp .cta-col .btn, .dtf-lp .cta-col .btn-sub{width:min(340px,100%);}

  /* ヘッダー */
  .dtf-lp .site-head{background:#fff;border-bottom:2px solid var(--blue);position:sticky;top:0;z-index:50;}
  .dtf-lp .site-head .wrap{display:flex;align-items:center;justify-content:space-between;height:60px;}
  .dtf-lp .logo-mock{display:flex;align-items:center;gap:9px;font-weight:900;color:var(--navy);font-size:20px;letter-spacing:.02em;font-style:italic;}
  .dtf-lp .logo-mock .dot{width:12px;height:12px;border-radius:3px;background:var(--blue);box-shadow:3px 0 0 var(--red);}
  .dtf-lp .head-note{font-size:11px;color:var(--sub);}

  /* FV */
  .dtf-lp .fv{background:var(--bg-soft);border-bottom:1px solid var(--line);padding:44px 0 52px;}
  .dtf-lp .fv-banner{background:#fff;border:1px solid var(--line-d);border-radius:10px;overflow:hidden;display:grid;grid-template-columns:1.02fr .98fr;box-shadow:0 2px 0 var(--line-d);}
  .dtf-lp .fv-copy{padding:44px 40px;display:flex;flex-direction:column;justify-content:center;}
  .dtf-lp .fv-tag{display:inline-block;align-self:flex-start;background:var(--navy);color:#fff;font-weight:700;font-size:12.5px;padding:6px 15px;border-radius:4px;margin-bottom:18px;letter-spacing:.03em;}
  #main .dtf-lp .fv h1{color:var(--navy);font-weight:900;font-size:clamp(28px,4.2vw,44px);line-height:1.32;letter-spacing:.01em;margin-bottom:18px;min-height:2.6em;border-left:none;padding-left:0;}
  .dtf-lp .fv h1 .hl{color:var(--blue);}
  .dtf-lp .fv h1 .u{background:linear-gradient(transparent 62%, #ffe14d 62%, #ffe14d 92%, transparent 92%);padding:0 2px;}
  .dtf-lp .fv-lead{font-size:15px;color:#3d4450;margin-bottom:6px;}
  .dtf-lp .fv-lead.s{font-size:13.5px;color:var(--sub);margin-bottom:24px;}
  .dtf-lp .fv-points{display:flex;gap:12px 22px;flex-wrap:wrap;margin-bottom:8px;padding-top:18px;border-top:1px dashed var(--line-d);}
  .dtf-lp .fv-points span{display:inline-flex;align-items:center;gap:8px;color:var(--navy);font-weight:900;font-size:15px;letter-spacing:.01em;}
  .dtf-lp .fv-points span::before{content:"✓";display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;flex:none;background:var(--blue);color:#fff;border-radius:50%;font-size:12px;font-weight:900;line-height:1;}
  .dtf-lp .fv-photo{background:repeating-linear-gradient(45deg,#e7edf5 0 14px,#eef3f9 14px 28px);display:flex;align-items:center;justify-content:center;min-height:340px;overflow:hidden;}
  .dtf-lp .fv-photo .ph-label{color:#7f8ca0;font-size:13px;font-weight:700;text-align:center;line-height:1.9;border:2px dashed #b7c3d3;background:rgba(255,255,255,.7);padding:16px 22px;border-radius:8px;}
  .dtf-lp .fv-photo img{width:100%;height:100%;object-fit:cover;}
  .dtf-lp .fv-catch{
  white-space:nowrap;
}

  /* お悩み */
  .dtf-lp .worry{max-width:700px;margin:0 auto;display:grid;gap:10px;}
  .dtf-lp .worry .row{display:flex;align-items:center;gap:14px;background:#fff;border:1px solid var(--line-d);border-left:5px solid var(--blue);border-radius:4px;padding:14px 20px;font-size:15px;font-weight:700;}
  .dtf-lp .worry .ck{flex:none;color:var(--blue);font-weight:900;font-size:18px;}
  .dtf-lp .worry-arrow{text-align:center;margin:22px 0 6px;color:var(--blue);font-size:22px;font-weight:900;line-height:1;}
  .dtf-lp .solve{text-align:center;font-weight:900;color:var(--navy);font-size:clamp(19px,2.8vw,26px);}
  .dtf-lp .solve b{color:var(--blue);border-bottom:4px solid #ffe14d;}

  /* メリット */
  .dtf-lp .merit-sec{background:var(--bg-soft);}
  .dtf-lp .cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
  .dtf-lp .card{background:#fff;border:1px solid var(--line-d);border-top:4px solid var(--blue);border-radius:6px;padding:26px 22px 24px;position:relative;}
  .dtf-lp .card .num{position:absolute;top:-4px;right:16px;color:#e3eaf3;font-weight:900;font-size:44px;line-height:1;font-style:italic;}
  .dtf-lp .card .ico{width:44px;height:44px;margin-bottom:12px;}
  .dtf-lp .card .ico svg{width:44px;height:44px;stroke:var(--blue);fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;}
  .dtf-lp .card h3{color:var(--navy);font-weight:900;font-size:18px;margin-bottom:9px;}
  .dtf-lp .card h3 .b{background:linear-gradient(transparent 60%, #ffe14d 60%);}
  .dtf-lp .card p{color:#4a5260;font-size:13.5px;line-height:1.75;}
  .dtf-lp .card .cau{display:block;margin-top:8px;color:var(--red);font-size:11.5px;}
  .dtf-lp .card.key{border-top-color:var(--red);background:#fffaf8;}

  /* ステップ */
  .dtf-lp .steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
  .dtf-lp .step{background:#fff;border:1px solid var(--line-d);border-radius:6px;padding:20px 16px;text-align:center;position:relative;}
  .dtf-lp .step .n{display:inline-block;background:var(--navy);color:#fff;font-weight:900;font-size:13px;padding:3px 12px;border-radius:999px;margin-bottom:12px;}
  .dtf-lp .step .figure{height:88px;border:1px solid var(--line);border-radius:6px;background:var(--bg-soft);display:flex;align-items:center;justify-content:center;margin-bottom:12px;}
  .dtf-lp .step .figure svg{width:48px;height:48px;stroke:var(--blue);fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;}
  .dtf-lp .step h4{color:var(--navy);font-weight:700;font-size:14.5px;margin-bottom:5px;}
  .dtf-lp .step p{color:var(--sub);font-size:12px;line-height:1.6;}
  .dtf-lp .step:not(:last-child)::after{content:"";position:absolute;right:-11px;top:50%;transform:translateY(-50%);width:0;height:0;border-left:11px solid var(--blue);border-top:8px solid transparent;border-bottom:8px solid transparent;z-index:2;}

  /* 比較表 */
/* 比較表 */
.dtf-lp .cmp-wrap{
  max-width:900px;
  margin:0 auto;
  overflow-x:auto;
}

.dtf-lp table.cmp{
  width:100%;
  min-width:620px;
  border-collapse:collapse;
  background:#fff;
  border:1px solid var(--line-d);
  font-size:14px;
}

.dtf-lp table.cmp th,
.dtf-lp table.cmp td{
  padding:13px 12px;
  text-align:center;
  border:1px solid var(--line);
}

/* ヘッダー */
.dtf-lp table.cmp thead th{
  background:var(--navy);
  color:#fff;
  font-weight:700;
}

.dtf-lp table.cmp thead th.dtf{
  background:var(--blue);
}

/* 左列：比較項目 */
.dtf-lp table.cmp td:first-child,
.dtf-lp table.cmp th:first-child{
  text-align:left;
  background:#f5f7fa;
  font-weight:900;
  color:var(--navy);
}

.dtf-lp table.cmp tbody td:first-child{
  padding-left:18px;
  font-size:15px;
}

/* DTF転写プリント列 */
.dtf-lp table.cmp td.dtf{
  background:#eaf3ff;
  color:var(--blue);
  font-size:16px;
  font-weight:900;
}

/* 注釈 */
.dtf-lp .cmp-note{
  max-width:900px;
  margin:16px auto 0;
  color:var(--sub);
  font-size:12.5px;
}

.dtf-lp .cmp-note a{
  color:var(--blue);
  font-weight:700;
  text-decoration:underline;
}

/* インクジェット比較 */
.dtf-lp .finish-compare{
  max-width:1000px;
  margin:0 auto;
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:28px;
}

.dtf-lp .finish-item{
  min-width:0;
}

.dtf-lp .finish-photo{
  margin:0;
  background:#fff;
  border:1px solid var(--line-d);
  border-radius:8px;
  overflow:hidden;
}

.dtf-lp .finish-photo img{
  width:100%;
  height:auto;
  display:block;
}

.dtf-lp .finish-photo figcaption{
  padding:11px 16px;
  text-align:center;
  color:#fff;
  background:var(--navy);
  font-size:15px;
  font-weight:900;
}

.dtf-lp .finish-item.dtf .finish-photo{
  border-top:4px solid var(--blue);
}

.dtf-lp .finish-item.inkjet .finish-photo{
  border-top:4px solid #8a97a8;
}

.dtf-lp .finish-item.inkjet .finish-photo figcaption{
  background:#7d8999;
}

.dtf-lp .finish-info{
  margin-top:18px;
  padding:20px 22px;
  background:#fff;
  border:1px solid var(--line-d);
  border-radius:6px;
}

.dtf-lp .finish-item.dtf .finish-info{
  border-top:4px solid var(--blue);
}

.dtf-lp .finish-item.inkjet .finish-info{
  border-top:4px solid #8a97a8;
}

.dtf-lp .finish-info h3{
  margin-bottom:8px;
  color:var(--navy);
  font-size:17px;
  font-weight:900;
}

.dtf-lp .finish-item.inkjet .finish-info h3{
  color:#4b5566;
}

.dtf-lp .finish-info p{
  color:#4a5260;
  font-size:13.5px;
  line-height:1.85;
}

.dtf-lp .finish-note{
  max-width:1000px;
  margin:16px auto 0;
  color:var(--sub);
  font-size:12px;
}

@media(max-width:760px){
  .dtf-lp .finish-compare{
    grid-template-columns:1fr;
    gap:32px;
  }
}

  /* ラインナップ */
  .dtf-lp .products{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;}
  .dtf-lp .prod{background:#fff;border:1px solid var(--line-d);border-radius:6px;overflow:hidden;display:flex;flex-direction:column;position:relative;}
  .dtf-lp .prod .thumb{aspect-ratio:1/1;background:var(--bg-soft);display:flex;align-items:center;justify-content:center;position:relative;border-bottom:1px solid var(--line);}
  .dtf-lp .prod .thumb .ph-label{color:#8695a8;font-size:12px;font-weight:700;text-align:center;border:2px dashed #bcc8d6;padding:10px 12px;border-radius:6px;background:#fff;}
  .dtf-lp .prod.soon .thumb{background:#f4f6f9;}
  .dtf-lp .prod .soon-badge{position:absolute;top:10px;right:10px;background:#8a97a8;color:#fff;font-weight:700;font-size:11px;padding:4px 11px;border-radius:4px;}
  .dtf-lp .prod .body{padding:16px;text-align:center;display:flex;flex-direction:column;flex:1;}
  .dtf-lp .prod h3{color:var(--navy);font-weight:900;font-size:16px;margin-bottom:4px;}
  .dtf-lp .prod .price{color:var(--sub);font-size:12.5px;margin-bottom:14px;}
  .dtf-lp .prod .price b{color:var(--red);font-size:16px;}
  .dtf-lp .prod .pbtn{margin-top:auto;display:block;background:var(--red);color:#fff;font-weight:900;font-size:13.5px;padding:12px 0;border-radius:999px;box-shadow:0 4px 0 var(--red-d);}
  .dtf-lp .prod .pbtn.dis{background:#c7cfda;color:#fff;box-shadow:none;pointer-events:none;}

  /* データ注意 */
  .dtf-lp .cau-sec{background:var(--bg-soft);}
  .dtf-lp .cautions{max-width:900px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
  .dtf-lp .cau-card{background:#fff;border:1px solid var(--line-d);border-top:4px solid var(--red);border-radius:6px;padding:22px 20px;text-align:center;}
  .dtf-lp .cau-card .ico{width:42px;height:42px;margin:0 auto 12px;}
  .dtf-lp .cau-card .ico svg{width:42px;height:42px;stroke:var(--red);fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;}
  .dtf-lp .cau-card h4{color:var(--navy);font-weight:900;font-size:15px;margin-bottom:6px;}
  .dtf-lp .cau-card p{color:#4a5260;font-size:12.5px;line-height:1.7;}

  /* 用途 */
/* 用途 */
.dtf-lp .uses{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}

.dtf-lp .use{
  background:#fff;
  border:1px solid var(--line-d);
  border-top:4px solid var(--blue);
  border-radius:6px;
}

.dtf-lp .use .txt{
  padding:22px 20px 20px;
}

.dtf-lp .use .tag{
  display:inline-block;
  margin-bottom:10px;
  padding:3px 11px;
  background:var(--blue);
  color:#fff;
  border-radius:4px;
  font-size:11px;
  font-weight:700;
}

.dtf-lp .use h4{
  margin-bottom:6px;
  color:var(--navy);
  font-size:16px;
  font-weight:900;
  line-height:1.6;
}

.dtf-lp .use p{
  color:var(--sub);
  font-size:13px;
  line-height:1.7;
}

  /* FAQ */
  .dtf-lp .faq{max-width:780px;margin:0 auto;display:grid;gap:10px;}
  .dtf-lp .faq details{background:#fff;border:1px solid var(--line-d);border-radius:6px;overflow:hidden;}
  .dtf-lp .faq summary{list-style:none;cursor:pointer;padding:17px 20px;font-weight:700;color:var(--navy);font-size:14.5px;display:flex;align-items:flex-start;gap:12px;}
  .dtf-lp .faq summary::-webkit-details-marker{display:none;}
  .dtf-lp .faq summary .q{flex:none;width:24px;height:24px;border-radius:4px;background:var(--navy);color:#fff;font-weight:900;font-size:13px;display:flex;align-items:center;justify-content:center;}
  .dtf-lp .faq summary .tgl{margin-left:auto;flex:none;color:var(--blue);font-weight:900;font-size:18px;line-height:1;transition:transform .2s ease;}
  .dtf-lp .faq details[open] summary .tgl{transform:rotate(45deg);}
  .dtf-lp .faq details[open] summary{border-bottom:1px solid var(--line);}
  .dtf-lp .faq .a{padding:15px 20px 17px 56px;color:#4a5260;font-size:13.5px;line-height:1.85;}
  .dtf-lp .faq .a .qa{color:var(--red);font-weight:900;margin-right:6px;}

  /* 最終CTA */
  .dtf-lp .final{background:var(--navy);color:#fff;text-align:center;}
  .dtf-lp .final h2{color:#fff;font-weight:900;font-size:clamp(23px,3.4vw,34px);line-height:1.4;margin-bottom:12px;}
  .dtf-lp .final p{color:#c9d4ee;font-size:14.5px;margin-bottom:8px;}
  .dtf-lp .final p .hl{color:#ffe14d;}
  .dtf-lp .final .kicker{color:#ffe14d;}
  .dtf-lp .final .kicker::before, .dtf-lp .final .kicker::after{background:#ffe14d;}
  .dtf-lp .final .btn-sub{background:transparent;color:#fff;border-color:rgba(255,255,255,.65);}
  .dtf-lp .final .btn-sub:hover{background:rgba(255,255,255,.12);}
  .dtf-lp .final h2 + p{
  text-align:center;
  margin-left:auto;
  margin-right:auto;
}

  /* 実装メモ */
  .dtf-lp .impl{max-width:var(--wrap);margin:26px auto 64px;padding:0 22px;}
  .dtf-lp .impl-inner{background:#fff8f6;border:2px solid var(--red);border-radius:8px;padding:24px 28px;}
  .dtf-lp .impl h3{color:var(--red);font-size:16px;font-weight:900;margin-bottom:12px;}
  .dtf-lp .impl li{font-size:13px;margin:0 0 9px 1.3em;line-height:1.7;}
  .dtf-lp .impl b{color:var(--navy);}
  .dtf-lp .impl code{background:#fdeae5;padding:1px 6px;border-radius:3px;font-size:12px;}
  .dtf-lp .site-foot{background:#eef3fa;border-top:1px solid var(--line);text-align:center;padding:24px;color:var(--sub);font-size:12px;}

  @media(max-width:900px){

  .dtf-lp .cards,
  .dtf-lp .cautions,
  .dtf-lp .uses{
    grid-template-columns:1fr 1fr;
  }

  .dtf-lp .products{
    grid-template-columns:1fr 1fr;
  }

  .dtf-lp .steps{
    grid-template-columns:1fr 1fr;
    gap:22px;
  }

  .dtf-lp .step:not(:last-child)::after{
    display:none;
  }

}

@media(max-width:760px){

  .dtf-lp .fv-catch{
  white-space:normal;
  }

  .dtf-lp > section{
    padding:46px 0;
  }

  .dtf-lp .fv-banner{
    grid-template-columns:1fr;
  }

  .dtf-lp .fv-photo{
    order:-1;
    min-height:240px;
  }

  .dtf-lp .fv-copy{
    padding:30px 26px;
  }

  #main .dtf-lp .fv h1{
    min-height:auto;
  }

  .dtf-lp .finish-compare{
    grid-template-columns:1fr;
    gap:32px;
  }

}

@media(max-width:520px){

  .dtf-lp .cards,
  .dtf-lp .cautions,
  .dtf-lp .uses,
  .dtf-lp .products{
    grid-template-columns:1fr;
  }

  .dtf-lp .btn{
    width:100%;
    padding:18px 20px;
  }

}

@media (prefers-reduced-motion: reduce){

  .dtf-lp *{
    scroll-behavior:auto;
    transition:none!important;
  }

}

