@charset "utf-8";

#works{
    overflow:hidden;
    .wrap{
        .contents{
            .tabmenu{
                display: grid;
                grid-template-columns: repeat(6, 1fr);
                margin-bottom: 70px;
                position: relative;
                &:after{
                    content:"";
                    position:absolute;
                    height:2px;
                    background-color:#000;
                    width: 100vw;
                    bottom: 0;
                    left: 50%;
                    transform:translate(-50%);
                    z-index:2;
                }
                li{
                    a {
                    position:relative;
                        z-index:1;
                        border-top:2px #000 solid;
                        border-right:2px #000 solid;                    
                        border-radius: 10px 10px 0 0;
                        padding: 0.7em 1em 0.5em;
                        font-size: 3rem;
                        display: grid;
                        align-items: center;
                        justify-content: center;
                        background-color: #C9C9C9;
                        color: #fff;
                        letter-spacing: 0.1em;
                    }
                    &:first-child{
                        a {
                            border-left:2px #000 solid;
                        }
                    }
                    &.active{
                        a {
                            background-color: #fff;
                            color: #000;                       
                            z-index:3;
                        }
                    }
                }
            }
            .tab_box{
                .gallery{
                    display: grid;
                    grid-template-columns: repeat(4, 1fr);
                    grid-gap: 20px;
                }
            }
        }
    }
}

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

}

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

@media screen and (max-width:768px){
    
    #sitemap {
        .wrap {
            .contents {
                ul {
                    li {
                        font-size:1.4rem;
                    }
                } 
            }
        }
    }
    
}