// --------------------------------------------------
// 共通ファイル読み込み
// --------------------------------------------------
@use "common" as *;

// --------------------------------------------------
// snsセクション固有スタイル
// --------------------------------------------------

.sns {

  &__container {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  &__shop-logo {
    margin-top: 150px;

    // SP版
    @include mq() {
      width: getVw(281);
      margin-top: getVw(200);
    }
  }

  &__icons {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin-top: 70px;
    width: 40.9%;

    // SP版
    @include mq() {
      width: getVw(600);
      margin-top: getVw(100);
    }
  }

  &__icon {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: getRatio(100, 558);

    // SP版
    @include mq() {
      width: getRatio(150, 600);
    }
  }

  &__text {
    margin-top: 1rem;
    font-size: 1.8rem;
    line-height: 1.6em;
    color: #414141;

    // SP版
    @include mq() {
      font-size: getVw(14, 375);
      margin-top: getVw(10);
    }
  }
}