@media (max-width: 700px) and (min-width: 300px) {
  .footer {
    text-align: center;
    width: 100%;
    background-color: #ffffff;
    color: #39383d;
    line-height: 30px;
  }

  .footer div {
    text-align: center;
  }

  .footer>div:nth-child(1) {
    background-color: #eee;
    text-align: center;
    height: 50px;
    border-bottom: 1px solid #ddd;
  }

  .footer>div:nth-child(1) ul {
    width: 95%;
    display: inline-block;
    line-height: 50px;
  }

  .footer>div:nth-child(1) ul li {
    float: left;
    width: 100px;
    text-align: left;
    font-size: 12px;
  }

  .footer>div:nth-child(1) ul li:nth-child(3) {
    float: right;
    width: 136px;
  }

  .footer div:nth-child(2) ul {
    width: 95%;
    display: inline-block;
    margin-top: 30px;
  }

  .footer div:nth-child(2) ul li {
    float: left;
    text-align: left;
  }

  .footer div:nth-child(2) ul li:nth-child(1) {
    text-align: left;
  }

  .footer div:nth-child(2) ul li:nth-child(1) div {
    font-size: 13px;
    font-family: 'Noto_M';
    display: inline-block;
  }

  .footer div:nth-child(2) ul li:nth-child(1) div div:nth-child(1) {
    width: 120px;
    text-align: left;
  }

  .footer div:nth-child(2) ul li:nth-child(2) {
    float: right;
  }

  .footer div:nth-child(2) ul li:nth-child(2) div {
    text-align: left;
    font-size: 18px;
    font-family: 'Noto_M';
    margin-bottom: 10%;
    margin-top: 10%;
  }

  .footer div:nth-child(2) ul li:nth-child(2) div font {
    font-size: 30px;
    font-family: 'Noto_B';
  }

  .footer>div:nth-child(3) {
    text-align: center;
    margin-top: 20px;
    font-size: 12px;
    font-family: 'Noto_M';
    margin-bottom: 10px;
    padding-top: 10px;
    border-top: 1px solid #ddd;
  }
}