@charset "utf-8";

/*gw-theme01-main-portfolio*/
#gw-theme01-main-portfolio .gw-sns-container {display: flex;flex-wrap: wrap;}
#gw-theme01-main-portfolio .gw-sns-container > li {overflow: hidden;}
#gw-theme01-main-portfolio .gw-img-container {position:relative;display: block;width: 100%;height: 0;padding-bottom: 100%;cursor: pointer;}
#gw-theme01-main-portfolio .gw-img-container img{position: absolute;top: 0;left: 0;width: 100%;height: 100%;object-fit: cover;object-position: center;transition: all 1.5s;}
#gw-theme01-main-portfolio .gw-hover{width:100%;height:100%;}
#gw-theme01-main-portfolio .gw-hover:before {content: "";display: block;width: 101%;height: 100%;position: absolute;top: 0;left: 0;background: #000;opacity: 0.3;transition: all .3s;}
#gw-theme01-main-portfolio .gw-hover-container{position:absolute;top:100%;left:0;width:100%;height:100%;background:var(--main-color);transition: all .3s;}
#gw-theme01-main-portfolio .gw-hover .off {position:relative;display: inline-block;width:50px;height:50px;font-size: 14px;background: rgba(255,255,255,0.2);color: #fff;text-align: center;margin: 20px;border-radius: 100%;border:2px solid rgba(255,255,255,0.2);text-transform: uppercase;transition: all .3s;}
#gw-theme01-main-portfolio .gw-hover .gw-title {display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;text-overflow: ellipsis;overflow: hidden;text-align: center;color: #fff;font-size: var(--main-title04);}
#gw-theme01-main-portfolio .gw-hover .gw-btn04 {margin: 0 auto; color: rgba(255,255,255,0.8);}
#gw-theme01-main-portfolio .gw-hover .gw-btn04:before {background: rgba(255,255,255,0.3);}
#gw-theme01-main-portfolio .gw-img-container:hover img{transform: scale(1.05) rotate(0.01deg);}
#gw-theme01-main-portfolio .gw-img-container:hover .gw-hover:before{opacity: 0.8;}
#gw-theme01-main-portfolio .gw-img-container:hover .gw-hover > .off{opacity: 0;}
#gw-theme01-main-portfolio .gw-img-container:hover .gw-hover-container{top:0;opacity: 1;}

/*내용없을경우------------------------------------------------------------------------------------------------------------------ */
#gw-theme01-main-portfolio .gw-empty-list > h3 {font-size: var(--main-title03);}

@media screen and (max-width:1024px){
    #gw-theme01-main-portfolio .gw-sns-container .gw-w-25 {width: 50% !important;}
    #gw-theme01-main-portfolio .gw-sns-container > li > a{padding-bottom: 80%;}
}

@media screen and (max-width:576px){
    #gw-theme01-main-portfolio .gw-hover .gw-title{-webkit-line-clamp:1;width:80%;margin: 0 auto;margin-bottom: 0 !important;}
    #gw-theme01-main-portfolio .gw-hover .off{margin:15px;width: 40px;height: 40px;}
    #gw-theme01-main-portfolio .gw-hover .off > i{font-size: 1.25em;}
    #gw-theme01-main-portfolio .gw-hover .off > a > i{font-size: 1.25em;}
    #gw-theme01-main-portfolio .gw-img-container:hover .gw-hover .off{margin:0;margin-bottom:10px;}
    #gw-theme01-main-portfolio .gw-hover-container{display: none;transition: all 0s;}
    #gw-theme01-main-portfolio .gw-img-container:hover .gw-hover-container{opacity: 0;}
    #gw-theme01-main-portfolio .gw-hover-container.on{opacity: 1 !important;display:block;}
    #gw-theme01-main-portfolio .gw-btn01 {width: calc(100% - 40px);}
}