body, p {
  color: #002D18;
}

h1, h2, h3, h4, h5, h6 {
  margin: 0;
}

h1, .fz104 {
  font-size: 104px;
  line-height: 114px;
  margin: 0;
  font-weight: 100;
}

.fz60 {
  font-size: 60px;
  line-height: 72px;
}

h2, h3, .fz52 {
  font-size: 52px;
  line-height: 64px;
  font-weight: 100;
}

.fz30 {
  font-size: 30px;
  line-height: 42px;
}

h4, .fz24 {
  font-size: 24px;
  line-height: 36px;
}

h5, .fz20 {
  font-size: 20px;
  line-height: 32px;
  color: #002D18;
}

h6, .fz14 {
  font-size: 14px;
  line-height: 20px;
  font-weight: 100;
}

b {
  font-weight: 300;
}

p {
  font-size: 20px;
  line-height: 32px;
}

.fz16 {
  font-size: 16px;
  line-height: 28px;
}

.fz45 {
  font-size: 45px;
  line-height: 56px;
}

.fz18 {
  font-size: 18px;
  line-height: 30px;
}

ul li {
  font-size: 20px;
  line-height: 32px;
  font-weight: 100;
}

@media (max-width: 1100px) {
  h3 {
    font-size: 24px;
    line-height: 36px;
  }
}
.font-bold-100 {
  font-weight: 100;
}

.font-bold-300 {
  font-weight: 300;
}

.font-bold-400 {
  font-weight: 400;
}

.font-bold-600 {
  font-weight: 600;
}

.bg-main {
  background-color: #002D18;
}

.bg-main-opacity {
  background-color: rgba(10, 45, 27, 0.55);
}

.bg-eighty {
  background-color: #3B5647;
}

.bg-forty {
  background-color: #9CABA3;
}

.bg-twinty {
  background-color: #CED5D1;
}

.bg-ten {
  background-color: #E6EAE8;
}

.bg-promocolor {
  background-color: #C84600;
}

.bg-white {
  background-color: white;
}

.text-delete {
  text-decoration-line: line-through;
}

.text-main {
  color: #002D18;
}

.text-eighty {
  color: #3B5647;
}

.text-forty {
  color: #9CABA3;
}

.text-twinty {
  color: #CED5D1;
}

.text-ten {
  color: #E6EAE8;
}

.text-promocolor {
  color: #C84600;
}

.text-white {
  color: white;
}

@media (max-width: 768px) {
  h1, .fz104 {
    font-size: 60px;
    line-height: 70px;
    margin: 0;
  }

  h2, h3, .fz52 {
    font-size: 32px;
    line-height: 42px;
  }

  .fz45 {
    font-size: 30px;
    line-height: 42px;
  }

  .fz30 {
    font-size: 24px;
    line-height: 36px;
  }

  p {
    font-size: 18px;
    line-height: 30px;
  }
}
a:hover {
  opacity: 0.8;
}

.indent2 {
  text-indent: 2em;
}

.indent4 {
  text-indent: 4em;
}

.indent6 {
  text-indent: 6em;
}

.fz18 {
  font-size: 18px;
  line-height: 28px;
}

.pta10 {
  padding: 10px;
}

.notice {
  width: 100%;
  border-radius: 10px;
}
.notice .toggle {
  padding: 10px;
  margin-left: 0;
  background-color: white;
  margin-top: -15px;
  border-radius: 10px;
}
.notice .toggle ul li {
  line-height: 24px;
}
.notice .toggle h5 {
  font-size: 16px;
  line-height: 26px;
}
.notice .hint {
  display: flex;
  cursor: pointer;
  justify-content: space-between;
  background-color: white;
  border-radius: 10px;
  align-items: center;
  width: 100%;
  padding: 20px;
}

.section.s1 {
  background-image: url(https://gvcdn.s3-ap-northeast-1.amazonaws.com/shopline/2021-rebrand/landing-page/2025-hair-carnival/images/s1-bg.jpg);
}
.section.s1 h2.title.center {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: fit-content;
  border-top: 1px solid #002D18;
  border-bottom: 1px solid #002D18;
}
.section.s1 .act img {
  width: 100%;
}
.section.s1 .act .wrap {
  display: flex;
  flex-wrap: wrap;
  margin: -0.5rem;
}
.section.s1 .act .item {
  padding: 0.5rem;
  width: 25%;
}

.section.s2 {
  background-image: url(https://gvcdn.s3-ap-northeast-1.amazonaws.com/shopline/2021-rebrand/landing-page/2025-hair-carnival/images/s2-bg.jpg);
}
.section.s2 .mini-title {
  font-size: 40px;
  line-height: 53px;
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: fit-content;
  border-top: 1px solid #C84600;
  border-bottom: 1px solid #C84600;
}
.section.s2 .set {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}
.section.s2 .set-img {
  width: 33%;
  padding: 10px;
}
.section.s2 .cta-box img {
  width: 100%;
}

.s3 .container-fluid {
  width: 100%;
  padding: 8px;
  margin: -8px;
}

.s3 img {
  width: 100%;
}

@media (max-width: 768px) {
  h4, .fz24 {
    font-size: 20px;
    line-height: 36px;
  }

  .mb60 {
    margin-bottom: 30px;
  }

  .fz18 {
    font-size: 14px;
    line-height: 24px;
  }

  .section.s1 .act .item {
    padding: 0.5rem;
    width: 50%;
  }

  .section.s2 .set {
    flex-direction: column;
  }
  .section.s2 .set-img {
    width: 100%;
  }

  .s3 .container-fluid {
    padding: 0 8px;
    margin: 0;
  }
}