
@media screen and (max-width:3000px){
.flow-container {background:#d2d2d2;
    position: relative;
    width: 100%;
    aspect-ratio:3000/1688;
    overflow: hidden;
}

.flow-slider {
    position: relative;
    width: 100%;
    height: 100%;
}

.flow-slide {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    visibility: hidden;
}

.slide-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    opacity: 0;
}

.flow-content {
    position: absolute;
    width:100vw;
    /*max-width: 800px;*/
    left: 50%;
    top: 30%;
    transform: translate(-50%, -30%);
    text-align: center;
    /*color: white;*/
    opacity: 0;
    z-index: 10;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7);
}

/*h2 {font-family: "Kiwi Maru", serif;
    
    margin-bottom: 1rem;
}*/

/*p {font-family: "Kiwi Maru", serif;
    
}*/

/* 最初のスライドだけ表示 */
.flow-slide:first-child {
    visibility: visible;
}

/* 背景画像の設定 */
.back_flow01 {
    background: url("../img/index01_LL.jpg") no-repeat center center;
    background-size: 100%;
}

.back_flow02 {
    background: url("../img/index02_LL.jpg") no-repeat center center;
    background-size: 100%;
}

.back_flow03 {
    background: url("../img/index03_LL.jpg") no-repeat center center;
    background-size: 100%;
}

.back_flow04 {
    background: url("../img/index04_LL.jpg") no-repeat center center;
    background-size: 100%;
}
.back_flow05 {
    background: url("../img/index05_LL.jpg") no-repeat center center;
    background-size: 100%;
}

}

@media screen and (max-width:768px){
.flow-container {background:#d2d2d2;
    position: relative;
    width: 100%;
    aspect-ratio:800/1250;
    overflow: hidden;
}

.flow-slider {
    position: relative;
    width: 100%;
    height: 100%;
}

.flow-slide {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    visibility: hidden;
}

.slide-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    opacity: 0;
}

.flow-content {
    position: absolute;
    width:100vw;
    /*max-width: 800px;*/
    left: 50%;
    top: 30%;
    transform: translate(-50%, -30%);
    text-align: center;
    /*color: white;*/
    opacity: 0;
    z-index: 10;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7);
}

/*h2 {font-family: "Kiwi Maru", serif;
    
    margin-bottom: 1rem;
}*/

/*p {font-family: "Kiwi Maru", serif;
    
}*/

/* 最初のスライドだけ表示 */
.flow-slide:first-child {
    visibility: visible;
}

/* 背景画像の設定 */
.back_flow01 {
    background: url("../img/index01_MS.jpg") no-repeat center center;
    background-size: 100%;
}

.back_flow02 {
    background: url("../img/index02_MS.jpg") no-repeat center center;
    background-size: 100%;
}

.back_flow03 {
    background: url("../img/index03_MS.jpg") no-repeat center center;
    background-size: 100%;
}

.back_flow04 {
    background: url("../img/index04_MS.jpg") no-repeat center center;
    background-size: 100%;
}

.back_flow05 {
    background: url("../img/index05_MS.jpg") no-repeat center center;
    background-size: 100%;
}


}