/*site*/

@charset "utf-8";

#insta{
    padding: 0 2.5%;
    width: clamp(240px, 100%, 1300px);
    margin: 0 auto;
            box-sizing: border-box;

    & a{
        text-decoration: none;
    }

    & ul{
        box-sizing: border-box;
        display: flex;
        flex-flow: row wrap;
        justify-content: space-between;

        & li{
            list-style: none;
            box-sizing: border-box;
            width: 48%;
            margin-bottom: 18px;
            height: 180px;
            position: relative;

            & .captionTxt{
                display: block;
                width: 100%;
                height: 100%;
                padding: 16px;
				box-sizing: border-box;
                font-size: 14px;
                line-height: 1.8;
                text-align: left;
                position: absolute;
                top: 50%;
                left: 50%;
                transform: translate(-50%, -50%);
                background-color: rgba(0,0,0,.75);
                color: #fff;
                opacity: 0;
                
            }

            & .like_count{
                font-size: 12px;
                line-height: 2;
                display: block;
                text-align: center;
                position: relative;

                &::before{
                    content: "\02665";
                    color: #d4245f;
                    font-size: 14px;
                    vertical-align: middle;
                    padding-right: 0.25em;
                }
            }

            &:hover{
                & .captionTxt{
                    transition: .5s opacity, .25s filter;
                    opacity: 1;
                }
            }

            & img{
                object-fit: cover;
                width: 100%;
                height: 100%;
            }
        }
    }
}

@media screen and (min-width:600px) {
    #insta{
        padding: 0;
        & ul{
            & li{
                width: 32%;
            }
        }
    }
}

@media screen and (min-width:1025px) {
    #insta{
        & ul{
            & li{
                width: 23.5%;
            }
        }
    }
}