@charset "utf-8";

#inc01{position:relative;overflow:hidden}
#inc01 .pl{white-space:pre-line}

#inc01 .tit{padding:130px 0 160px;text-align:center;background:url(./bg.jpg)}
#inc01 .tit span{font-size:18px;font-weight:900;color:var(--second)}
#inc01 .tit p{margin:30px 0;font-size:42px;font-weight:700;line-height:1.3;color:var(--primary)}
#inc01 .tit div{font-size:17px;color:#777;font-family:'notokr-regular'}

#inc01 .list:after{position:absolute;content:'';z-index:-1;bottom:0;left:0;width:100%;height:180px;background:var(--primary)}
#inc01 .list ul{display:grid;grid-template-columns:repeat(4,1fr);max-width:var(--mainsize);height:180px;margin:0 auto}
#inc01 .list ul li{height:390px;padding-top:55px;color:#fff;text-align:center;transition:all .4s}
#inc01 .list ul li:hover{cursor:default}
#inc01 .list ul li .name{font-weight:700}
#inc01 .list ul li p{margin-bottom:5px;font-size:23px}
#inc01 .list ul li span{font-size:14px;color:rgba(255,255,255,.3);transition:all .3s}
#inc01 .list ul li a{position:relative;display:flex;justify-content:center;align-items:center;width:57px;height:57px;margin:0 auto;border-radius:5px;color:var(--primary);background:#fff}
#inc01 .list ul li svg{position:absolute;transition:all .2s}
#inc01 .list ul li .left{left:-35px;opacity:0}
#inc01 .list ul li .right{left:50%;transform:translateX(-50%)}
#inc01 .list ul li a:hover .left{left:50%;opacity:1;transform:translateX(-50%)}
#inc01 .list ul li a:hover .right{right:-35px;opacity:0;transition-delay:0s}
#inc01 .list .info{display:none;color:rgba(255,255,255,.4);opacity:0;transition:all .3s;font-family:'notokr-regular'}
#inc01 .list .info div{margin:30px 0}
#inc01 .list li.on{margin-top:-210px;padding:80px 0;background:url(./list01_bg.jpg)}
#inc01 .list li:nth-child(2).on{background:url(./list02_bg.jpg)}
#inc01 .list li:nth-child(3).on{background:url(./list03_bg.jpg)}
#inc01 .list li:nth-child(4).on{background:url(./list04_bg.jpg)}
#inc01 .list li.on span{color:var(--second)}
#inc01 .list li.on .info{display:block;opacity:1}