@charset "utf-8";

#inc02{background:#fff}
#inc02 #img_bar{display:grid;grid-template-columns:repeat(2, 1fr);gap:37px;max-width:1400px;width:100%;margin:0 auto}
#inc02 #img_bar img{width:100%;border-radius:8px}
#inc02 #img_bar a{padding:20px 0;color:#fff;background:#111}
#inc02 .inc02_inner{max-width:1140px;width:100%;margin: 0 auto;}
#inc02 .cont_box{padding:100px 30px 60px;display:flex;align-items:center}
#inc02 .cont_box .ko_tit{color:#222;font-size:28px;font-family:'LotteMartDreamBold'}
#inc02 .cont_box .ko_tit span{display:block;color:#aaa;font-size:18px}
#inc02 .cont_box ul{flex-grow:1;display:flex;align-items:center;margin-left:50px}
#inc02 .cont_box ul li{position:relative;width:25%;text-align:center}
#inc02 .cont_box ul li+li:before{position:absolute;left:0;top:50%;transform:translateY(-50%);background:#e1e1e1;content:'';width:1px;height:47px}
#inc02 .cont_box ul li img{transition:all .2s}
#inc02 .cont_box ul li a{display:block;height:100%}
#inc02 .cont_box ul li a p{margin-top:20px;color:#222;font-size:17px;transition:all .2s;font-family:'LotteMartDreamBold'}
#inc02 .video_inr{background:linear-gradient(to right, var(--second) 2%, var(--primary) 90%)}
#inc02 #video{gap:50px;max-width:1140px;width:100%;margin:0 auto;padding:60px 0}
#inc02 #video p{padding-bottom:26px;font-size:30px;color:#fff;line-height:1.35;font-family:'LotteMartDreamBold';text-align: right;word-break:keep-all}
#inc02 #video .video_area{display:grid;grid-template-columns:repeat(2, 1fr);gap:50px;width:100%;height:100%;border-radius:16px}
#inc02 #video .video_area button{width:100%;border-radius:16px}
#inc02 #video .video_area .youtube_img{width:100%;height: 330px;border-radius:16px}
#inc02 #video .v_txt{text-align:right;color:#ffffffc7;word-break:keep-all}

/* 배너 */
#inc02 .banner_box{margin-bottom:70px;background:linear-gradient(to right, var(--second) 2%, var(--primary) 90%);border-radius:20px}
#inc02 .banner{position:relative;padding:50px 70px;color:#fff;font-family:'LotteMartDreamBold'}
#inc02 .banner > p{padding-left:20px;margin-bottom:15px;font-size:28px}
#inc02 .banner ul{display:flex} 
#inc02 .banner ul li{position:relative;width:114px;text-align:center}
#inc02 .banner ul li+li:before{position:absolute;left:-2px;top:30px;content:'';width:6px;height:6px;background:#fff;border-radius:50%}
#inc02 .banner ul li span{color:rgba(255,255,255,0.4);font-size:16px}
#inc02 .banner ul li p{font-size:27px}
#inc02 .banner img{position:absolute;bottom:-30px;right:71px}

/* 라테스트 */
#inc02 .top_tit{padding:80px 0 40px 0;font-size:40px;text-align:center;color:#111;font-family:'LotteMartDreamBold'}
#inc02 .latest{display:grid;grid-template-columns: repeat(3, 1fr);gap:20px;position:relative;margin:0 0 100px 0}
#inc02 .latest > div{width:100%}
#inc02 .latest .tit{padding:0 0 12px 0;display:flex;align-items:center;border-bottom:2px solid #222;font-size:20px;color:#222;font-family:'LotteMartDreamBold'}
#inc02 .latest .tit a{margin-left:auto;width:30px;height:30px;border-radius:8px;color:#fff;text-align:center;line-height:30px;background:#333}
#inc02 .latest .tit a svg{width:16px;height:16px}
#inc02 .latest  ul{padding:36px 0 0}
#inc02 .latest  ul li+li{margin-top:12px}
#inc02 .latest  ul li .cate{min-width:52px;height:26px;margin-right:12px;color:#aaa;border:1px solid #e1e1e1;border-radius:20px;font-size:14px;line-height:24px;text-align:center;font-family:'LotteMartDreamBold'}
#inc02 .latest  ul li .subj{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#222;font-family:'notokr-medium'}
#inc02 .latest  ul li .date{flex-shrink:0;margin-left:auto;color:#959595;font-size:14px}
#inc02 .latest  ul li a{display:flex;font-family:'notokr-regular'}

