.font-noto-thai {
  font-family: 'Noto Sans Thai', sans-serif;
  word-break: keep-all;
}

.no-break {
  white-space: nowrap;
}

/* モバイル（初期状態） */
.fixed-site-header {
  margin-top: 56px !important;
}

/* Required dot */
.required:after {
  content: " *";
  color: #FF4B00;
}

/* md以上（768px以上の画面） */
@media (min-width: 768px) {
  .fixed-site-header {
    margin-top: 90px !important;
  }
}

.effect-button-1:hover {
  background-color: #FFF5CC;
}

.effect-button-2:hover {
  background-color: #5D9CE6;
}

.effect-button-blue:hover {
  background-color: #004ea8;
  color: #ffffff;
}

.effect-button-lightyellow:hover {
  background-color: #FFF5CC;
  color: #333333;
}

.effect-button-vividyellow:hover {
  background-color: #ffcc00;
  color: #333333;
}

.effect-button-lightblue:hover {
  background-color: #5D9CE6;
  color: #ffffff;
}

.effect-scale-on-hover {
  /* 0.2秒かけて変形 */
  transition: transform 0.2s ease;
  /* 変形の起点を中央に */
  transform-origin: center center;
}

.effect-scale-on-hover:hover {
  transform: scale(1.05);
}

.effect-on-visible {
  opacity: 0;
}

.effect-scale-on-hover.override-scale-130:hover {
  transform: scale(1.2) !important;
}

@keyframes rotate-from-left {
  from {
    transform: perspective(600px) rotateY(-90deg);
    opacity: 0;
  }

  to {
    transform: perspective(600px) rotateY(0deg);
    opacity: 1;
  }
}

@keyframes rotate-from-left {
  from {
    transform: perspective(600px) rotateY(-90deg);
    opacity: 0;
  }

  to {
    transform: perspective(600px) rotateY(0deg);
    opacity: 1;
  }
}

.effect-on-visible.rotate-from-left.in-view {
  transform-origin: center center;
  animation: rotate-from-left 0.4s ease-out forwards;
}

@keyframes slidein-from-left {
  from {
    transform: translateX(-100px);
    opacity: 0;
  }

  to {
    transform: translateX(0);
    opacity: 1;
  }
}

.effect-on-visible.slidein-from-left.in-view {
  animation: slidein-from-left 0.4s ease-out forwards;
}

@keyframes slidein-from-right {
  from {
    transform: translateX(100px);
    opacity: 0;
  }

  to {
    transform: translateX(0);
    opacity: 1;
  }
}

.effect-on-visible.slidein-from-right.in-view {
  animation: slidein-from-right 0.4s ease-out forwards;
}

@keyframes slidein-from-bottom {
  from {
    transform: translateY(100px);
    opacity: 0;
  }

  to {
    transform: translateY(0);
    opacity: 1;
  }
}

.effect-on-visible.slidein-from-bottom.in-view {
  animation: slidein-from-bottom 0.4s ease-out forwards;
}

.anim-delay-125ms {
  animation-delay: 0.1s !important;
}

.anim-delay-250ms {
  animation-delay: 0.25s !important;
}

.anim-delay-500ms {
  animation-delay: 0.5s !important;
}

.error-message {
  color: #FF4B00;
  font-size: 14px;
  font-family: 'Noto Sans Thai', sans-serif;
}

.pdf-link {
  cursor: default;
}

@media (min-width: 768px) {
  .error-message {
    font-size: 16px;
  }
}

@layer utilities {
  .text-shadow-custom {
    text-shadow: 2px 4px 8px #A6A6A6;
  }
}

@layer utilities {
  .z-120 {
    z-index: 120;
  }
}

@layer utilities {
  .shadow-custom {
    box-shadow: 0px 4px 12px 0px rgba(51, 51, 51, 0.2);
  }
}

@layer utilities {
  .shadow-custom2 {
    box-shadow: 0px 4px 12px 0px rgba(51, 51, 51, 0.10);
  }
}

@layer utilities {
  .ndid1 {
    image-rendering: -webkit-optimize-contrast;
  }
}

@layer utilities {
  .ndid2 {
    image-rendering: -webkit-crisp-edges;
    image-rendering: pixelated;
  }
}


@layer utilities {
  .ndid3 {
    image-rendering: auto;
  }
}

