@media screen and (max-width:992px) {

/* support iOS */
    html{
        height: -webkit-fill-available;
    }
    body{
        min-height: 100vh;
        min-height: -webkit-fill-available;
    }
    .elNumber{
        position: absolute;
        background: rgba(51,51,51,.7);
        bottom: 36px!important;
        padding: 7px 0px!important;
        left: 46%!important;
        font-size: 10px;
        margin-left: -1.875em;
        width: 5.75em!important;
        line-height: 0px;
        border-radius: 14px;
        text-align: center;
        color: #fff;
        font-family: Helvetica,Arial;
    } 
    a.elShow.back-start-point{
        pointer-events: all!important;
    }
    .elLast {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 97%;
        background: rgba(51,51,51,.7);
    
    }

    .elLast .elBack span::before {
        left: 50%;
        margin-left: -23px;
    }

    .elLast .elBack a {
        box-sizing: border-box;
        position: absolute;
        top: 50%;
        left: 50%;
        border-radius: 5px;
        margin: -40px 0 0 -40px;
        width: 80px;
        height: 80px;
        color: inherit;
        background: #fff;
    }
    .mdItemImageE .elLast .elBack span {
        position: relative;
        display: inline-block;
        line-height: inherit;
        padding-left: 46px;
        position: absolute;
        top: 50%;
        left: 0;
        width: 100%;
        font-size: 11px;
        text-align: center;
        padding: 46px 0 0 0;
        margin-top: -29px;
    }
    .elLast .elBack span::before {
        position: absolute;
        content: "f5d1";
        font-family: "icon2.0";
        speak: none;
        font-family: 'Font Awesome 5 Free';
        font-size: 37px;
        line-height: 1;
        width: 15px;
        top: -46px;
        left: 38px;
        color: grey;
        font-family: "Font Awesome 5 Free";
        font-weight: 900;
        content: "\f053";;
    }
 
    .start-prev-txt{
        margin-top: 56px;
        position: absolute;
        font-size: 11px;
        margin-left: 15px;
    }
        

    .swiper-button-next.swiper-button-disabled {
        opacity: 1;
        cursor: auto;
        pointer-events: visiblepainted;
    }
    .swiper-button-prev.swiper-button-disabled{
        opacity: 0.35;
        cursor: auto;
        pointer-events: visiblepainted;
        display: none;
    }
    .modal_grils_slider-sp{
        overflow: scroll;
        -webkit-overflow-scrolling: touch;
        
        position: fixed;
        top: 0;
        left: 0;
        bottom: 0;
        width: 100%;
        height:1032px;
        /* padding: 30px; */
        display: flex;
        align-items: center;
        justify-content: center;
        /* transition: opacity 0.3s; */
        pointer-events: none;
        opacity: 0;
        z-index: 100;
        background-color: #333;
    }
    .modal-mdImageGallery{
        position: relative;
        display: flex;
        /* background-color: #fff; */
        width: 100%;
        max-width: 900px;
        /* padding: 20px; */
        top: -2.5vh;
        justify-content: center;
        align-items: center;
        align-content: center;
        flex-direction: column;
    }
    .display-flex-and-align-items{
        display: flex;
        align-items: center;
    }


    .justify-content-center{
        justify-content: center;
    }
    .standard{
        font-weight: 600;
        color: #c6dfb9;
        font-size: 6.5vw!important;
      }
    .modal_grils_slider-sp.is-active {
        opacity: 1;
        pointer-events: auto;
        /* flex-direction: column;
        overflow-y: scroll; */
        z-index: 10000;
        transition: opacity .2s ease-out;
        opacity: 1;
      }


      .sp_modal_grils_closed:before {
        font-family: Arial,"Helvetica CY","Nimbus Sans L",sans-serif !important;
        font-size: 86px;
        line-height: 35px;
        position: relative;
        top: -45px;
        /* left: 98%; */
        left: 85%;
        display: block;
        width: 34px;
        content: "\00d7";
        text-align: center;
        z-index: 9999;
        color: white;
    }

    .sp-girls_modal_photo2{
        display: flex;
        padding: 0;
        gap: 6px;
        /* margin-top: -10px; */
    }

    .sp-girls_modal_photo-tumbanail {
     
        width: 50px;
    }


    img.modal_img {
        box-sizing: border-box;
        border: 2px solid #fff;
        border-radius: 5px;
        width: 45px;
        height: auto;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
    }

    img.modal_img.elActive {
        border-color: #ff8400;
    }

    .elClose span::before {
        position: absolute;
        speak: none;
        /* font-size: 18px; */
        line-height: 1;
        width: 5.02px;
        text-indent: -5.1948px;
        top: 60%;
        margin-top: -9px;
        left: 13px;
        font-family: "Font Awesome 5 Free";
        font-weight: 00;
        content: "\f053";
    }

    .elClose{
        position: fixed;
        z-index: 5000002;
        left: 10px;
        top: 10px;
        display: inline-block;
        line-height: 30px;
        border: 1px solid #1a1a1a;
        /* padding: 0 14px; */
        padding: 0px 21px;
        background: #333;
        font-size: 10px;
        border-radius: 5px;
        color: #fff;
        padding-right: 15px;
    }

    a.elClose:hover {
        color: white;
    }

    /* その場で */
    .fadeout {
        animation-name: fadeout;
        animation-duration: 0.1s;
        animation-timing-function: ease-out;
        animation-fill-mode: forwards;
        
        pointer-events: none;
      }
    .fadein {
        animation-name: fadein;
        animation-duration: 0.1s;
        animation-timing-function: ease-out;
        animation-fill-mode: forwards;
     }
    

    @keyframes fadein {
        0% {
           opacity: 0;
           transform: translateY(0);
        }
        100% {
           opacity: 1;
           transform: translateY(0px);
        }
      }


      @keyframes fadeout {
        0% {
           opacity: 1;
           transform: translateY(0);
        }
        100% {
           opacity: 0;
           transform: translateY(0px);
        }
      }

      
    
}


@media screen and (max-width:376px){
    .modal-mdImageGallery {
        position: relative;
        /* background-color: #fff; */
        width: 100%;
        max-width: 900px;
        /* padding: 20px; */
        top: 3vh;
    }
}



@media screen and (max-width:450px){
    .modal_grils_slider-sp{
        overflow: scroll;
        -webkit-overflow-scrolling: touch;
        
        position: fixed;
        top: 0;
        left: 0;
        bottom: 0;
        width: 100%;
        height:104vh;
        /* padding: 30px; */
        display: flex;
        align-items: center;
        justify-content: center;
        /* transition: opacity 0.3s; */
        pointer-events: none;
        opacity: 0;
        z-index: 100;
        background-color: #333;
    }

}
.sp_modal_prof_slider{
    max-width: 430px!important;
}