* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  font-family: sans-serif;
}

ul,
ol,
li {
  list-style-type: none;
}
a {
  color: inherit;
  text-decoration: none;
}

.header {
  font-weight: 500;
}

.header-container {
  width: 1000px;
  margin: 0 auto;
}

.header-navbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 30px;
}

.header-navbar-button {
  width: 45px;
  height: 25px;
  background-color: #000000;
  border-radius: 19px;
  display: flex;
  align-items: center;
  justify-content: end;
}

.header-navbar-button-disk {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background-color: #fff;
  margin-right: 5px;
}

.header-showcase {
  display: flex;
  align-items: center;
  flex-direction: column;
}

.header-showcase-tepa {
  display: flex;
  align-items: center;
  flex-direction: column;
}

.header-showcase-tepa-span-1 {
  font-size: 48px;
  font-weight: 700;
}

.header-showcase-tepa-div-1 {
  display: flex;
  margin: 25px 0;
  justify-content: center;
}

.header-showcase-tepa-div-1-chap-img {
  margin-right: 8px;
}

.header-showcase-tepa-div-1-ong-span-1 {
  color: #ff0000;
  font-weight: 600;
  font-size: 12px;
  margin-top: 5px;
}

.header-showcase-tepa-div-1-ong-span-2 {
  font-size: 8px;
  margin-top: 4px;
}

.header-showcase-box-1-img {
  width: 550px;
  margin-bottom: 35px;
}

.header-showcase-box-1-chap {
  width: 550px;
  margin: 0 auto;
  margin-right: 80px;
  margin-left: 200px;
}

.header-showcase-box-1-ong {
  display: flex;
  align-items: end;
}

.header-showcase-box-1-ong-button {
  padding: 8px 16px;
  font-weight: 600;
  font-size: 14px;
  color: black;
  background: white;
  border-radius: 8px;
  border: 3px solid transparent;
  background-image: linear-gradient(white, white),
    linear-gradient(to bottom, #ee5626, #35109f);
  background-origin: border-box;
  background-clip: padding-box, border-box;
  cursor: pointer;
  margin-right: 12px;
}

#header-showcase-box-1-button-arrow {
  margin-left: 5px;
}

.header-showcase-box-1 {
  display: flex;
  justify-content: center;
}

.header-showcase-box-1-p-1,
.header-showcase-box-1-p-2 {
  word-spacing: 5px;
  font-size: 16px;
}

.header-showcase-tepa-box {
  display: flex;
  width: 30px;
  justify-content: space-between;
  margin-bottom: 30px;
}

.header-showcase-tepa-box-1 {
  width: 6px;
  height: 6px;
  background-color: #000000;
  border-radius: 50%;
}

.header-past {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  margin: 50px 0 30px;
}

.header-past-chap {
  font-size: 12px;
}

.header-past-chap-span-2 {
  color: #ff0000;
}

.header-past-chap-span-3 {
  font-size: 12px;
  font-weight: 600;
}

.header-past-ong {
  display: flex;
  gap: 16px;
  margin-right: 4px;
}

#header-past-ong-twitter,
#header-past-ong-github,
#header-past-ong-figma {
  font-size: 20px;
  border-radius: 50%;
  border: 3px solid #000;
  width: 45px;
  height: 45px;
  display: flex;
  justify-content: center;
  align-items: center;
}