@charset "utf-8";

#inc01 .icon_link{padding:100px 0;border-bottom:1px solid #e1e1e1}
#inc01 .icon_link ul{display:grid;grid-template-columns:repeat(4,1fr);max-width:var(--main-size);margin:0 auto}
#inc01 .icon_link a{display:flex;align-items:center;gap:20px}
#inc01 .icon_link a img{transition:all .3s}
#inc01 .icon_link dt{margin-bottom:5px;font-size:18px;font-weight:700;color:#111;transition:all .3s}
#inc01 .icon_link dd{color:#777;white-space:pre-line}
#inc01 .icon_link .icon{display:flex;align-items:center;justify-content:center;width:90px;height:90px;border:1px solid #e1e1e1}

#inc01 .inner ul{display:grid;grid-template-columns:repeat(3,1fr)}
#inc01 .inner ul li{overflow:hidden;display:flex;align-items:center;justify-content:center;height:600px}
#inc01 .inner ul li a{display:flex;align-items:center;justify-content:center;width:100%;height:100%;font-size:25px;font-weight:700;color:#fff;background-size:cover;transition:all .3s}
#inc01 .inner ul li:nth-child(1) a{background-image:url('./img/bg01.jpg')}
#inc01 .inner ul li:nth-child(2) a{background-image:url('./img/bg02.jpg')}
#inc01 .inner ul li:nth-child(3) a{background-image:url('./img/bg03.jpg')}

@media(hover:hover){
#inc01 .icon_link a:hover dt{color:var(--primary)}
#inc01 .icon_link a:hover img{filter:invert(45%) sepia(12%) saturate(2130%) hue-rotate(152deg) brightness(92%) contrast(87%)}
#inc01 .inner ul li a:hover{width:85%;height:85%}
}

/* 반응형 [s] */
@media (max-width:1024px){
#inc01 .icon_link{padding:50px}
#inc01 .icon_link ul{grid-template-columns:repeat(2,1fr);gap:20px}
#inc01 .icon_link dd{white-space:normal}

#inc01 .inner ul li{height:400px}
#inc01 .inner ul li a{font-size:20px}
}
@media (max-width:768px){
#inc01 .icon_link ul{grid-template-columns:repeat(4,1fr)}
#inc01 .icon_link a{flex-direction:column;gap:10px}
#inc01 .icon_link dt{font-size:16px}
#inc01 .icon_link dd{display:none}

#inc01 .inner{padding:100px 0 0 !important}
#inc01 .inner ul li a{padding:0 20px;font-size:18px;text-align:center;word-break:keep-all}
}
@media (max-width:480px){
#inc01 .icon_link{padding:30px}
#inc01 .icon_link dt{margin-bottom:0;font-size:15px;text-align:center;word-break:keep-all}
#inc01 .icon_link .icon{width:100%;height:80px}
#inc01 .icon_link a img{width:35px}

#inc01 .inner ul{grid-template-columns:repeat(1,1fr)}
#inc01 .inner ul li{height:200px}
#inc01 .inner ul li a{background-position:center}
}
@media (max-width:390px){
#inc01 .icon_link{padding:20px}
#inc01 .icon_link dt{font-size:13px}
#inc01 .icon_link .icon{height:70px}
#inc01 .icon_link a img{width:30px}
}
/* 반응형 [e] */