/* =====================================
   SNSアイコン用スタイル
   ファイル名: sns.css
===================================== */

/* 親要素を横並びに */
.sns {
  display: flex;
  align-items: center;  /* 縦中央揃え */
  gap: 8px;             /* アイコン間の1マス程度の空白 */
}

/* アイコンサイズを統一 */
.sns img {
  width: 30px;   /* 好みに応じて調整 */
  height: auto;
  display: block; /* imgの余白を除去 */
}

/* ホバー効果 */
.sns_hov:hover {
  opacity: 0.7;           /* 少し透明になる */
  transform: scale(1.1);  /* 少し拡大 */
  transition: 0.2s;       /* スムーズに変化 */
}

/* レスポンシブ対応（スマホなどでアイコンが大きすぎないように） */
@media (max-width: 480px) {
  .sns img {
    width: 24px;
  }
}