@charset "utf-8";

#inc04 .example_list{display:flex;flex-wrap:wrap;margin-top:70px}
#inc04 .example_list > li{display:flex;flex-direction:column;justify-content:space-between;width:32%;height:388px;margin-right:2%;padding:35px 25px;border:1px solid #e1e1e1;border-radius:15px;box-sizing:border-box}
#inc04 .example_list > li:nth-child(3n){margin-right:0}
#inc04 .example_list > li:nth-child(n+4){margin-top:20px}
#inc04 .example_list > li > p{position:relative;padding-top:35px;font-size:15px;line-height:1.5;font-weight:500;color:#777}
#inc04 .example_list > li > p:after{content:"";position: absolute;top:0px;left:0px;width:102px;height:18px;background:url("./img/star_dot.png") no-repeat center / contain}
#inc04 .example_list > li > .person_wrap{display:flex;align-items:center}
#inc04 .example_list > li > .person_wrap .img{width:50px;height:50px;margin-right:15px;border-radius:50%}
#inc04 .example_list > li > .person_wrap .img > img{width:100%;height:100%;object-fit:cover}
#inc04 .example_list > li > .person_wrap .rihgt_txt > b{display:inline-block;margin-bottom:10px;font-size:20px}
#inc04 .example_list > li > .person_wrap .rihgt_txt > span{display:block;font-size:15px;color:#aaa}

#inc04 .Experience_wrap{display:flex;justify-content:space-between;margin:140px 0 155px}
#inc04 .Experience_wrap .all_img04{overflow:hidden;width:46%;height:490px;margin-top:5px;border-radius:20px}
#inc04 .Experience_wrap .all_img04_mobile{display:none} 
#inc04 .Experience_wrap .right_txt{width:48%}
#inc04 .Experience_wrap .bar_wrap{width:74%;margin-top:50px}
#inc04 .Experience_wrap .bar_wrap > li{margin-bottom:20px}
#inc04 .Experience_wrap .bar_wrap > li:last-child{margin-bottom:0}
#inc04 .Experience_wrap .bar_wrap > li > span{display:block;margin-bottom:5px;font-size:17px;font-weight:500;line-height:1}
#inc04 .Experience_wrap .bar_wrap .progress{appearance:none;width:100%;height:5px;animation:all .5s}
#inc04 .Experience_wrap .bar_wrap .progress::-webkit-progress-bar{height:100%;border-radius:50pt;background:#f5f5f5}
#inc04 .Experience_wrap .bar_wrap .progress::-webkit-progress-value{border-radius:50pt;background:var(--primary)}
#inc04 .consul_btn{display:flex;align-items:center;justify-content:center;width:145px;height:45px;margin-top:45px;border-radius:5px;background:var(--primary);transition:all .5s;font-size:15px;font-weight:600;color:#fff}

/* 반응형 [s] */
@media (hover:hover){
#inc04 .consul_btn:hover{background:var(--skybg)}
}
@media (max-width:1024px){
#inc04 .all_tit_box {text-align:center}
#inc04 .example_list{margin:0 0 60px}
#inc04 .example_list > li{height:auto;padding:25px 20px}
#inc04 .example_list > li > p{margin-bottom:25px;font-size:18px}
#inc04 .Experience_wrap{margin:80px 0}
#inc04 .Experience_wrap .all_img04_pc{display:none} 
#inc04 .Experience_wrap .all_img04_mobile{display:block;position:relative;width:50%;padding-bottom:50%;height:auto;margin:0 auto} 
#inc04 .Experience_wrap .all_img04_mobile > img{position:absolute;top:0;left:0}
#inc04 .Experience_wrap .right_txt{width:100%}
#inc04 .Experience_wrap .bar_wrap{width:100%}
#inc04 .consul_btn{margin:45px auto 0}
}
@media (max-width:768px){
#inc04 .Experience_wrap{margin:60px 0}
#inc04 .Experience_wrap .all_img04_mobile{width:100%;padding-bottom:60%}
#inc04 .example_list > li{width:49%;padding:20px 15px}
#inc04 .example_list > li:nth-child(n+3){margin-top:15px}
#inc04 .example_list > li:nth-child(3n){margin-right:2%}
#inc04 .example_list > li:nth-child(2n){margin-right:0}
#inc04 .example_list > li > .person_wrap .rihgt_txt > b{font-size:18px}
}
@media (max-width:480px){
#inc04 .Experience_wrap .all_img04_mobile{padding-bottom:70%}
#inc04 .example_list{margin:0 0 40px}
#inc04 .example_list > li{width:100%;margin-right:0;border-radius:10px}
#inc04 .example_list > li:nth-child(n+2){margin-top:15px}
#inc04 .example_list > li:nth-child(3n){margin-right:0}
#inc04 .example_list > li > p{margin-bottom:15px;padding-top:30px;font-size:16px}
#inc04 .example_list > li > p:after{width:85px;height:15px}
#inc04 .example_list > li > .person_wrap .rihgt_txt > b{font-size:17px}
#inc04 .example_list > li > .person_wrap .img{width:45px;height:45px}
#inc04 .Experience_wrap .bar_wrap{margin-top:40px}
#inc04 .Experience_wrap .bar_wrap > li > span{font-size:16px}
}
/* 반응형 [e] */