.image-zoom-container {
  overflow: hidden;
}

.image-zoom {
  width: 100%;
  object-fit: cover;
  transition: transform 0.3s ease !important;
  /* アニメーション効果 */
}

.image-zoom-container:hover .image-zoom {
  transform: scale(1.1) !important;
  /* hover時に1.1倍に拡大 */
}

.c-inset-x-0 {
  inset-inline: 0;
  /* inset-x-0 */
}



/* ベースのカスタムリスト */
.custom-list {
  counter-reset: item !important;
  list-style: none;
  padding-left: 0px;
  --counter-prefix: "";
  --counter-suffix: ".";
}

.custom-list li {
  counter-increment: item !important;
  position: relative;
  padding-left: 2.0em;
  /* 基本パディングを増加 */
}

.custom-list li::before {
  content: var(--counter-prefix) counter(item) var(--counter-suffix) !important;
  position: absolute;
  left: 0;
  width: 1.5em;
  /* 固定幅を設定 */
  text-align: right;
  /* 右寄せで数字を揃える */
  color: #333333;
  font-family: 'Noto Sans Thai', sans-serif;
  font-size: 14px;
  font-weight: normal;
}

@media (min-width: 768px) {
  .custom-list li::before {
    font-size: 16px;
  }
}

.custom-list-bold li::before {
  font-weight: bold !important;
}

/* ドットリスト */
.custom-list-dot {
  counter-reset: none !important;
  /* カウンターを完全に無効化 */
  list-style: none;
  padding-left: 0px;
  --symbol-content: '・';

}

.custom-list-dot li {
  display: list-item;
  position: relative;
  padding-left: 1.0em;
  /* ドットは狭めに */
  counter-increment: none !important;
  /* カウンターインクリメント無効 */
}

.custom-list-dot li::before {
  content: var(--symbol-content) !important;
  /* ドットを強制表示 */
  position: absolute;
  left: 0;
  width: 1.0em;
  /* ドットの幅 */
  color: #333333;
  font-family: 'Noto Sans Thai', sans-serif;
  font-size: 14px;
  font-weight: bold;
}

@media (min-width: 768px) {
  .custom-list-dot li::before {
    font-size: 16px;
    font-weight: normal;
  }
}

/* ネストした場合の特別な処理 */

/* custom-list の中に custom-list-dot がある場合 */
.custom-list .custom-list-dot {
  counter-reset: none !important;
}

.custom-list .custom-list-dot li {
  counter-increment: none !important;
  padding-left: 1.3em;
  /* ネストしたドットのパディング */
}

.custom-list .custom-list-dot li::before {
  content: var(--symbol-content) !important;
  width: 1.0em;
}

/* custom-list-dot の中に custom-list がある場合 */
.custom-list-dot .custom-list {
  counter-reset: item !important;
  /* 新しいカウンターを開始 */
}

.custom-list-dot .custom-list li {
  counter-increment: item !important;
  padding-left: 1.5em;
  /* ネストした数字リストのパディング */
}

.custom-list-dot .custom-list li::before {
  content: var(--counter-prefix) counter(item) var(--counter-suffix) !important;
  width: 1.0em;
  /* 幅を狭くして数字自体を左に */
  text-align: right;
}

/* より深いネスト対応 */
.custom-list .custom-list-dot .custom-list {
  counter-reset: item !important;
}

.custom-list .custom-list-dot .custom-list li {
  counter-increment: item !important;
  padding-left: 1.5em;
}

.custom-list .custom-list-dot .custom-list li::before {
  content: var(--counter-prefix) counter(item) var(--counter-suffix) !important;
  width: 1.5em;
  /* 幅を狭くして数字自体を左に */
  text-align: right;
}

.custom-list-dot .custom-list .custom-list-dot {
  counter-reset: none !important;
}

.custom-list-dot .custom-list .custom-list-dot li {
  counter-increment: none !important;
  padding-left: 1.5em;
}

.custom-list-dot .custom-list .custom-list-dot li::before {
  content: var(--symbol-content) !important;
  width: 1.5em;
}

/* バリエーションクラス */
.custom-list-suffix-dot {
  --counter-suffix: '.';
}

.custom-list-prefix-open {
  --counter-prefix: '(';
}

