@charset "UTF-8";
/* CSS Document */

/*===== main =====*/
.main{
    display:flex;
    justify-content:space-between;
    margin-bottom:3px;
}
.main .inner_left{
    width:50%;
    overflow:hidden;
    height:100vh;
    position:sticky;
    top:0;
}
.main .inner_left img{
    object-fit:cover;
    height:100%;
    width:100%;
}
.main .inner_right{
    width:49.8%;
}
.main .inner_right .detail{
    width:80%;
    max-width:500px;
    margin:150px auto;
}
.main .inner_right .detail h1{
    font-size:1.5rem;
    margin:0 0 1em 0;
}
.main .inner_right .detail h5{
    font-size:1.0rem;
    margin:0 0 50px 0;
}
.main .inner_right .detail table{
    width:100%;
     margin:0 0 50px 0;
}
.main .inner_right .detail table td{
    border-bottom:1px solid #ccc;
}
.main .inner_right .detail table td:first-child{
    width:10em;
}
.main .inner_right .image_box{
    height:100vh;
    overflow:hidden;
}
.main .inner_right .image_box img{
    object-fit:cover;
    width:100%;
    height:100%;
}
/* ----------959px–---------- */
@media screen and (max-width: 959px) {
    .main .inner_right .detail h1{
        font-size:1.3rem;
    }
    .main .inner_right .detail h5{
        font-size:1.1rem;
    }
}
/* ----------768px–---------- */
@media screen and (max-width: 768px) {
    .main{
        display:block;
        justify-content:unset;
    }
    .main .inner_left{
        width:100%;
        max-width:800px;
        overflow:hidden;
        height:unset;
        position:unset;
    }
    .main .inner_right{
        width:100%;
    }
    .main .inner_right .detail{
        width:90%;
        max-width:700px;
    }
}
/* ----------519px–---------- */
@media screen and (max-width: 519px) {
    .main .inner_right .detail h1{
        font-size:1.2rem;
    }
    .main .inner_right .detail h5{
        font-size:1.0rem;
    }
}



/*===== image_cont =====*/
.image_cont{
}
.image_cont .wrap{
    display:flex;
    justify-content:space-between;
    position:relative;
    margin-bottom:3px;
}
.image_cont .wrap .inner_left{
    width:50%;
}
.image_cont .wrap .image_box{
     overflow:hidden;
    height:100%;
}
.image_cont .wrap .image_box img{
    object-fit:cover;
    height:100%;
    width:100%;
    vertical-align:bottom;
}
.image_cont .wrap .inner_right{
    width:49.8%;
    height:100%;
}
.image_cont .wrap .sticky{
    position:sticky;
    height:100vh;
    top:0;
}
.image_cont .wrap .wide .image_box{
    height:50vh;
    margin-bottom:3px;
}
.image_cont .wrap .wide .image_box:last-child{
    margin-bottom:0px
}
/* ----------768px–---------- */
@media screen and (max-width: 768px) {
    .image_cont .wrap{
        display:block;
        justify-content:unset;
    }
    .image_cont .wrap .inner_left{
        width:100%;
    }
    .image_cont .wrap .wide .image_box{
        height:50vh;
    }
    .image_cont .wrap .inner_right{
        width:100%;
    }
    .image_cont .wrap .sticky{
        position:unset;
        height:100vh;
        top:0;
        margin-bottom:3px;
    }
    .image_cont .wrap .wide .image_box:last-child{
        margin-bottom:3px;
    }
}

/*===== works_tags =====*/
.works_tags{
    margin:50px 0 0 0;
    display:flex;
    border-top:1px solid #ccc;
    border-bottom:1px solid #ccc;
    padding:20px 0;
}
.works_tags h5{
    font-size:1.2rem;
    margin-right:40px;
    padding-right:40px;
    border-right:1px solid #ccc;
}
.works_tags .tag_list{
    display:flex;
    flex-wrap:wrap;
}
.works_tags .tag_list ul{
}
.works_tags .tag_list li{
    margin-right:0.3em;
    font-size:0.8rem;
}
.works_tags .tag_list li a{
	border:1px solid #aaa;
    padding:0em 0.5em;
}

/* ----------768px–---------- */
@media screen and (max-width: 768px) {
}