/* カスタマイズ用CSS */

/* 背景色の設定 */
body {
    background: #fff !important;
}

/* HERO部分のみ黒背景 - 横幅いっぱい */
.apple-hero {
    background: #000 !important;
    color: #fff;
    width: 100vw !important;
    position: relative !important;
    left: 50% !important;
    right: 50% !important;
    margin-left: -50vw !important;
    margin-right: -50vw !important;
    overflow-x: hidden;
}

/* その他のセクションは白背景 */
.ec-layoutRole {
    background: #fff !important;
    overflow-x: hidden; /* 横スクロールを防ぐ */
}

.product-section,
.new-arrival-section {
    background: #f5f5f7 !important;
}

.featured-section {
    background: #000 !important;
    color: #fff;
}

/* モバイル用2列表示 */
@media screen and (max-width: 767px) {
    .ec-shelfGrid .ec-shelfGrid__item {
        width: 50% !important;
        padding: 0 8px;
    }
    
    .ec-shelfGrid .ec-shelfGrid__item:nth-child(odd) {
        padding-right: 8px;
    }
    
    .ec-shelfGrid .ec-shelfGrid__item:nth-child(even) {
        padding-left: 8px;
    }
    
    /* 商品画像のサイズ調整 */
    .ec-shelfGrid .ec-shelfGrid__item-image img {
        width: 100%;
        height: auto;
        max-height: 200px;
        object-fit: contain;
    }
    
    /* テキストサイズの調整 */
    .ec-shelfGrid .ec-shelfGrid__item p {
        font-size: 14px;
        line-height: 1.4;
    }
    
    .ec-shelfGrid .ec-shelfGrid__item .price02-default {
        font-size: 16px;
        font-weight: bold;
    }
}