* {
    box-sizing: border-box; 
} 


/* 既存に追加・置き換え */
html, body { 
    height: 100%; 
    margin: 0; }

body{
  min-height: 100svh;          /* 画面高を必ず満たす */
  display: flex;
  flex-direction: column;
}

#iyzne{
    color:black;
    height:120px;
    margin:1.5rem auto;
    display:block;
}

#post-list .gallery{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(200px, 45vw), 1fr));
    gap: 2rem;
    padding: 1.5rem 6rem;
    justify-content: center;
    align-items: end;
    align-content: center;
}

.gallery .card {
    text-decoration: none;
    color: #333;
    display: flex;
    flex-direction: column-reverse;
    gap: .5rem;
    margin-bottom: 1rem;
}

.gallery .card img{
    width: 100%;
}

.gallery .card .caption{
    text-align: center;
    font-size: 1.5rem;;
}

.footer{
    /* height: 25vh; でもOK。固定高さなら 100px でもOK */
    height: 15vh;               
    background: #333;
    display: flex;
    align-items: center;          /* 中央寄せ */
    justify-content: center;      /* 中央寄せ */
    margin-top: auto;             /* ← これで下に張り付く */
  }
  
  .footer-logo{
    display: block;               /* 画像のベースライン隙間ケア */
    max-height: 60%;
  }

  @media (max-width:560px){ 
    .footer{
        height: 10vh;
    }

    #post-list .gallery{
        /* 3列固定 */
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 8px;                 /* 余白を小さく */
        padding: 12px;            /* 両サイドも圧縮 */
    }
    
      #post-list .gallery > *{ 
        min-width: 0; 
    }
    
      .gallery .card img{
        width: 100%;
        display: block;
        aspect-ratio: 1/1;
        object-fit: cover;
       
    }
    
    .gallery .card .caption{ 
        font-size: .7rem; 
    } /* 任意で少し小さく */

}