/* 変数 */
:root {
    --code-baclground-color : rgb(242, 242, 255) ;
}



/* ========================================================================
## ギフトの一覧
======================================================================== */

.gift_thumbnail_field{
    position: relative;
    width:100%;
    display: grid;
    
    grid-template-columns: repeat(4, 1fr);
    row-gap: 20px;
}

/* 各ブロックを基準位置とする */
.gift_thumbnail{
    position: relative;
    width:86%;
    height: fit-content;
    
    overflow-y: hidden;
    margin: 0 auto;
    background-color: rgba(201, 236, 202, 0.248);
}

.gift_thumbnail:hover{
    background-color: rgba(201, 236, 202, 1);
}



/* 画像 */
.gift_thumbnail_image{
    position: relative;
    margin: 2% auto;
    
    width: 90%;
    aspect-ratio: 1/1;
}

/* タイトル + ラベル */
.gift_thumbnail_title{
    position: relative;
    font-size: 11px;
    width:90%;
    margin: 0 auto;
    height:24px;
    background-color: rgba(36, 74, 37, 0.208);;
}
.gift_thumbnail_label{
    position: relative;
    font-size: 11px;
    width:90%;
    margin: 4px auto;
    height:24px;
    
    border: 1px black dashed;
    box-sizing: border-box;
}