@import "./../../common/mini-reset.css";
@import "./../../common/base.css";

body{
  margin: 50px;
}

h1, h2 {
  margin-block: 20px;
}

.sns-list{
  margin-block-start: 1.25rem;
  display: flex;
  flex-flow: row nowrap;
  gap: 1rem;

  .sns{
    display: block;
    inline-size: 1.875rem;
    aspect-ratio: 1/1;
    background-image: url("./../../assets/sprite/sns.png");
  }

  .facebook{
    background-position: 0 0;
  }

  .instagram{
    background-position: 50% 0;
  }

  .youtube{
    background-position: 100% 0;
  }
}

.icon-list{
  display: flex;
  flex-flow: row nowrap;
  gap: 1rem;

  a{
    display: block;
    inline-size: 3rem;
    aspect-ratio: 1/1;
    color: rgb(57, 176, 57);
  }
}

.svg-container{
  width: 80px;
  aspect-ratio: 1/1;
  color: red;
}