.custom-list-prefix-close {
  --counter-suffix: ')';
}

.custom-list-prefix-close-dot {
  --counter-suffix: ').';
}

/* 括弧付きのパディング調整 */
.custom-list-prefix-close-dot li {
  --counter-suffix: ').';
  padding-left: 2.5em;
  /* 括弧+ドット用の幅を確保 */
}

.custom-list-prefix-close li {
  padding-left: 2.0em;
  /* 括弧用の幅を確保 */
}

/* ネストした括弧付きリストのパディング調整 */
.custom-list-dot .custom-list.custom-list-prefix-close-dot li {
  padding-left: 2.0em;
}

.custom-list-dot .custom-list.custom-list-prefix-close li {
  padding-left: 2.0em;
}

.custom-list .custom-list-dot .custom-list.custom-list-prefix-close-dot li {
  padding-left: 2.0em;
}

.custom-list .custom-list-dot .custom-list.custom-list-prefix-close li {
  padding-left: 2.0em;
}

.custom-list-dash {
  --symbol-content: '-';
}

/* すべての組み合わせでバリエーションが適用されるように */
.custom-list .custom-list-suffix-dot {
  --counter-suffix: '.';
}

.custom-list .custom-list-prefix-open {
  --counter-prefix: '(';
}

.custom-list .custom-list-prefix-close {
  --counter-suffix: ')';
}

.custom-list .custom-list-prefix-close-dot {
  --counter-suffix: ').';
}

.custom-list-dot .custom-list.custom-list-suffix-dot {
  --counter-suffix: '.';
}

.custom-list-dot .custom-list.custom-list-prefix-open {
  --counter-prefix: '(';
}

.custom-list-dot .custom-list.custom-list-prefix-close {
  --counter-suffix: ')';
}

.custom-list-dot .custom-list.custom-list-prefix-close-dot {
  --counter-suffix: ').';
}

/* custom-list-prefix-close の中の custom-list-dash の記号を左に */
.custom-list-prefix-close .custom-list-dash li::before {
  left: -0.5em;
  /* 記号を左に移動 */
}

/* より深いネストにも対応 */
.custom-list.custom-list-prefix-close .custom-list-dash li::before {
  left: -0.5em;
}

/* custom-list-prefix-close-dot の中でも同様 */
.custom-list-prefix-close-dot .custom-list-dash li::before {
  left: -0.5em;
}

.custom-list-start-1-1 {
  counter-reset: item 0;
  /* 0からスタートして、1.1, 1.2, 1.3... */
  --counter-prefix: "1.";
}

.custom-list-start-2-1 {
  counter-reset: item 0;
  /* 0からスタートして、1.1, 1.2, 1.3... */
  --counter-prefix: "2.";
}

.custom-list-start-3-1 {
  counter-reset: item 0;
  /* 0からスタートして、1.1, 1.2, 1.3... */
  --counter-prefix: "3.";
}

.custom-list-start-3-2-1 {
  counter-reset: item 0;
  /* 0からスタートして、1.1, 1.2, 1.3... */
  --counter-prefix: "3.2.";
}

.custom-list-start-4-1 {
  counter-reset: item 0;
  /* 0からスタートして、1.1, 1.2, 1.3... */
  --counter-prefix: "4.";
}

.custom-list-start-5-1 {
  counter-reset: item 0;
  /* 0からスタートして、1.1, 1.2, 1.3... */
  --counter-prefix: "5.";
}

.custom-list-start-6-1 {
  counter-reset: item 0;
  /* 0からスタートして、1.1, 1.2, 1.3... */
  --counter-prefix: "6.";
}

.custom-list-start-1-1 li::before {
  font-weight: normal !important;
}

.custom-list-start-2-1 li::before {
  font-weight: normal !important;
}

.custom-list-start-3-1 li::before {
  font-weight: normal !important;
}

.custom-list-start-3-2-1 li::before {
  font-weight: normal !important;
}

.custom-list-start-4-1 li::before {
  font-weight: normal !important;
}

.custom-list-start-5-1 li::before {
  font-weight: normal !important;
}

.custom-list-start-6-1 li::before {
  font-weight: normal !important;
}

.custom-list-start-3-2-1 li {
  padding-left: 2.8em;
  /* パディングも広く設定 */
}
