/* 175（2026-10-09）MIEKATA 制作実績：制作前の背景・課題 → 制作の意図＋実際の画面。影なし・16px以上（600px以下は14px以上） */
html body .wk175{display:grid;gap:28px;margin-top:8px}
html body .wk175-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:12px 24px;padding-bottom:18px;border-bottom:2px solid #102650}
html body .wk175-label{flex-basis:100%;margin:0!important;font-size:16px;font-weight:700;color:#2448d8}
html body .wk175-head h3{margin:0!important;font-size:clamp(26px,2.6vw,34px)!important;line-height:1.3;color:#102650}
html body .wk175-site{display:inline-flex;align-items:center;gap:8px;padding:10px 18px;border-radius:999px;border:1.5px solid #102650;color:#102650!important;font-size:16px;font-weight:700;text-decoration:none!important;transition:background-color .2s,color .2s}
html body .wk175-site:hover{background:#102650;color:#fff!important}

/* BEFORE */
html body .wk175-before{padding:28px 32px;border-radius:20px;background:#f4f5fb;border:1.5px dashed #dfe6f2}
html body .wk175-tag{display:inline-block;margin:0 0 10px!important;padding:4px 12px;border-radius:999px;background:#102650;color:#fff;font:700 14px/1.4 Arial,'Noto Sans JP',sans-serif;letter-spacing:.06em}
html body .wk175-before h4{margin:0 0 18px!important;font-size:22px!important;line-height:1.5;color:#102650}
html body .wk175-before ul{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:0!important;padding:0!important;list-style:none}
html body .wk175-before li{position:relative;margin:0!important;padding:16px 18px 18px!important;border-radius:20px 20px 20px 8px;background:#fff;border:1px solid #dfe6f2}
html body .wk175-before li::before{display:none!important}
html body .wk175-before li b{display:block;margin-bottom:6px;font-size:18px;color:#102650}
html body .wk175-before li span{display:block;font-size:16px;line-height:1.75;color:#102650}
html body .wk175-sub{margin:16px 0 0!important;font-size:16px;line-height:1.8;color:#102650}

/* だから、こうつくりました */
html body .wk175-turn{position:relative;margin:0!important;text-align:center}
html body .wk175-turn span{display:inline-flex;align-items:center;gap:10px;padding:10px 24px;border-radius:999px;background:linear-gradient(90deg,#2448d8,#2448d8);color:#fff;font-size:18px;font-weight:700}
html body .wk175-turn span::after{content:'↓';font-weight:700}

/* 制作の意図：2×2（画像＋文） */
html body .wk175-steps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin:0!important;padding:0!important;list-style:none}
html body .wk175-step{display:flex;flex-direction:column;margin:0!important;padding:0!important;border-radius:20px;background:#fff;border:1.5px solid #dfe6f2;overflow:hidden}
html body .wk175-step::before{display:none!important}
html body .wk175-shot{margin:0!important;aspect-ratio:2/1;overflow:hidden;background:#eef1fb;border-bottom:1px solid #dfe6f2}
html body .wk175-shot img{display:block;width:100%!important;height:100%!important;max-width:none!important;object-fit:cover;object-position:top center;transition:transform .5s cubic-bezier(.22,1,.36,1)}
@media(hover:hover){html body .wk175-step:hover .wk175-shot img{transform:scale(1.03)}}
html body .wk175-text{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;align-items:baseline;padding:20px 22px 24px}
html body .wk175-no{grid-row:1/3;font:700 28px/1 Arial,sans-serif;color:#2448d8}
html body .wk175-text h4{margin:0!important;font-size:20px!important;line-height:1.5;color:#102650}
html body .wk175-text p{margin:6px 0 0!important;font-size:16px;line-height:1.85;color:#102650}
html body .wk175-note{margin:0!important;font-size:14px;line-height:1.7;color:#4b5375}
@media(min-width:601px){html body .wk175-note{font-size:16px}}

@media(max-width:900px){
  html body .wk175-before ul{grid-template-columns:1fr}
  html body .wk175-steps{grid-template-columns:1fr}
}
@media(max-width:600px){
  html body .wk175-before{padding:20px 16px}
  html body .wk175-before h4{font-size:18px!important}
  html body .wk175-before li span,html body .wk175-sub,html body .wk175-text p{font-size:14px}
  html body .wk175-turn span{font-size:16px;padding:8px 18px}
  html body .wk175-text{padding:16px}
  html body .wk175-text h4{font-size:18px!important}
  html body .wk175-no{font-size:22px}
}
@media(min-width:601px){html body .wk175-tag{font-size:16px}}