.prj_detail-title,
.prj_detail-credits,
.prj_detail-honbun.ENG,
.prj_detail-honbun.JPN,
.prj_detail-gallery{
    transition-timing-function: ease-in-out;
    clip-path: inset(0 100% 0 0);
}
.prj_detail-title{transition-delay: 0.1s; transition-duration: 0.64s;}
.prj_detail-credits{transition-delay: 0.2s; transition-duration: 0.48s;}
.prj_detail-honbun.ENG{transition-delay: 0.32s; transition-duration: 0.24s;}
.prj_detail-honbun.JPN{transition-delay: 0.44s; transition-duration: 0.24s;}
.prj_detail-gallery{transition-delay: 0.1s; transition-duration: 0.64s; }

.pageLoaded .prj_detail-title,
.pageLoaded .prj_detail-credits,
.pageLoaded .prj_detail-honbun.ENG,
.pageLoaded .prj_detail-honbun.JPN,
.pageLoaded .prj_detail-gallery{
    transition-timing-function: ease-in-out;
    clip-path: inset(0 0 0 0);
}


@media (max-width:768px) {
    .container-prj_detail{
        width: 100%;
    }
    .prj_detail-intro{
        margin-left: 20px;
        margin-right: 20px;
    }
    .prj_detail-title{
        font-size: 14px;
        line-height: 150%;
    }
    .prj_detail-credits{
        margin-top: 20px;
    }
    .prj_detail-credits li{
        font-size: 10px;
    }
    .prj_detail-honbun{
        margin-top: 20px;
        font-size: 10px;
        line-height: 170%;
    }

}
@media (min-width:769px) and (max-width:1024px) {
    .container-prj_detail{
        width: calc(100% - 40px);
    }
    .prj_detail-title{
        font-size: 16px;
        line-height: 150%;
    }
    .prj_detail-credits{
        margin-top: 20px;
    }
    .prj_detail-credits li{
        font-size: 10px;
    }
    .prj_detail-honbun{
        margin-top: 20px;
        font-size: 12px;
        line-height: 180%;
    }
}
@media (min-width:1025px) {
    .container-prj_detail{
        width: 86.4lvw;
        margin-top: 30px;
    }
    .prj_detail-captions{
        width: 100%;
        display: inline-flex;
        align-items: flex-start;
    }
    .prj_detail-credits{
        width: 20%;
        padding-top: 4px;
    }
    .prj_detail-credits li{
        font-size: 11px;
    }
    .prj_detail-title{
        margin-bottom: 33px;
        font-size: 18px;
        line-height: 180%;
    }
    .prj_detail-honbun{
        width: calc(40% - 33px);
        margin-left: 33px;
        font-size: 14px;
    }
}
.prj_detail-credits li,
.prj_detail-honbun{
    line-height: 180%;
}

.container-prj_detail{
    display: block;
    overflow: hidden;
    clear: both;

}

.prj_detail-honbun.JPN{
    text-align: justify;
}
.container-prj_detail{
    margin-left: auto;
    margin-right: auto;
}





.prj_detail-gallery{
    margin-top: 40px;
    display: grid;
    gap: 6.28lvh;
    /* background-color: antiquewhite; */

}

.prj_detail-gallery li{
    overflow: hidden;
    width: 100%;
    display: flex;
	justify-content: center;
    position: relative;

}
.prj_detail-gallery iframe,
.prj_detail-gallery img{
    width: 100%;
    height: auto;
}
.prj_detail-gallery .square,
.prj_detail-gallery .landscape {
    grid-column: span 2; /* 2カラム分を占める */
}

.prj_detail-gallery figcaption{
    font-size: 12px;
    margin-top: 6px;
    text-align: left;
}


/* .prj_detail-gallery video,
.prj_detail-gallery iframe{
    pointer-events: none;
} */
@media (max-width:768px) {

    .prj_detail-gallery figure{
        display: flex;
        flex-direction: column-reverse;
        overflow: hidden;
        align-items: flex-start;
    }
    .prj_detail-gallery figcaption{
        text-align: left;
        margin-top: 13px;
        margin-bottom: 40px;
        margin-left: 20px;
        font-size: 10px;
    }

    .prj_detail-gallery{
        gap: 10px;
    }
    .prj_detail-gallery .landscape img{
        width:  auto;
        height:  100lvw;
        transform: translateX(-38.625lvw);
        aspect-ratio: 16 / 9;

    }
    .prj_detail-gallery video,
    .prj_detail-gallery .landscape iframe{
        width:  auto;
        height:  100lvw;
        transform: translateX(-38.625lvw);
        aspect-ratio: 16 / 9;
    }
    .prj_detail-gallery .aspect-300_250 video{
        width:  100lvw;
        height: auto ;
        transform: translateX(0lvw);
        aspect-ratio: 6 / 5;
    }
}


@media (min-width:769px) and (max-width:1024px) {
    .prj_detail-gallery figcaption{
        margin-left: 0px;
        margin-bottom: 10px;
    }
    .prj_detail-gallery .landscape video,
    .prj_detail-gallery .landscape iframe{
        width: calc(100lvw - 40px);
        aspect-ratio: 16 / 9;
    }
}

@media (min-width:1025px) {
    .prj_detail-gallery figcaption{
        margin-left: 0px;
        margin-bottom: 10px;
    }
    .prj_detail-gallery .landscape img{
        width: 86.4lvw;
    }
    .prj_detail-gallery .landscape video,
    .prj_detail-gallery .landscape iframe{
        width: 86.4lvw;
        aspect-ratio: 16 / 9;
    }
    .prj_detail-gallery .aspect-300_250 video{
        width:  auto;
        height: 39lvw;
        line-height: 0;
        padding: 0;
        transform: translateX(0lvw);
        aspect-ratio: 6 / 5;
    }
}

.prj_detail-gallery .aspect-300_250{
    background-color: #fbfbfb;
}