@charset "utf-8";
#inc01{position:relative;z-index:3;transition:all .3s}
#inc01 .inc01_wrapper{display:flex;height:960px}

/* left content */
#inc01 .cont_left{position:relative;display:flex;flex-direction:column;justify-content:space-between;padding:140px 40px 100px 12%;width:70%;overflow:hidden}
#inc01 .cont_left .count{display:flex}
#inc01 .cont_left .count li{display:flex;flex-direction:column;align-items:center;padding:20px 0;width:calc(100% / 3);font-size:18px;font-weight:700;color:var(--primary)}
#inc01 .cont_left .count li+li{border-left:1px solid #e1e1e1}
#inc01 .cont_left .count li .num_container{display:flex;align-items:baseline;color:#000}
#inc01 .cont_left .count li .num{margin-right:4px;font-size:45px}
#inc01 .cont_left .count li .num span{display:inline-block;padding-left:3px;font-size:18px}
#inc01 .cont_left .text_loop{position:absolute;top:35%;left:0px;display:flex;flex-direction:column;width:100%;font-size:70px;font-weight:700;line-height:1.2;color:rgb(7, 7, 7, 0.1);white-space:nowrap}
#inc01 .cont_left .text_loop .left{animation:textloop_left 30s infinite linear}
#inc01 .cont_left .text_loop .right{animation:textloop_right 30s infinite linear}
#inc01 .cont_left .bottom{display:flex;flex-direction:column;font-size:18px;width:68%}
#inc01 .cont_left .bottom p{font-size:35px;font-weight:700;color:#000;word-break:keep-all}
#inc01 .cont_left .bottom .pl{margin:30px 0 60px;font-weight:500;word-break:keep-all}
#inc01 .cont_left .bottom a{display:flex;justify-content:center;align-items:center;gap:25px;width:170px;height:58px;line-height:58px;text-align:center;font-size:18px;font-weight:700;transition:all .3s;color:#fff;background-color:#000}
#inc01 .cont_left .bottom a .icon{font-size:30px}

/* right content */
#inc01 .cont_right{position:relative;width:30%;background-color:var(--primary)}
#inc01 .cont_right .inc01_slide{position:absolute;bottom:0px;right:0px;margin-left:calc(-50vw + 50%);width:50vw;height:535px}
#inc01 .cont_right .inc01_slide li{background-repeat:no-repeat;background-size:cover;background-position:center}
#inc01 .cont_right .inc01_slide .bg01{background-image:url(./img/img01.jpg)}
#inc01 .cont_right .inc01_slide .bg02{background-image:url(./img/img02.jpg)}
#inc01 .cont_right .inc01_slide .bg03{background-image:url(./img/img03.jpg)}
#inc01 .cont_right .pager{padding:180px 80px 80px;width:100%}
#inc01 .cont_right .pager p{width:100%;font-size:20px;font-weight:700;transition:all .3s;color:#fff;background:none;word-break:keep-all}
#inc01 .cont_right .pager p+p{margin-top:20px}
#inc01 .cont_right .pager .on{padding-left:30px;opacity:1}

/* text_loop animate */
@keyframes textloop_left {0% {transform:translateX(0)} 100% {transform:translateX(-50%)}}
@keyframes textloop_right {0% {transform:translateX(-50%)} 100% {transform:translateX(0%)}}

