.single-download-link {
  display: block; 
  padding: 12px 0; 
  border-bottom: 1px dashed #ccc; 
  text-decoration: none; 
  color: #333;
}
.single-download-link:last-child {
  border-bottom: none;
}

.single-download-link .file-name {
  padding-left: 10px;
}

/* =========================================
   共通のアイコン設定（今後の追加アイコンでも使い回します）
========================================= */
.icon {
    display: grid;
    align-items: center;
    grid-template-columns: 24px 1fr;
    gap: 10px;
}

.icon::before {
    content: '';
    display: inline-block;
    width: 24px;  /* 全アイコン共通の基本サイズ */
    height: 24px; /* 全アイコン共通の基本サイズ */
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    margin-right: 8px; /* アイコンとテキストの隙間 */
    flex-shrink: 0;
}

.icon-right {
    display: grid;
    align-items: center;
    grid-template-columns: 1fr 24px;
    gap: 10px;
}

.icon-right::after {
    content: '';
    display: inline-block;
    width: 24px;  
    height: 24px; 
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    margin-left: auto; /* ★ここを auto にすることで、強制的に右端に寄ります */
    flex-shrink: 0;
}

.button-2col {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin: 1em 0 2em 0;
    font-size: 0.85em;
}

.button-2col .single-download-link {
    border: none;
    background-color: #eee;
    padding: 0.5em 1em 0.5em 0.5em;
    border-radius: 2em;
    text-align: center;
}

/* =========================================
   個別のアイコン画像指定（画像パスだけを指定します）
========================================= */
.folder-icon::before,
.folder-icon::after {
    background-image: url('/mypage/img/icon_folder.png');
}
.download-icon::before,
.download-icon::after {
    background-image: url('/mypage/img/icon_download.png');
}