/* =========================================================
   SOTORIE 公式LINE 設置用バナー 共通CSS
   資料: LINE構築/SOTORIE公式LINEバナー.html（成重対応）
   設置: A=診断(施工事例/ブログ/外構ガイド) B=離脱受け皿(相談フォーム下) C=保証(アフター)
   ========================================================= */
.stl-wrap{
  max-width:680px;margin:44px auto;padding:0 20px;box-sizing:border-box;
}
.stl-banner{
  display:block;border:1px solid #dcdbd9;background:#fff;
  padding:28px 26px;text-decoration:none;color:#201f1d;
  font-family:"Noto Sans JP",sans-serif;
  transition:background .22s,border-color .22s;
}
.stl-banner:hover{background:#faf9f8;border-color:#201f1d}
.stl-quiet{
  display:block;border-top:1px solid #e0dfdd;
  padding:24px 0 6px;text-decoration:none;color:#201f1d;
  font-family:"Noto Sans JP",sans-serif;transition:opacity .22s;
}
.stl-quiet:hover{opacity:.72}
.stl-en{
  font-size:10px;letter-spacing:.24em;color:#a19f9b;
  display:block;margin-bottom:11px;font-weight:600;
}
.stl-title{
  font-size:19px;font-weight:500;letter-spacing:.01em;
  display:block;margin-bottom:11px;line-height:1.5;
}
.stl-title-sm{
  font-size:16px;font-weight:500;letter-spacing:.01em;
  display:block;margin:0 0 9px;line-height:1.55;
}
.stl-desc{
  font-size:13px;font-weight:300;color:#5c5a56;
  display:block;line-height:1.9;margin-bottom:7px;
}
.stl-meta{
  font-size:11px;color:#a19f9b;font-weight:300;
  display:block;margin-top:15px;
}
.stl-arrow{
  font-size:12px;color:#201f1d;font-weight:500;
  display:block;margin-top:17px;letter-spacing:.04em;
}
.stl-quiet .stl-arrow{text-decoration:underline;text-underline-offset:3px}
/* 相談フォームページ: 電話カードとの間に余白を確保 */
.stl-quiet--contact{margin-top:44px}
@media(max-width:520px){
  .stl-banner{padding:22px 18px}
  .stl-title{font-size:17px}
}