@charset "UTF-8";

:focus {
  outline: none;
}
button {
  padding: 0;
  border: none;
  background: none;
  cursor: pointer;
}
button:hover {
  opacity: 0.8;
}
.st-alert {
  background: #F4EFE4;
  border: 1px solid #E60000;
  padding: 24px 8px;
  margin-bottom: 40px;
}
.st-alert p{
  color: #E60000;
  text-align: center;
  font-size: 28px;
  font-style: normal;
  font-weight: 700;
  line-height: 1.5;
}
.st-txt {
  color: #2B2A1E;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 1.75;
}
.st-txt b {
  font-weight: 700;
}
.st-txt-accent {
  color: #E60000;
  font-weight: 700;
}
.st-input-form {
  margin: 40px 0;
  padding: 40px;
  background: linear-gradient(90deg, #000 0%, #3D2C03 100%);
  display: flex;
  align-items: center;
  flex-direction: column;
}
.st-input-form h2 {
  color: #F4EFE4;
  font-size: 28px;
  font-weight: 700;
  line-height: 1.5;
  margin-bottom: 32px;
}
.st-input-area {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
  width: 100%;
}
.st-input-area input {
  border: 1px solid #B39D50;
  background: #F4EFE4;
  height: 56px;
  text-align: center;
  color: #2B2A1E;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.75;
  flex: 1;
}
.st-input-area span {
  position: relative;
  width: 40px;
}
.st-input-area span::before {
  content: "";
  color: #B39D50;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%);
  display: inline-block;
  background: #B39D50;
  width: 20px;
  height: 2px;
}
.st-input-ast {
  color: #F4EFE4;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.75;
  width: 100%;
  margin-bottom: 40px;
}
.st-input-error {
  display: block;
  color: #E60000;
  text-align: center;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.75;
  margin-bottom: 12px;
}
.st-input-error.hidden {
  display: none;
}
.st-input-submit {
  width: 254px;
  margin-bottom: 12px;
}
.st-input-clear {
  color: #F4EFE4;
	font-family: "Noto Serif JP", serif;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.04em;
  padding: 2.5px 16px;
  text-decoration: underline;
}
.st-txt-content:not(:last-child) {
  margin-bottom: 40px;
}
.st-txt-content h3 {
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
  line-height: 1.5;
  padding-bottom: 8px;
  border-bottom: 1px solid #B39D50;
  margin-bottom: 10px;
}
.st-txt-flex {
  display: flex;
  justify-content: center;
  gap: 16px;
}
.st-txt-flex img {
  width: 280px;
}
.st-txt-flex p {
  flex: 1;
}
.st-txt-content ul li {
  padding-left: 20px;
  position: relative;
}
.st-txt-content ul li:before {
  content: "・";
  color: #2B2A1E;
  position: absolute;
  margin-left: -20px;
}
.st-txt-content ol {
  counter-reset: num 0;
}
.st-txt-content ol li {
  padding-left: 20px;
  position: relative;
}
.st-txt-content ol li:before {
  content: counter(num) ".";
  color: #2B2A1E;
  position: absolute;
  margin-left: -20px;
  counter-increment: num 1;
}
.content_main_wrapper.en .st-txt,
.content_main_wrapper.en p {
  letter-spacing: 0.02em;
  word-break: break-word;
}
.content_main_wrapper.kr .st-txt,
.content_main_wrapper.kr p {
  letter-spacing: 0.001em;
}


@media (max-width: 1440px) {
  .st-alert {
    padding: 1.66666666667vw 0.55555555556vw;
    margin-bottom: 2.777777778vw;
  }
  .st-alert p {
    font-size: 1.94444444444vw;
  }
  .st-txt {
    font-size: 1.11111111111vw;
  }
  .st-input-form {
    margin: 2.777777778vw 0;
    padding: 2.777777778vw;
  }
  .st-input-form h2 {
    font-size: 1.944444444vw;
    margin-bottom: 2.222222222vw;
  }
  .st-input-area {
    margin-bottom: 0.6944444444vw;
  }
  .st-input-area input {
    font-size: 1.111111111vw;
    height: 3.888888889vw;
  }
  .st-input-area span {
    width: 2.777777778vw;
  }
  .st-input-area span::before {
    width: 1.388888889vw;
  }
  .st-input-ast {
    font-size: 0.8333333333vw;
    margin-bottom: 2.777777778vw;
  }
  .st-input-error {
    font-size: 0.9722222222vw;
    margin-bottom: 0.8333333333vw;
  }
  .st-input-submit {
    width: 17.63888889vw;
    margin-bottom: 0.8333333333vw;
  }
  .st-input-clear {
    font-size: 1.25vw;
    padding: 0.1736111111vw 1.111111111vw;
  }
  .st-txt-content:not(:last-child) {
    margin-bottom: 2.777777778vw;
  }
  .st-txt-content h3 {
    font-size: 1.388888889vw;
    padding-bottom: 0.5555555556vw;
    margin-bottom: 0.6944444444vw;
  }
  .st-txt-flex {
    gap: 1.111111111vw;
  }
  .st-txt-flex img {
    width: 19.44444444vw;
  }
  .st-txt-content ul li,
  .st-txt-content ol li {
    padding-left: 1.388888889vw;
  }
  .st-txt-content ul li:before,
  .st-txt-content ol li:before {
    margin-left: -1.388888889vw;
  }

}

@media (max-width: 460px) {
  #page_header .text_wrapper .header_title.soundtrack {
    text-align: center;
  }
  .st-alert {
    padding: 4.26666666667vw 2.13333333333vw;
    margin-bottom: 5.333333333vw;
  }
  .st-alert p {
    font-size: 6.4vw;
  }
  .st-txt {
    font-size: 4.266666667vw;
  }
  .st-input-form {
    margin: 10.66666667vw 0;
    padding: 6.4vw 4.266666667vw;
  }
  .st-input-form h2 {
    font-size: 6.4vw;
    margin-bottom: 6.4vw;
  }
  .st-input-area {
    width: 78.66666667vw;
    margin-bottom: 2.666666667vw;
  }
  .st-input-area input {
    font-size: 4.266666667vw;
    width: 23.01333333vw;
    height: 14.93333333vw;
  }
  .st-input-area span {
    width: 4.8vw;;
  }
  .st-input-area span::before {
    width: 2.666666667vw;
  }
  .st-input-ast {
    font-size: 3.2vw;
    margin-bottom: 10.66666667vw;
  }
  .st-input-error {
    font-size: 3.733333333vw;
    margin-bottom: 3.2vw;
  }
  .st-input-submit {
    width: 69.33333333vw;
    margin-bottom: 3.2vw;
  }
  .st-input-clear {
    font-size: 4.8vw;
    padding: 0.6666666667vw 4.266666667vw;
  }
  .st-txt-content:not(:last-child) {
    margin-bottom: 10.66666667vw;
  }
  .st-txt-content h3 {
    font-size: 5.333333333vw;
    padding-bottom: 2.133333333vw;
    margin-bottom: 2.666666667vw;
  }
  .st-txt-flex {
    flex-direction: column;
    gap: 4.266666667vw;
  }
  .st-txt-flex img {
    width: 100%;
  }
  .st-txt-content ul li,
  .st-txt-content ol li {
    padding-left: 5.333333333vw;
  }

  .st-txt-content ul li:before,
  .st-txt-content ol li:before {
    margin-left: -5.333333333vw;
  }
}