body {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  margin: 0;
  width: 100%; }

section#hero {
  display: flex;
  justify-content: center;
  padding: 3rem 6rem; }
  @media screen and (max-width: 559px) {
    section#hero {
      padding: 20px 10px 0px 10px;
      height: 150px; } }
  section#hero img.logo {
    width: 100%;
    max-width: 800px;
    -o-object-fit: contain;
       object-fit: contain; }

section#about {
  text-align: center;
  margin-bottom: 5rem; }

section#members, section#contents, section#contact, section#links {
  display: flex;
  justify-content: center;
  flex-flow: column;
  align-items: center;
  margin-bottom: 5rem; }
  section#members h2, section#contents h2, section#contact h2, section#links h2 {
    display: block;
    text-align: center; }

.links-container {
  display: flex;
  min-width: 320px;
  width: 320px;
  justify-content: space-around; }
  .links-container a {
    color: #000;
    cursor: pointer;
    -webkit-transition: color 0.1s ease-in-out;
    transition: color 0.1s ease-in-out; }
    .links-container a.twitter:hover {
      color: #1da1f2; }
    .links-container a.youtube:hover {
      color: #ff0000; }

.members-container {
  display: flex;
  min-width: 320px;
  max-width: 800px;
  width: 80%;
  justify-content: space-around; }
  .members-container .member {
    width: 200px; }
    .members-container .member img {
      width: 100%; }
    .members-container .member .name {
      text-align: center;
      font-weight: bold;
      font-size: 1.2rem;
      margin-bottom: 0.2rem; }
    .members-container .member a.social-account {
      display: block;
      text-decoration: none;
      text-align: center;
      color: #888; }
      .members-container .member a.social-account:hover {
        color: inherit; }
        .members-container .member a.social-account:hover .fa-twitter {
          color: #1da1f2; }

.contents-container {
  display: flex;
  min-width: 320px;
  max-width: 800px;
  width: 80%;
  justify-content: space-around;
  flex-wrap: wrap; }
  .contents-container .content {
    min-width: 200px;
    display: flex;
    flex-flow: column;
    margin-bottom: 25px; }
    .contents-container .content img {
      display: block;
      max-height: 350px;
      -o-object-fit: contain;
         object-fit: contain;
      border: 1px solid #eee;
      -webkit-box-shadow: #eee 2px 2px 3px 0px;
              box-shadow: #eee 2px 2px 3px 0px;
      margin-bottom: 10px; }
    .contents-container .content .name {
      text-align: center;
      font-weight: bold;
      margin-bottom: 0.2rem; }
    .contents-container .content .price {
      text-align: center;
      font-weight: bold;
      margin-bottom: 0.2rem; }
    .contents-container .content a {
      display: block;
      text-decoration: none;
      text-align: center;
      color: #888; }
    .contents-container .content a.booth:hover {
      color: #fc4d50; }
    .contents-container .content a.techbookfest:hover {
      color: #4caf50; }
