@charset "UTF-8";

/* works */
.works__txt {
    font-size: 1.2rem;
    line-height: 1.5;
    margin: 15px 4vw 0;
}

/* works pc */
@media screen and (min-width:821px) {
    .works__list {
        margin: 50lvh 0 0 50vw;
        padding: 8.33vw var(--contentPadding-pc);
    }

    .works__item {
        gap: 1.38vw;
        padding: 1.38vw;
    }
    
    .works__txt {
        text-align: justify;
        margin: 30px 0 0;
    }   
}
/* works pc */
/* works */

/* gallery */
.section--gallery {
    padding: min(16vw,60px) 0 19.73vw;
    background-position: -370px 0;
    position: relative;
    margin-top: 0;
}

.section--gallery::before {
    content: '';
    width: 2.933vw;
    height: 3.73vw;
    position: absolute;
    bottom: 8vw;
    left: 50%;
    background-image: url(../images/gallery-arrow.png);
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    transform: translateX(-11.46vw);
}

.section--gallery::after {
    content: 'CLICK !';
    position: absolute;
    bottom: 8vw;
    left: 50%;
    font-family: neue-haas-grotesk-text, sans-serif;
    font-size: 3.73vw;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0;
    text-align: center;
    color: #FFF;
    transform: translateX(-6.13vw);
}

.section__topic--gallery {
    padding-top: 0;
    padding-bottom: 0;
    position: static;
}

.gallery__list, .slick-list, .slick-track {
    height: 82.66vw;
    overflow: hidden;
}

.slick-list {
    margin: 0 -1.33vw;
}

.gallery__item, .slick-slide, .slick-initialized .slick-slide {
    width: auto;
    height: 82.66vw;
}

.slick-slide {
    margin: 0 1.33vw;
}

.gallery__item--icon {
    display: flex;
    flex-wrap: wrap;
    width: 40vw;
    height: 40vw;
}

.art {
    width: 40vw;
    height: 40vw;
    border-radius: 2.66vw;
    border: var(--mainColor-black) solid 1px;
    margin-top: 2.66vw;
    cursor: pointer;
}

.art--4 {
    border-color: var(--mainColor-gray);
}

.gallery__item--icon .art {
    width: 18.66vw;
    height: 18.66vw;
}

.gallery__item--icon .art:nth-of-type(2) {
    margin-top: 0;
    margin-left: 2.66vw;
}
    
.gallery__item--icon .art:nth-of-type(4) {
    margin-left: 2.66vw;
}
    
.gallery__item--icon:last-of-type {
    margin-top: 2.66vw;
}

.gallery__item .art:first-of-type {
    margin-top: 0;
}

.gallery__item .art--2 {
    height: 25.33vw;
}

.gallery__item .art--3 {
    height: 12vw;
}

.gallery__item--rectangle .art {
    width: 40vw;
    height: 82.66vw;
}

.gallery__item .art--21 {
    object-position: -48vw;
}

/* gallery pc */
@media screen and (min-width:821px) { 
    .section--gallery {
        padding: 90px 0;
        background-position: center;
    }
    .section--gallery .section__subTopic {
        margin-bottom: 60px;
    }
    
    .gallery__list, .slick-list, .slick-track {
        height: 42.36vw;
        overflow: hidden;
    }
    
    .slick-list {
        margin: 0 -0.347vw;
    }
    
    .gallery__item, .slick-slide, .slick-initialized .slick-slide {
        width: auto;
        height: 42.36vw;
    }

    .gallery__item--icon {
        width: 20.83vw;
        height: 20.83vw;
    }
    
    .slick-slide {
        margin: 0 0.347vw;
    }
    
    .art {
        width: 20.83vw;
        height: 20.83vw;
        border-radius: 20px;
        margin-top: 0.694vw;
        transition: all 0.2s;
        cursor: pointer;
    }

    .art:hover {
        border-width: 3px;
    }
    
    .gallery__item .art:first-of-type {
        margin-top: 0;
    }
    
    .gallery__item .art--2 {
        height: 13.54vw;
    }
    
    .gallery__item .art--3 {
        height: 6.59vw;
    }
    
    .gallery__item--icon .art {
        width: 10.06vw;
        height: 10.06vw;
    }

    .gallery__item--icon .art:nth-of-type(2) {
        margin-top: 0;
        margin-left: 0.694vw;
    }
    
    .gallery__item--icon .art:nth-of-type(4) {
        margin-left: 0.694vw;
    }
    
    .gallery__item--icon:last-of-type {
        margin-top: 0.694vw;
    }
    
    .gallery__item--rectangle .art {
        width: 20.83vw;
        height: 42.36vw;
    }
    
    .gallery__item .art--21 {
        object-position: -23.61vw;
    }

    .section--gallery::before, .section--gallery::after {
        display: none;
    }
}
/* gallery pc */

/* gallery modal */
.modal__list .art--4 {
    border-color: var(--mainColor-gray);
}

.art.open {
    border-width: 2px;
}
/* gallery modal pc */
@media screen and (min-width:821px) {
    .modal__list .art--2 {
        width: min(78.125vw,1125px);
        height: auto;
    }
    
    .modal__list .art--3 {
        height: min(17.56vw,253px);
    }
    
    .modal__list .art--19 {
        width: min(57.91vw,834px);
        height: auto;
    }
    
    .modal__list .art--20 {
        width: min(71.11vw,1024px);
        height: auto;
    }
    
    .modal__list .art--21 {
        width: min(84.65vw,1219px);
        height: auto;
    }

    .art.open {
        border-width: 3px;
    }
}
/* gallery modal pc */
/* gallery modal */
/* gallery */