.bg-blue{
    padding-bottom:5vw;
}

.blue-content{
    width:84.17vw;
    margin:0 auto;
}



.top-text{
    text-align: center;
    margin-top:6.3vw;
    color: white;
}
.top-text p{
    margin-top:4.06vw;
    font-size:1.1vw;
    line-height: 2.5vw;
    padding-bottom:4.06vw;
}


.works h5{
    color: white;
    font-size:1.3vw;
    text-align: center;
}

.tab-name-list ul{
    display: flex;
    
}
.tab-name-list li{
    list-style: none;
    color: white;
    font-size:1.1vw;
    margin-top:3.91vw;
    cursor: pointer;
}
.tab-name-list li::after{
    content:"/";
    font-size:1.1vw;
    margin:0 .5vw;
}
.tab-name-list li:nth-child(6)::after{
    content:"";
}

.tab-name.active{
    text-decoration: underline;
}


.tab-section{
    display: none;
}
.tab-section.active{
    display: block;
}


.works-tab{
    width:70.42vw;
    margin:0 auto;
}


.tab-content{
    margin:3.65vw auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.works-content:nth-child(n+3){
    margin-top:5.21vw;
}
.works-content a{
    text-decoration: none;
    color:white;
}
.works-content img{
    width:33.44vw;
    height:19.38vw;
    object-fit: cover;
    object-position: center;
}
.works-content p{
    margin-top:1.56vw;
    font-size:1.1vw;
}


.page-number{
    width:2.81vw;
    height:3.39vw;
    background-color: white;
    margin:5vw auto 0vw auto;
}
.page-number p{
    font-size:1.1vw;
    line-height: 3.39vw;
    text-align: center;
}






















/*-----------------------------------------------------------------------------
レスポンシブ
-------------------------------------------------------------------------------*/

@media(max-width:599px){


    .bg-blue{
        padding-bottom:10vw;
    }

    .blue-content{
        width:90%;
    }


    .top-text p{
        margin-top:4.06vw;
        font-size:3.5vw;
        line-height: 6vw;
        padding-bottom:4.06vw;
    }
    


    .works{
        margin-top:5vw;
    }
    .works h5{
        font-size:4vw;
    }
    
    .tab-name-list ul{
        flex-wrap: wrap;
        justify-content: center;
    }

    .tab-name-list li{
        font-size:3.5vw;
        margin-top:5vw;
    }
    .tab-name-list li::after{
        font-size:3.5vw;
        margin:0 2.5vw;
    }

    
    .works-tab{
        width:100%;
    }
    
    
    .tab-content{
        margin:3.65vw auto;    
        flex-flow: column; 
    }
    
    .works-content:nth-child(n+1){
        margin-top:3.65vw;
    }


    .works-content img{
        width:100%;
        height:52.31vw;
        object-fit: cover;
        object-position: center;
    }
    .works-content p{
        font-size: 3.5vw;
        margin-top:1.56vw;
    }
    
    
    .page-number{
        width:7.44vw;
        height:8.97vw;
        background-color: white;
        margin:15vw auto 0vw auto;
    }
    .page-number p{
        font-size:3.5vw;
        line-height: 8.97vw;
    }

    


}