@charset "utf-8";

/*===== PC ここから =====*/
@media screen and (min-width: 741px) {
    .mfp-bg {
        background-color: rgba(0, 0, 0, 0.8)!important;
      }
      .mfp-image-holder .mfp-close {
        transform: translate(-40px,70px);
        opacity: 1!important;
        cursor: pointer!important;
    }

    .mfp-image-holder .mfp-close img {
        width: auto;
        transform: translate(0);
    }
.lp_wrap{
    position: relative;
    display: flex;
    height: 100%;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: flex-start;
    height: 100%;
}
.logo{
    position: fixed;
    top:20px;
    left: 20px;
    width:200px;
    z-index: 50;
}
.logo img{
    width:100%;
}
.bg01{
    width:calc((100% - 750px)/2);
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
}
.bg02{
    width:calc((100% - 750px)/2);
    height: 100%;
    position: fixed;
    top: 0;
    right: 0;
}
.bg-img{
    width:100%;
    height:calc(100% / 3);
}
.bg-img img{
    width:100%;
    height:100%;
    object-fit: cover;
}
.main{
    width:750px;
    margin:0 auto;
}
.img{
    width:100%; 
    font-size: 0;
    margin:0;
}
.lp_anc {
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: flex-start;
}
.lp_anc a{
    display: block;
    width : calc(100% / 3) ;
}
.img.is-pop{
    position: relative;
}
.img.is-pop span{
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}
.img img{
    width:100%;
}
.img.ec_ac_anim{
    cursor: pointer;
}

.img.ec_ac_anim + * {
    display: none;
}
.btn01{
    background: #fff9d9;
    padding: 10px 0 80px;
    text-align: center;
}
.btn02{
    background: #ffe7db;
    padding: 10px 0 80px;
    text-align: center;
}
.btn03{
    background: #ffd8d9;
    padding: 10px 0 80px;
    text-align: center;
}
.btn01 img:hover,.btn02 img:hover,.btn03 img:hover{
    opacity:0.8;
}
.insta01{
    background: #fff9d9;
    text-align: center;
    padding:5px 0;
}
.reel{
    width:540px;
    margin:0 auto;
}
.insta02{
    background: #ffe7db;
    text-align: center;
    padding:5px 0;
}
.insta03{
    background: #ffd8d9;
    text-align: center;
    padding:5px 0;
}
}

/*===== PC ここまで =====*/
@media only screen and (min-device-width : 741px) and (max-device-width : 1024px) {
}

/*===== SP ここから =====*/
@media screen and (max-width: 740px) {
    .mfp-bg {
        background-color: rgba(0, 0, 0, 0.8)!important;
      }
      .mfp-image-holder .mfp-close {
        transform: translate(-40px,60px);
        opacity: 1!important;
        cursor: pointer!important;
    }

    .mfp-image-holder .mfp-close img {
        width: 100px;
        height: auto;
        transform: translate(0);
    }
    .lp_wrap{
        position: relative;
        display: flex;
        height: 100%;
        flex-direction: row;
        flex-wrap: nowrap;
        align-items: flex-start;
        height: 100%;
    }
    .logo{ display:none;}
    .bg01{
        display: none;
    }
    .bg02{
        display: none;
    }
    .bg-img{
        display: none;
    }
    .bg-img img{
        display: none;
    }
    .main{
        width:100%;
    }
    .img{
        width:100%; 
        font-size: 0;
        margin:0;
        line-height: 100%;
    }
    .img img{
        width:100%;
        display: block;
        font-size: 0;
    }

    .img.is-pop{
        position: relative;
    }
    .img.is-pop span{
        display: block;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
        width: 90%;
    }
    .img.ec_ac_anim{
        cursor: pointer;
    }
    
    .img.ec_ac_anim + * {
        display: none;
    }
    .btn01{
        background: #fff9d9;
        padding: 10px 0 50px;
        text-align: center;
    }
    .btn02{
        background: #ffe7db;
        padding: 10px 0 50px;
        text-align: center;
    }
    .btn03{
        background: #ffd8d9;
        padding: 10px 0 50px;
        text-align: center;
    }
    .btn01 img,.btn02 img,.btn03 img{
        width:86%;
        margin:0 auto;
    }
    .insta01{
        background: #fff9d9;
        padding:5px 0;
    }
    .insta02{
        background: #ffe7db;
        padding:5px 0;
    }
    .insta03{
        background: #ffd8d9;
        padding:5px 0;
    }
    .reel{
        width:90%;
        margin:0 auto;
    }
    .lp_anc {
        width: 100%;
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        justify-content: flex-start;
        align-items: flex-start;
    }
    .lp_anc a{
        display: block;
        width : calc(100% / 3) ;
    }
}
/*===== SP ここまで =====*/
