@charset "utf-8";

#inc02{padding:150px 0 180px;text-align:center;background:url('./img/inc02_bg.jpg') center no-repeat;background-size:cover}
#inc02 .sh_cont_box{margin-bottom:40px}
#inc02 .sh_cont_box .s_tit{margin:0 auto;color:#222}
#inc02 .sh_cont_box .txt_group{color:rgba(255,255,255,0.6)}
#inc02 .sh_cont_box .txt_group p{display:inline-block;margin:45px 0 30px;color:#fff}
#inc02 .sh_cont_box .txt_group p a{color:#222;transition:0.2s}
#inc02 .sh_cont_box .txt_group p:hover a{color:var(--primary)}
#inc02 .box_wrap{position:relative;max-width:1165px;margin:0 auto;border-radius:20px;background-color:rgba(0, 0, 0, .1)}
#inc02 .box_wrap .active{opacity:0;position:absolute;top:50%;z-index:0;transform:translateY(-50%);width:365px;height:300px;background:var(--primary);transition:all .8s cubic-bezier(0.22, 1, 0.36, 1)}
#inc02 .bt_cont{margin-top:50px}
#inc02 ul{position:relative;display:flex;justify-content:space-between;flex-wrap:wrap;padding:28px;gap:10px}
#inc02 ul li{width:calc((100% - 20px) / 3)}
#inc02 ul li img{width:100%;border-radius:20px}
#inc02 ul li:last-child{border-right:none}
#inc02 ul li a{display:flex;flex-flow:column;justify-content:center;align-items:center;height:300px;color:#fff}
#inc02 ul li span{margin:35px 0 10px;font-size:15px;font-weight:600;font-family:'poppins',sans-serif}  
#inc02 ul li p{font-size:22px;font-weight:700;color:#222}

/* @media(hover:hover){
#inc02 .box_wrap:hover .active{opacity:1}
} */
@media(max-width:1024px){
#inc02 .box_wrap .active{display:none}	
#inc02 ul{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
#inc02 ul li{width:100%}
#inc02{padding:130px 30px 160px}
#inc02 .sh_cont_box .txt_group p{margin-bottom:0}

}
@media(max-width:768px){
#inc02{padding:80px 30px}	
#inc02 .sh_cont_box{margin-bottom:50px}
#inc02 .sh_cont_box .txt_group{padding:0 20px}
#inc02 .sh_cont_box .txt_group p{margin:55px 0 0}
#inc02 ul{padding:30px}
#inc02 ul li span{font-size:13px}
#inc02 ul li p{font-size:18px}
#inc02 ul li a{height:280px}
#inc02 ul li a > img{min-width:65px;width:30%}
#inc02 .sh_cont_box{margin-bottom:25px}
#inc02 .bt_cont{margin-top:0}

}
@media(max-width:480px){
#inc02{padding:60px 20px}	
#inc02 ul{grid-template-columns:repeat(1,1fr)}
#inc02 ul li p{font-size:16px;margin-top:15px}
}
@media(max-width:380px){
#inc02{padding:60px 0 0}	
#inc02 ul{display:block;padding:20px}
#inc02 ul li{width:100%}
#inc02 ul li+li{border-top:1px solid rgba(255,255,255,.3)}
#inc02 ul li a{height:auto;padding:30px 0}
#inc02 ul li a > img{width:20%}
#inc02 ul li span{margin-top:20px}

}