a {
  width: 50px;
  height: 50px;
  /* background-color: blue; */
}
.f1 {
  font-family: "Comic Neue", cursive;
}

.f2 {
  font-family: "Ubuntu", sans-serif;
}

.f3 {
  font-family: "Titillium Web", sans-serif;
}

.f4 {
  font-family: "Cairo", sans-serif;
}

.f5 {
  font-family: "Dosis", sans-serif;
}

.f6 {
  font-family: "Teko", sans-serif;
  font-weight: lighter;
}

.f7 {
  font-family: "Rajdhani", sans-serif;
}

.f8 {
  font-family: "Saira Condensed", sans-serif;
}

.f9 {
  font-family: "Khand", sans-serif;
}

.f10 {
  font-family: "Agency FB";
}

.f11 {
  font-family: "メイリオ";
}
.j1 {
  font-family: "ステッキ";
}

.j2 {
  font-family: "Kosugi", sans-serif;
  font-weight: lighter;
}
.j3 {
  font-family: "Yusei Magic", sans-serif;
  font-weight: lighter;
}

.j4 {
  font-family: "Stick", sans-serif;
  font-weight: lighter;
}

/*  */
/*=============
.bg_pattern
==============*/

.back {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-color: #fffbe855;
  z-index: -1;
}
.pattern {
  background-image: repeating-linear-gradient(
      to bottom,
      transparent 25px,
      #05384d11 26px,
      #05384d11 26px,
      transparent 27px,
      transparent 51px,
      #05384d11 52px,
      #05384d11 52px,
      transparent 53px,
      transparent 77px,
      #05384d11 78px,
      #05384d11 78px,
      transparent 79px,
      transparent 103px,
      #05384d11 104px,
      #05384d11 104px,
      transparent 105px,
      transparent 129px,
      #05384d11 130px,
      #05384d11 130px
    ),
    repeating-linear-gradient(
      to right,
      transparent 25px,
      #05384d11 26px,
      #05384d11 26px,
      transparent 27px,
      transparent 51px,
      #05384d11 52px,
      #05384d11 52px,
      transparent 53px,
      transparent 77px,
      #05384d11 78px,
      #05384d11 78px,
      transparent 79px,
      transparent 103px,
      #05384d11 104px,
      #05384d11 104px,
      transparent 105px,
      transparent 129px,
      #05384d11 130px,
      #05384d11 130px
    );
}

/* .back {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-color: #7fc8b4;
  z-index: -1;
}
.pattern {
  background-image: repeating-linear-gradient(
      to bottom,
      transparent 25px,
      #fffbe8 26px,
      #fffbe8 26px,
      transparent 27px,
      transparent 51px,
      #fffbe8 52px,
      #fffbe8 52px,
      transparent 53px,
      transparent 77px,
      #fffbe8 78px,
      #fffbe8 78px,
      transparent 79px,
      transparent 103px,
      #fffbe8 104px,
      #fffbe8 104px,
      transparent 105px,
      transparent 129px,
      #fffbe8 130px,
      #fffbe8 130px
    ),
    repeating-linear-gradient(
      to right,
      transparent 25px,
      #fffbe8 26px,
      #fffbe8 26px,
      transparent 27px,
      transparent 51px,
      #fffbe8 52px,
      #fffbe8 52px,
      transparent 53px,
      transparent 77px,
      #fffbe8 78px,
      #fffbe8 78px,
      transparent 79px,
      transparent 103px,
      #fffbe8 104px,
      #fffbe8 104px,
      transparent 105px,
      transparent 129px,
      #fffbe8 130px,
      #fffbe8 130px
    );
} */