@media screen and (max-width: 3000px) {
    .bgImagine {
        width: 100%;
        aspect-ratio: 3000/1688;
	position: relative;
        overflow: hidden;
        z-index: 2;
    }

    .bgImagine .cross {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        opacity: 0;
        transition: opacity 0.5s ease-in-out; /* バックアップトランジション */
        z-index: 1;
    }
    
    /* アクティブスライド用 */
    .bgImagine .cross.active {
        opacity: 1;
        z-index: 2;
    }

    .bgImagine .cross .imagine {
        width: 100%;
        height: 100%;
        /*position: relative;*/
    }

    .bgImagine .cross .texter {width:100vw;
        position: absolute;
        /*writing-mode: vertical-rl;
        -webkit-writing-mode: vertical-rl;
        -ms-writing-mode: tb-rl;
        text-orientation: upright;
        -webkit-text-orientation: upright;*/
        
  	bottom: 20%;
        left: 20%;
        
        white-space: nowrap;
        /*height: 80%;
        display: flex;
        align-items: center;*/
    }

    .back_product001 {
        background: url("../img/index01_LL.jpg") no-repeat;
        aspect-ratio: 3000/1688;
        background-size: 100%;justify-self: stretch;
        grid-column-start: 1;
        grid-row-start: 1;background-color: rgba(0,0,0,0.1);
        background-blend-mode:overlay;
    }
    .back_product002 {
        background: url("../img/index02_LL.jpg") no-repeat;
        aspect-ratio: 3000/1688;
        background-size: 100%;justify-self: stretch;
        grid-column-start: 1;
        grid-row-start: 1;background-color: rgba(0,0,0,0.1);
        background-blend-mode:overlay;
    }
    .back_product003 {
        background: url("../img/index03_LL.jpg") no-repeat;
        aspect-ratio: 3000/1688;
        background-size: 100%;
        justify-self: stretch;
        grid-column-start: 1;
        grid-row-start: 1;background-color: rgba(0,0,0,0.1);
        background-blend-mode:overlay;
    }
    .back_product004 {
        background: url("../img/index04_LL.jpg") no-repeat;
        aspect-ratio: 3000/1688;
        background-size: 100%;justify-self: stretch;
        grid-column-start: 1;
        grid-row-start: 1;background-color: rgba(0,0,0,0.1);
        background-blend-mode:overlay;
    }
    .back_product005 {
        background: url("../img/index05_LL.jpg") no-repeat;
        aspect-ratio: 3000/1688;
        background-size: 100%;justify-self: stretch;
        grid-column-start: 1;
        grid-row-start: 1;background-color: rgba(0,0,0,0.1);
        background-blend-mode:overlay;
    }
    .back_product006 {
        background: url("../img/index101_LL.jpg") no-repeat;
        aspect-ratio: 3000/1688;
        background-size: 100%;justify-self: stretch;
        grid-column-start: 1;
        grid-row-start: 1;background-color: rgba(0,0,0,0.1);
        background-blend-mode:overlay;
    }
    
}

@media screen and (max-width: 767px) {
    .bgImagine {
        width: 100%;
        aspect-ratio: 800 / 1000;
        position: relative;
        overflow: hidden;
        z-index: 2;
    }

    .bgImagine .cross {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        opacity: 0;
        transition: opacity 0.5s ease-in-out; /* バックアップトランジション */
        z-index: 1;
    }
    
    /* アクティブスライド用 */
    .bgImagine .cross.active {
        opacity: 1;
        z-index: 2;
    }

    .bgImagine .cross .imagine {
        width: 100%;
        height: 100%;
        position: relative;
    }

    .bgImagine .cross .texter {width:100vw;
        position: absolute;
        /*writing-mode: vertical-rl;
        -webkit-writing-mode: vertical-rl;
        -ms-writing-mode: tb-rl;
        text-orientation: upright;
        -webkit-text-orientation: upright;*/
        bottom: 20%;
        left: 20%;
        /*height: 80%;
        display: flex;
        align-items: center;*/
    }

    .back_product001 {
        background: url("../img/index01_s.jpg") no-repeat;
        aspect-ratio: 800/1000;
        background-size: 100%;background-color: rgba(0,0,0,0.1);
        background-blend-mode:overlay;justify-self: stretch;
        grid-column-start: 1;
        grid-row-start: 1;
    }
    .back_product002 {
        background: url("../img/index02_s.jpg") no-repeat;
        aspect-ratio: 800/1000;
        background-size: 100%;background-color: rgba(0,0,0,0.1);
        background-blend-mode:overlay;justify-self: stretch;
        grid-column-start: 1;
        grid-row-start: 1;
    }
    .back_product003 {
        background: url("../img/index03_s.jpg") no-repeat;
        aspect-ratio: 800/1000;
        background-size: 100%;
        background-color: rgba(0,0,0,0.1);
        background-blend-mode:overlay;justify-self: stretch;
        grid-column-start: 1;
        grid-row-start: 1;
    }
    .back_product004 {
        background: url("../img/index04_s.jpg") no-repeat;
        aspect-ratio: 800/1000;
        background-size: 100%;justify-self: stretch;
        grid-column-start: 1;
        grid-row-start: 1;background-color: rgba(0,0,0,0.1);
        background-blend-mode:overlay;
    }
    .back_product005 {
        background: url("../img/index05_s.jpg") no-repeat;
        aspect-ratio: 800/1000;
        background-size: 100%;justify-self: stretch;
        grid-column-start: 1;
        grid-row-start: 1;background-color: rgba(0,0,0,0.1);
        background-blend-mode:overlay;
    }
    .back_product006 {
        background: url("../img/index101_s.jpg") no-repeat;
        aspect-ratio: 800/1000;
        background-size: 100%;justify-self: stretch;
        grid-column-start: 1;
        grid-row-start: 1;background-color: rgba(0,0,0,0.1);
        background-blend-mode:overlay;
    }
    
    
}