#Body .bg-emerald-50 { background-color: #ecfdf5; }
#Body .hover\:bg-emerald-100:hover { background-color: #d1fae5; }
#Body .border-emerald-600 { border-color: #059669; }


.mr-6 { margin-right: 1.5rem; }
.mt-0 { margin-top: 0; }
.mt-10 { margin-top: 40px; }
.float-left { float: left; }
.text-right { text-align: right; }
.nobr { white-space: nowrap; }


 #pageContents p { font-size: 1.125rem; line-height: 2rem; }

 #pageContents h1 {
   line-height:3rem;
   text-align: center;
   font-weight: 700;
   margin-bottom: 2.5rem;
 }
 /* #pageContents h1 > span { font-size: 2rem; } */

 #pageContents h2 {
   line-height:3rem;
   text-align: left;
   font-weight: 700;
   margin-top: 4rem;
   margin-bottom: 1rem;
   font-size: 1.25rem;
 }

 @media (min-width: 768px) {
   #pageContents h1 {
     font-size: 2.25rem;
     line-height: 1.6;
     margin-bottom: 4rem;
   }
 }

 @media (min-width: 1024px) {
   #pageContents h1 {
     font-size: 2rem;
     line-height: 1.6;
     margin-top: 4rem;
     margin-bottom: 4rem;
   }
 }


 /* 記事内：単体画像 */
 .article-image {
   max-width: 600px;
   margin: 0 auto 20px;
   padding: 20px;
   text-align: center;
 }

 .article-image > div:first-child {
   overflow: hidden;
 }

 .article-image > div:first-child img {
   display: block;
   width: 100%;
   height: auto;
   margin: 0 auto;
   transition: transform 0.4s ease;
 }

 .article-image > div:first-child img[data-modal] {
   cursor: pointer;
 }

 .article-image > div:first-child:hover img[data-modal] {
   transform: scale(1.01);
 }

 .article-image figcaption,
 .article-images figcaption {
   margin-top: 8px;
   font-size: 0.9rem;
 }


 /* 記事内：画像の横並び */
 .article-images {
   display: flex;
   gap: 20px;
   margin: 0 auto 20px;
 }

 .article-images figure {
   flex: 1;
   margin: 0;
   text-align: center;
 }

 .article-images figure > div:first-child {
   overflow: hidden;
 }

 .article-images img {
   display: block;
   width: 100%;
   max-height: 400px;
   object-fit: contain;
   transition: transform 0.4s ease;
 }

 .article-images img[data-modal] {
   cursor: pointer;
 }

 .article-images figure > div:first-child:hover img[data-modal] {
   transform: scale(1.01);
 }


 /* スマートフォン */
 @media (max-width: 640px) {
   .article-images {
     flex-direction: column;
   }

   .article-images img {
     max-height: 600px;
   }
 }




 .article-video {
   max-width: 900px;
   margin: 0 auto 20px;
   padding: 20px;
   text-align: center;
 }

 .article-video > div:first-child {
   overflow: hidden;
 }

 .article-video video {
   display: block;
   width: 100%;
   height: auto;
   margin: 0 auto;
 }

 .article-video figcaption {
   margin-top: 8px;
   font-size: 0.9rem;
 }