p.presen_top {
   text-align: left !important;  /* 両端揃え（justify）を解除して字間割れを防ぐ */
   color: #333;                  /* 真っ黒ではなく濃いグレーで可読性向上 */
   margin:  0;
}
p.presen {
   text-align: left !important;  /* 両端揃え（justify）を解除して字間割れを防ぐ */
   color: #333;                  /* 真っ黒ではなく濃いグレーで可読性向上 */
   margin: 1em 0;
}
.text-red {
   color: #e60012 !important; /* 落ち着いた赤色（!importantをつけて確実に色を変えます） */
   font-weight: bold;
   font-size: 1.3em;
}
.text-bold {
   font-weight: bold;
   font-size: 1.1em;
}
.alert-box {
   border: 2px solid #e60012; /* 文字色と同じ赤で統一 */
   background-color: #fff5f5; /* ほんのり赤い背景 */
   padding: 1.2em;            /* 内側の余白を少し広めに */
   border-radius: 6px;        /* 角丸 */
   margin: 1.5em 0;
   box-shadow: 0 2px 5px rgba(230, 0, 18, 0.1); /* 薄い影をつけて少し浮かせる */
}
.fee-table {
   width: 100%;               /* スマホでは横幅いっぱいに */
   max-width: 500px;          /* パソコン画面で広がりすぎないように制限 */
   margin: 2em auto;             /* 上下の余白 */
   border-collapse: collapse; /* セル同士の隙間を無くして1本の線にする */
   font-size: 1.1em;
}

.fee-table th,.fee-table td {
   border: 1px solid #dcdcdc; /* 枠線の色（薄いグレー） */
   padding: 1em;              /* セル内の余白 */
   text-align: center;        /* 文字を中央揃え */
   color: #333;
}

.fee-table th {
   background-color: #f7fcff; /* 見出しの背景色（すでにお使いの薄い水色） */
   font-weight: bold;
}

ol.presen-list {
   padding: 1.5em;
   padding-left: 2.5em;          /* 数字がはみ出さないように左の余白を少し広めにとる */
   margin: 1em 0 1.5em 0;
   background-color: #f7fcff;    /* 薄い水色の背景 */
   border: 1px solid #e0f0fa;    /* 薄い水色の枠線 */
   border-radius: 6px;           /* 少し角を丸く */
}

ol.presen-list li {
   margin-bottom: 1em;         /* 項目ごとの行間 */
   line-height: 1.5;
   color: #333;
   text-align: left;
   font-size: 1.1em;
}

ol.presen-list li:last-child {
   margin-bottom: 0;             /* 最後の項目の下余白を消す */
}
/* 箇条書きリストのデザイン */
ul.presen-list {
   list-style-type: disc;        /* 黒丸（●）のリスト記号を表示 */
   padding-left: 1.5em;          /* 左側の余白（黒丸がはみ出さないようにする） */
   margin: 1.5em 0;              /* 上下の余白 */
   color: #333;                  /* 文字色 */
}
ul.presen-list li {
   margin-bottom: 0.8em;         /* リストの各項目の間の余白 */
   line-height: 1.6;             /* 行間を少し広げて読みやすくする */
   font-size: 1.1em;             /* 文字サイズ */
}
ul.presen-list li:last-child {
   margin-bottom: 0;             /* 最後の項目の下の余白を消す */
}
/* 項目と内容を綺麗に揃える設定 */
.flex-item {
   display: flex;          /* 横並びにする設定 */
}

.flex-label {
   white-space: nowrap;    /* 「受付時間」の文字が途中で改行されないようにする */
   margin-right: 1em;      /* 「受付時間」と「１日目」の間の余白（全角スペース1個分） */
}
div.presens_check{
   display: flex;
   justify-content: center;
   gap: 20px;
   flex-wrap: wrap;
}
img.presen-btn {
   width: 80%;            /* スマホなどの画面が狭い時は横幅いっぱいに広げる */
   max-width: 300px;       /* ★ここでお好みの横幅（サイズ）に制限します */
   height: auto;           /* 縦横比を崩さない */
   display: block;         /* 配置をコントロールするためにブロック化 */
   margin: 1em auto 0 auto;
   transition: 0.3s;       /* マウスを乗せたときのアニメーションを滑らかに */
}
/* マウスを乗せたときに少し明るくする演出（リンクボタンらしくなります） */
img.presen-btn:hover {
   opacity: 0.8;
}



@media screen and (max-width: 480px) {
.fee-table th,.fee-table td {
   padding: 0.8em 0.5em;   /* 画面が狭いときは余白を少し減らす */
   font-size: 0.95em;      /* 文字サイズを少し小さくして改行を防ぐ */
}
.fee-table td:nth-child(2) {
   padding-right: 1em;     /* スマホでは右の余白を少し狭くする */
}


@media screen and (min-width: 768px) {
div.presens_check{
   flex-direction: row;
}
img.presen-btn {
   margin: 1.5em 0;      /* 横並び時は上下のみマージンを設定 */
}
}