@media(hover:hover){
#inc02 .cont_box ul li:hover img{transform:translateY(-5px)}
#inc02 .cont_box ul li a:hover p{color:var(--primary)}
}
@media(max-width:1180px){
#inc02{padding:0}	
#inc02 #img_bar{padding:0 20px}
}
@media(max-width: 1024px){
#inc02 #img_bar{padding:0 15px}
#inc02 .cont_box{padding:60px 30px 40px}
#inc02 .cont_box .ko_tit{font-size:24px}
#inc02 .cont_box .ko_tit span{font-size:16px}
#inc02 .banner{padding:40px 50px}
#inc02 .banner > p{padding:0;font-size:24px}
#inc02 .banner img{right:5%;max-width:390px;width:40%}
#inc02 .banner ul li{width:15%}
#inc02 .banner ul li span{Font-size:15px}
#inc02 .banner ul li p{font-size:22px}
#inc02 .latest{padding-bottom: 0;grid-template-columns: repeat(2, 1fr);}
#inc02 .latest:before{bottom:60px}
#inc02 #img_bar{gap:20px}    
#inc02 #video .video_area{gap:30px}
#inc02 #video p{font-size:25px}
#inc02 .inc02_inner{padding:0 15px}
#inc02 .top_tit{padding:40px 0;font-size:30px}
}
@media(max-width:768px){
#inc02 .cont_box{padding:60px 0 40px 15px}
#inc02 .cont_box ul li a p{font-size:15px}
#inc02 .cont_box .ko_tit{font-size:22px}
#inc02 .cont_box ul{margin-left:25px}
#inc02 .cont_box ul li img{width:25%}
#inc02 .banner{padding:25px 30px 20px}
#inc02 .banner > p{margin-bottom:10px;font-size:20px}
#inc02 .banner ul li p{font-size:20px}
#inc02 .banner_box{margin-bottom:40px}
#inc02 .latest .tit{font-size:20px}
#inc02 #img_bar{gap:15px}
#inc02 #video{padding:40px 20px}
#inc02 #video .video_area{grid-template-columns:repeat(1, 1fr)}
#inc02 #video .v_txt{text-align:center}
#inc02 #video .subj{display:block;text-align:center}
#inc02 #video .video_area .youtube_img{height:auto}
#inc02 #video p{font-size:22px}
#inc02 .top_tit{font-size:25px}
}
@media(max-width:640px){
#inc02 .cont_box{display:block;padding:40px 0 30px;text-align:center}	
#inc02 .cont_box .ko_tit{margin-bottom:25px}
#inc02 .cont_box ul{margin:0}
#inc02 .banner img{bottom:-20px;right:3%}
#inc02 .banner > p{font-size:16px}
#inc02 .banner ul{width:100%}
#inc02 .banner ul li span{font-size:13px}
#inc02 .banner ul li p{font-size:16px}
#inc02 .banner ul li{width:17%}
#inc02 .banner ul li+li:before{width:3px;height:3px}
#inc02 .latest {display:block;padding-bottom:0;margin-bottom:50px}
#inc02 .latest:before{display:none}
#inc02 .latest > div{width:100%}
#inc02 .latest > div+div{margin-top:40px}
#inc02 .latest ul{padding-top:20px}
#inc02 .latest ul li+li{margin-top:8px}
}
@media(max-width:480px){
#inc02{padding:0}	
#inc02 .banner{padding:20px}
#inc02 .banner ul li{width:20%}
#inc02 .banner > p{word-break:keep-all}
#inc02 .latest ul li .cate{font-size:13px}
#inc02 #img_bar{grid-template-columns:repeat(1, 1fr)}
#inc02 #img_bar a:nth-child(1){padding:20px 0 0 0}
#inc02 #img_bar a:nth-child(2){padding:0 0 20px}
#inc02 #video{padding:40px 15px}
#inc02 #video p{font-size:18px}
#inc02 .latest .tit{font-size:18px}
}
@media(max-width:380px){
#inc02 .banner{padding:20px 20px 60px;text-align:center}
#inc02 .banner ul li{width:calc(100% / 3)}
#inc02 .banner img{right:5%}
#inc02 .latest ul{justify-content:center}
#inc02 .cont_box ul li img{width:30%}
#inc02 .cont_box ul li a p{font-size:14px;letter-spacing:-.8px}
}