@charset "utf-8";
/* =========================================================
   lc-footer-sns.css
   共通フッターのSNSボタン（Instagram）
   - 全ページで読み込む（functions.php / lc_footer_sns_head）
   - 他社が編集する custom.css とは分離して衝突を避ける

   ★配色は currentColor に委ねる：
     フッターは restyle スキン適用時は濃紺(#0f1c2e / リンク #a9b8d0)、
     スキン無しのページは薄グレー(#f2f2f2 / リンク濃色)。
     色を固定するとどちらかで破綻するため、
     テーマ側が決めたリンク色を継承して明暗どちらでも成立させる。
   ========================================================= */

.lc-ig-svg{
  width:1em;
  height:1em;
  fill:currentColor;
  display:block;
}

/* ---------- 配置：会社情報（住所）の下 ---------- */
.box-footer-01 .footer-wrap .footer-info .lc-sns{
  margin-top:26px;
}

/* ---------- 見出し ---------- */
.box-footer-01 .footer-wrap .footer-info .lc-sns .lc-sns-ttl{
  font-family:"Open Sans",sans-serif;
  font-size:1.1rem;
  font-weight:700;
  letter-spacing:.18em;
  opacity:.7;
  margin:0 0 12px;
}

/* ---------- アイコン（円形・横並び。SNS追加時はliを足すだけ） ---------- */
.lc-sns .lc-sns-list{
  display:flex;
  justify-content:center;
  gap:12px;
  list-style:none;
  margin:0;
  padding:0;
}
.lc-sns .lc-sns-list > li::before{
  content:none;
}
.lc-sns .lc-sns-list a{
  display:flex;
  align-items:center;
  justify-content:center;
  width:48px;
  height:48px;
  border-radius:50%;
  background:transparent;
  border:1px solid currentColor;                              /* 非対応ブラウザ用 */
  border-color:color-mix(in srgb, currentColor 45%, transparent);
  font-size:21px;
  opacity:.85;
  -webkit-transition:opacity .25s ease,border-color .25s ease,-webkit-transform .25s ease;
  transition:opacity .25s ease,border-color .25s ease,transform .25s ease;
}
.lc-sns .lc-sns-list a:hover,
.lc-sns .lc-sns-list a:focus-visible{
  opacity:1;
  border-color:currentColor;
  -webkit-transform:translateY(-2px);
  transform:translateY(-2px);
}

/* ---------- モバイル ---------- */
@media screen and (max-width:768px){
  .box-footer-01 .footer-wrap .footer-info .lc-sns{
    margin-top:20px;
  }
  .lc-sns .lc-sns-list a{
    width:44px;
    height:44px;
    font-size:19px;
  }
}
