/* Reset */
*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

/* Base */
html, body {
  width: 100%;
}

body {
  background-color: #EFEEE8;
  min-height: 100vh;
}

h1 {
  font-weight: normal;
}

img {
  display: block;
  height: auto;
}

a {
  text-decoration: none;
}

/* Container */
.container {
  max-width: 375px;
  margin: 0 auto;
  padding: 40px 5px 30px;
  text-align: center;
}

/* Logo */
.logo {
  margin-bottom: 20px;
}

.logo img {
  width: 72%;
  margin: 0 auto;
}

/* Catch copy */
.catch {
  width: 62%;
  margin: 0 auto 22px;
}

/* Jacket image */
.jacket {
  width: 88%;
  margin: 0 auto 18px;
}

/* Text */
.text {
  width: 42%;
  margin: 0 auto 32px;
}

/* Text2 */
.text2 {
  width: 72%;
  margin: 0 auto 12px;
}

/* Button */
.btn {
  display: block;
  width: 88%;
  margin: 0 auto 40px;
  transition: opacity 0.3s ease;
}

.btn img {
  width: 100%;
}

.btn:hover {
  opacity: 0.8;
}

/* Links */
.links {
  width: 88%;
  margin: 0 auto 40px;
  text-align: left;
}

.link {
  display: block;
  margin-bottom: 15px;
  transition: opacity 0.3s ease;
}

.link:last-child {
  margin-bottom: 0;
}

.link:hover {
  opacity: 0.7;
}

.link1 img {
  width: 70%;
}

.link2 img {
  width: 52%;
}

/* Footer */
.footer {
  width: 88%;
  margin: 0 auto;
  border-top: 1px solid #3b2315;
  padding-top: 20px;
  text-align: center;
}

.footer img {
  width: 8%;
  min-width: 28px;
  margin: 0 auto;
}

/* Tablet and Desktop */
@media (min-width: 768px) {
  .container {
    max-width: 800px;
    padding: 60px 40px 50px;
  }

  .logo {
    margin-bottom: 40px;
  }

  .logo img {
    width: 72%;
  }

  .catch {
    width: 62%;
    margin-bottom: 35px;
  }

  .jacket {
    width: 88%;
    margin-bottom: 28px;
  }

  .text {
    width: 42%;
    margin-bottom: 50px;
  }

  .text2 {
    width: 72%;
    margin-bottom: 18px;
  }

  .btn {
    width: 88%;
    margin-bottom: 60px;
  }

  .links {
    width: 88%;
    margin-bottom: 60px;
  }

  .link {
    margin-bottom: 25px;
  }

  .footer {
    width: 88%;
    padding-top: 30px;
  }

  .footer img {
    width: 8%;
    min-width: 40px;
  }
}