@import url("sub.css");




.svc_list { margin-top: 40px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));  gap: 50px 30px; }
.svc_list li {}
.svc_list figure { background: var(--grayBg); aspect-ratio: 510 / 287; overflow: hidden; }
.svc_list img { width: 100%; height: 100%; object-fit: cover; display: block;   transition:all .3s linear;}
.svc_list li .fs21 { color: var(--black); font-weight: 600; margin:20px 0 0;}

.svc_list li:hover figure img {transform:scale(1.1); transition:all .3s linear;}
.svc_list li a.no-link {cursor:auto;  pointer-events: none;}
.svc_list li:hover a.no-link figure img {transform:scale(1); transition:all .3s linear;}


/*******************************************************************************
    @media ~1500px
*******************************************************************************/
@media all and (max-width:1500px) { 


}
/*******************************************************************************
    @media ~1300px
*******************************************************************************/
@media all and (max-width:1300px) { 


}
/*******************************************************************************
    @media 769~980px
*******************************************************************************/
@media all and (max-width:980px) { 


.tit_wrap br {display:none;}
.svc_list {grid-template-columns: repeat(3, minmax(0, 1fr));  gap: 30px 15px; }





}
/*******************************************************************************
    @media 481~680px
*******************************************************************************/
@media all and (max-width:680px) { 



.svc_list {grid-template-columns: repeat(1, minmax(0, 1fr));  gap: 15px 0; margin-top:20px;}
.svc_list li .fs21 {margin:10px 0 0;}

}