:root{
    --red:#e60011;
    --dullRed:#af4233;
    --btnActive:#eb503c;
    --fontBaseSize:clamp(.875rem, .591rem + 1.42vw, 1.5rem);
}

#lpHeader{
    display:none;
}

[id*="lppage"]{

    font-size:var(--fontBaseSize);

    min-height:100vh;
    display: grid;
    grid-template-columns:1fr; grid-template-rows:150px 1fr 100px;

    #lpHeader{
        display: flex; align-items: center; justify-content: center; color:#fff;
        /* background-image:url(images/smple-headerBG-vege.jpg); */
        background-image:url(https://gigaplus.makeshop.jp/tanehyo/images/LP/sample/smple-headerBG-vege.jpg);
        background-position:center; background-size:cover;
    }

    &[id*="ct140"]{
        #lpHeader{
            background-image: url(https://gigaplus.makeshop.jp/tanehyo/images/LP/sample/smple-headerBG-tomato.jpg);
        }
    }/*ct140*/

    iframe{
        width:100%;
    }
    .cart-btn{
        background:var(--dullRed); 

        &:hover{
            cursor: pointer;
        }
    }

    main{
        .product-container{
            .side-bar{
                display:none !important;
            }
       }
       .product-contents-wrap{
            width:100%;
        
            .product-caption{
                color:red;
            }
       }
    }/*main*/

    #lpFooter{
        display:flex; align-items: center; justify-content: center; width:100%; height:100%;
        background:#ccc; color:#fff;
    }/*lpFooter*/


    .tanehyoLpWrapper{
        font-size:var(--fontBaseSize);

        min-height:100vh;
        display: grid;
        grid-template-columns:1fr; grid-template-rows:150px 1fr 100px;

        header{
            display: flex; align-items: center; justify-content: center; color:#fff;
        }

        .block{
            width:clamp(375px, 100%, 1840px); margin:0 auto; padding:min(20px, 4vw);
        }
        .itemList{
            display:flex; flex-wrap:wrap; gap:min(15px, 3vw);

            .topic{
                background:#fff; padding:min(15px, 3vw); border:1px solid #ccc;
                width:calc((100% / 4) - min(15px, 3vw));

                .pict{
                    width:100%; aspect-ratio:4/3; background:#ccc; margin-bottom: .5em; overflow: hidden;

                    img{
                        width:100%; height:100%; object-fit:cover; object-position: center;
                        transition-duration:.3s;
                    }
                }
                .cont{
                    margin-bottom: 1em;

                    .title{
                        font-size:110%; font-weight:600; margin-bottom: .25em;
                    }
                    .text{
                        margin-bottom: .75em; font-size:75%;
                    }
                }/*cont*/
                .data{
                    margin-bottom: .75em;

                    p{
                        color:#999; font-size:75%;
                    }
                }

                .price{
                    color:var(--red); font-weight:600; font-size:125%;
                }
                .cart-btn{
                    display: flex; align-items: center; justify-content: center;
                    width:100%; height:2.5em; color:#fff;
                }
            }
        }/*itemList*/

    }/*tanehyoLpWrapper*/




    @media screen and (width <= 1280px){
        .tanehyoLpWrapper{
            .itemList{
                gap:3vw;

                .topic{
                    width:calc((100% / 3) - 2vw);
                }
            }
        }
    }/*〜1280*/



    @media screen and (width <= 768px){
        .tanehyoLpWrapper{
            .itemList{

                .topic{
                    width:calc((100% / 2) - 1.5vw);
                }
            }
        }
    }/*〜1280*/



    @media (hover){
        .tanehyoLpWrapper{
            .itemList{
                .topic{
                    &:has(.cart-btn:hover){
                        .pict{
                            img{
                                transform:scale(1.1);
                            }
                        }
                    }  
                }
            }/*itemList*/

            .cart-btn{
                &:hover{
                    background:var(--btnActive);
                }
            }
        }/*tanehyoLpWrapper*/
        

        
    }

}/*[id*="lppage"]*/



    


    

