.th-notice-page {
  max-width: 800px;
  margin: 0 auto;
  padding: max(16px, calc(20 / 800 * 100vw));
  font-family:
    "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", Meiryo, メイリオ,
    "ＭＳ Ｐゴシック", "MS P Gothic", Osaka, Arial, Helvetica, Verdana,
    sans-serif;
  color: #333333;
  line-height: 1.85;
}

.th-notice-page h4 {
  font-size: max(18px, calc(26 / 800 * 100vw));
  color: #333333;
  margin-bottom: calc(35 / 800 * 100vw);
  padding-bottom: calc(15 / 800 * 100vw);
  border-bottom: 2px solid #333333;
  font-weight: 500;
}

.th-notice-page p {
  font-size: max(13px, calc(16 / 800 * 100vw));
  margin-top: 0;
  margin-bottom: calc(8 / 800 * 100vw);
}

.th-notice-page .notice-heading {
  font-size: max(15px, calc(20 / 800 * 100vw));
  color: #333333;
  font-weight: 500;
  letter-spacing: 0.05em;
  margin-top: calc(55 / 800 * 100vw);
  margin-bottom: calc(15 / 800 * 100vw);
  padding: calc(14 / 800 * 100vw) calc(18 / 800 * 100vw);
  background-color: #f2f2f2;
  border-left: 6px solid #333333;
  border-top: 1px solid #ddd;
  border-right: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
}

.notice-heading__title_01 {
  font-size: max(12px, calc(16 / 800 * 100vw));
}

.th-notice-page .text-note {
  font-size: max(11px, calc(13 / 800 * 100vw));
  color: #555555;
  margin-top: calc(10 / 800 * 100vw);
  background-color: #ffefef;
  padding: max(10px, calc(15 / 800 * 100vw));
  border-radius: 4px;
  line-height: 1.7;
}

.th-notice-page .text-bold {
  font-weight: 500;
  color: #333333;
}

.th-notice-page .text-alert {
  font-weight: 600;
  color: #c74343;
}

.th-notice-page a {
  color: #b79191;
  font-weight: 500;
  text-decoration: underline;
}

.th-notice-page a:hover {
  text-decoration: none;
}

.th-notice-page hr {
  border: none;
  border-top: 1px dashed #ccc;
  margin: calc(45 / 800 * 100vw) 0;
}

.th-notice-page .faq-container {
  margin-top: calc(25 / 800 * 100vw);
}

.th-notice-page .faq-item {
  margin-bottom: calc(30 / 800 * 100vw);
  padding-bottom: calc(20 / 800 * 100vw);
  border-bottom: 1px solid #f0f0f0;
}

.th-notice-page .faq-item:last-child {
  border-bottom: none;
}

.th-notice-page .faq-q {
  font-weight: 500;
  color: #333333;
  font-size: max(14px, calc(18 / 800 * 100vw));
  margin-bottom: calc(10 / 800 * 100vw);
}

.th-notice-page .faq-a {
  font-size: max(13px, calc(16 / 800 * 100vw));
  margin-left: calc(10 / 800 * 100vw);
}

@media screen and (min-width: 780px) {
  .th-notice-page {
    padding: 20px;
  }

  .th-notice-page h4 {
    font-size: 26px;
    margin-bottom: 35px;
    padding-bottom: 15px;
  }

  .th-notice-page p {
    font-size: 16px;
    margin-bottom: 8px;
  }

  .th-notice-page .notice-heading {
    font-size: 20px;
    margin-top: 55px;
    margin-bottom: 15px;
    padding: 14px 18px 0;
  }

  .notice-heading__title_01 {
    font-size: 16px;
  }

  .th-notice-page .text-note {
    font-size: 13px;
    margin-top: 10px;
    padding: 17px 15px 15px 15px;
  }

  .th-notice-page hr {
    margin: 45px 0;
  }

  .th-notice-page .faq-container {
    margin-top: 25px;
  }

  .th-notice-page .faq-item {
    margin-bottom: 30px;
    padding-bottom: 20px;
  }

  .th-notice-page .faq-q {
    font-size: 18px;
    margin-bottom: 10px;
  }

  .th-notice-page .faq-a {
    font-size: 16px;
    margin-left: 10px;
  }
}
