/* 背景 */
.footer-bg { background-color: #f7dfe2; }

.footer-bg .row { align-items: stretch; }
.footer-left { min-height: 100%; }

/* ロゴ */
.footer-logo { display:block; max-width: 240px; }
.footer-logo img { width:100%; height:auto; display:block; }

/* SNSアイコン（統合版） */
.sns-icon{
    --size: 36px;
    display:inline-flex; align-items:center; justify-content:center;
    width:var(--size); height:var(--size); aspect-ratio:1/1;
    border-radius:50%;
    background:#4d4d4d; color:#fff;
    line-height:1; text-decoration:none;
    transition:opacity .2s;
}
.sns-icon:hover{ opacity:.8; }
.sns-icon .bi{ font-size:calc(var(--size)*.55); line-height:1; display:block; }

/* 会社情報：2カラムGrid（左：ラベル、右：本文） */
.footer-bg .company-list{
    display: grid;
    grid-template-columns: max-content 1fr; /* ラベル幅は実サイズ、本文は残り全部 */
    column-gap: .8rem;
    row-gap: .6rem;
    margin: 0 0 1rem;
}

/* ラベル＆本文の余白を潔くリセット */
.footer-bg .company-list dt,
.footer-bg .company-list dd{
    margin: 0;
}

/* ラベルは左列・太字 */
.footer-bg .company-list dt{
    grid-column: 1;
    font-weight: 700;
    white-space: nowrap; /* 折り返し防止（長い場合は調整） */
}

/* 本文は右列＋左ボーダーで区切り線を統一的に描く */
.footer-bg .company-list dd{
    grid-column: 2;
    border-left: 1px solid rgba(0,0,0,.5); /* ← 区切り線はここで一本化 */
    padding-left: .8rem;                   /* 線と本文の間隔 */
}

/* リンクのトーン（任意） */
.footer-link{ color:#0069ff; text-decoration: underline; }

/* コピーライトを右下へ */
.copyright{ margin-top:auto; font-size:.95rem; color:#333; }

/* 影付きの区切り線（任意） */
.shadow-divider{
    height:12px; border-top:1px solid #e9e9e9;
    background: linear-gradient(to bottom, rgba(0,0,0,.18), rgba(0,0,0,0));
    opacity:.35; border-radius:2px;
}
.shadow-divider.full{
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}

@media (max-width: 768px) {
    .footer-left {
        flex-direction: row;
        align-items: center;
        justify-content: flex-start;
        gap: 1rem; /* ロゴとSNSの横間隔 */
        margin-bottom: 40px;
    }

    .sns-icon{ --size: 32px; }

    .footer-logo img {
        max-width: 140px; /* SP用に少し縮小 */
        height: auto;
    }

    .footer-sns {
        display: flex;
        gap: 0.5rem; /* SNSアイコン同士の間隔 */
    }
}