/* 반응형 [s] */
@media (hover:hover){
#inc01 .cont_left .bottom a:hover{gap:10px}
}
@media (max-width:1380px){
#inc01 .inc01_wrapper{height:920px}
#inc01 .cont_left{padding:140px 0px 100px 5%}
#inc01 .cont_left .count li{font-size:16px}
#inc01 .cont_left .count li .num{font-size:40px}
#inc01 .cont_left .text_loop{font-size:60px}
#inc01 .cont_left .bottom{font-size:16px}
#inc01 .cont_left .bottom p{font-size:30px}
#inc01 .cont_left .bottom a{width:160px;height:56px;line-height:56px;font-size:17px}
#inc01 .cont_right .pager{padding:160px 60px 50px}
#inc01 .cont_right .pager p{font-size:18px}
#inc01 .cont_right .inc01_slide{height:520px}
}
@media (max-width:1024px){
#inc01 .inc01_wrapper{height:760px}
#inc01 .cont_left{padding:100px 0px 50px 2.5%}
#inc01 .cont_left .count li{font-size:15px}
#inc01 .cont_left .count li .num{font-size:32px}
#inc01 .cont_left .text_loop{font-size:48px}
#inc01 .cont_left .bottom{font-size:15px}
#inc01 .cont_left .bottom p{font-size:24px}
#inc01 .cont_left .bottom a{width:140px;height:52px;line-height:52px;gap:15px;font-size:15px}
#inc01 .cont_left .bottom a .icon{font-size:25px}
#inc01 .cont_right .pager{padding:120px 30px 40px}
#inc01 .cont_right .pager p{font-size:16px}
#inc01 .cont_right .pager .on{padding-left:15px}
#inc01 .cont_right .inc01_slide{height:400px}
}
@media (max-width:768px){
#inc01 .inc01_wrapper{flex-direction:column;height:auto}
#inc01 .cont_left{margin:auto;width:95%;padding:70px 0 0}
#inc01 .cont_left .count li{padding:13px 0;font-size:14px}
#inc01 .cont_left .count li .num{font-size:30px}
#inc01 .cont_left .text_loop{display:none}
#inc01 .cont_left .bottom{justify-content:center;align-items:center;margin-top:70px;width:100%}
#inc01 .cont_left .bottom p{font-size:22px}
#inc01 .cont_left .bottom a{height:48px;line-height:48px}
#inc01 .cont_left .bottom .pl{margin:20px auto 35px;width:80%;text-align:center}
#inc01 .cont_right{display:flex;flex-direction:column-reverse;margin:auto;width:95%;background-color:transparent}
#inc01 .cont_right .inc01_slide{position:static;margin:0px;width:100%}
#inc01 .cont_right .pager{display:flex;justify-content:center;gap:20px;padding:0px;margin:80px auto 50px;width:100%}
#inc01 .cont_right .pager p{display:flex;justify-content:center;align-items:center;position:relative;opacity:1;padding:12px;width:calc(100% / 3);height:auto;border:2px solid var(--primary);border-radius:0%; font-size:14px;text-align:center;color:var(--primary);background-color:#fff}
#inc01 .cont_right .pager p+p{margin-top:0px}
#inc01 .cont_right .pager .on{padding:12px;color:#fff;background-color:var(--primary)}
#inc01 .cont_right .inc01_slide{height:385px}
}
@media (max-width:480px){
#inc01 .cont_left .count li{padding:10px 0}
#inc01 .cont_left .count li .num{font-size:26px}
#inc01 .cont_left .bottom{margin-top:55px;font-size:14px}
#inc01 .cont_left .bottom p{font-size:19px}
#inc01 .cont_left .bottom .pl{margin:15px auto 30px;width:100%}
#inc01 .cont_left .bottom a{width:128px;height:47px;line-height:47px;gap:10px;font-size:14px}
#inc01 .cont_left .bottom a:hover{gap:5px}
#inc01 .cont_right .pager{margin:60px auto 50px;gap:10px}
#inc01 .cont_right .pager p{padding:8px;font-size:13px}
#inc01 .cont_right .pager .on{padding:8px}
#inc01 .cont_right .inc01_slide{height:310px}
}
@media (max-width:380px){
#inc01 .cont_left{padding:60px 0 0}
#inc01 .cont_left .count li{padding:8px 0;font-size:13px}
#inc01 .cont_left .count li .num{font-size:22px}
#inc01 .cont_left .bottom{margin-top:40px;font-size:13px}
#inc01 .cont_left .bottom p{font-size:16px}
#inc01 .cont_left .bottom .pl{margin:12px auto 26px}
#inc01 .cont_left .bottom a{width:120px;height:44px;line-height:44px;font-size:13px}
#inc01 .cont_right .pager{margin:50px auto 40px;width:100%}
#inc01 .cont_right .pager p{padding:5px}
#inc01 .cont_right .pager .on{padding:5px}
#inc01 .cont_right .inc01_slide{height:270px}
}
/* 반응형 [e] */
