/* =======================================================================
   Shop Page Styles
   店舗情報（一覧）・店舗詳細・エリア別アーカイブページ用スタイル
======================================================================= */
.main-offset {
    position: relative;

    &:after {
        content: "";
        background: url(../images/tree_02.svg) no-repeat center;
        background-size: contain;
        width: clamp(13.5rem, -1.929rem + 32.14vw, 27rem);
        height: clamp(15.875rem, -2.339rem + 37.95vw, 31.813rem);
        position: fixed;
        top: 48vh;
        right: 0;
        left: initial;
        z-index: -1;
    }
}

#shop {
    position: relative;
    z-index: 100;

    .shop-list {
        .shop-list__item {
            .shop-list__area {
                a {
                    text-decoration: none;
                }
            }
        }
    }

    .store-fields,
    .gmap-container {
        box-sizing: border-box;
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .store-fields__photos {
        display: flex;
        flex-wrap: wrap;
        gap: 16px;
        
        img {
            border-radius: 20px;
            width: 100%;
            height: 100%;
            max-height: 350px;
            object-fit: cover;
        }
        
        .store-fields__photo:nth-child(1) {
            width: 100%;
        }
        
        .store-fields__photo:nth-child(2),
        .store-fields__photo:nth-child(3) {
            width: calc(50% - 8px);
        }
    }

    .store-fields__info {
        background-color: #ffffffcd;
        border-radius: 20px;
        margin: 1rem 0;
        padding: 1rem;
        width: 100%;

        td {
            display: block;
        }

        .store-fields__label {
            color: #e95513;
            font-weight: 700;
            padding: 2rem 0 0.5rem;
        }
    }
} /* //#shop */




/* =======================================================================
   Media Query
======================================================================= */
@media (min-width: 769px) {
    #shop {
        .store-fields__info {
            td {
                display: table-cell;
                padding: 0.75rem 0;
                vertical-align: center;
            }

            .store-fields__label {
                padding: 0.75rem 0;
                width: 5.5rem;
                vertical-align: top;
            }
        }
    } /* //#shop */
}