html, body {
  margin: 0;
  padding: 0;
}

.w-flex {
  display: flex;
  flex-wrap: wrap;
}

.container {
  width: 100%;
  margin: auto;
  height: 100vh;
}

.content-2 div {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  align-content: center;
  flex-direction: column;
  justify-content: center;
  width: 50%;
}
.content-2 img {
  width: 300px;
}
.content-2 h1 {
  margin: 0;
  padding: 0;
}

.bc1 {
  background-color: #f5fcff;
  background-image: url(images/bg_blue.png);
}

.bc2 {
  background-color: #d7d7d7;
  background-image: url(images/bg_black.png);
}

.box300 {
  height: 260px;
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  align-content: center;
  flex-direction: column;
  justify-content: center;
}

.box240 img {
  width: 240px;
  box-sizing: border-box;
  border: 3px solid #ffbd21;
}

.logo:hover {
  filter: brightness(1.5);
}

.btn {
  text-decoration: none;
  color: #fff;
  width: -moz-fit-content;
  width: fit-content;
  background-color: #0b9deb;
  border: 1px solid #fff;
  padding: 0.6em 1em;
  border-radius: 1.2em;
  font-weight: 900;
}
.btn:hover {
  color: #000;
  background-color: #fff;
}

.btn2 {
  text-decoration: none;
  color: #fff;
  width: -moz-fit-content;
  width: fit-content;
  background-color: #333;
  border: 1px solid #fff;
  padding: 0.6em 1em;
  border-radius: 1.2em;
  font-weight: 900;
}
.btn2:hover {
  color: rgb(176, 176, 176);
  background-color: #fff;
}

.txt-center {
  text-align: center;
}

@media screen and (max-width: 600px) {
  html, body {
    margin: 0;
    padding: 0;
  }
  .w-flex {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    justify-content: center;
  }
  .container {
    width: 100%;
    margin: auto;
    height: 100vh;
  }
  .content-2 div {
    width: 100%;
    text-align: center;
  }
  .bc1 {
    height: 50vh;
  }
  .bc2 {
    height: 50vh;
  }
  .box300 {
    height: 220px;
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    align-content: center;
    flex-direction: column;
    justify-content: center;
  }
  .box240 {
    height: 240px;
    display: inline-flex;
    flex-wrap: wrap;
    align-items: stretch;
    align-content: center;
    flex-direction: column;
    justify-content: center;
  }
  .box240 img {
    width: 48vw;
    box-sizing: border-box;
    border: 3px solid #ffbd21;
  }
  .btn {
    text-decoration: none;
    color: #000;
    font-weight: 900;
  }
  .btn:hover {
    opacity: 0.5;
    color: #f00;
  }
  .btn2 {
    text-decoration: none;
    color: #fff;
    font-weight: 900;
  }
  .btn2:hover {
    opacity: 0.5;
    color: rgb(225, 255, 0);
  }
  .txt-center {
    text-align: center;
  }
}/*# sourceMappingURL=style.css.map */