@charset "utf-8";

#include03_wrapper{display:flex;gap:20px;margin:65px auto;max-width:1200px;overflow:hidden}
#include03_wrapper .latest_box_tit{position:relative;font-size:20px;color:#333;font-family:'notokr-bold';margin-bottom:16px}

/*커뮤니티*/
#include03_wrapper .section01{display:flex;flex-direction:column;width:calc(68% - 10px)}
#include03_wrapper .section01 .box01{display:flex;background:#f7f7f7;width:100%;overflow:hidden}
#include03_wrapper .section01 .box01 .video{display:flex;flex-direction:column;width:100%}
#include03_wrapper .section01 .box01 .video img{width:100%;height:214px;object-fit:cover}
#include03_wrapper .section01 .box01 .video_tit{padding:10px 0 10px 16px;color:#fff;font-size:15px;font-family:'notokr-regular';background: #12335e;}
#include03_wrapper .section01 .box01 .latest_box{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;width:50%;overflow:hidden;position:relative;padding:26px}
#include03_wrapper .section01 .box01 .latest_box p{width:50%;font-size:18px;font-family:'notokr-bold';color:#333}
#include03_wrapper .section01 .box01 .latest{width:100%}

/*강의자료 오시는길 고객센터*/
#include03_wrapper .section01 .box02{margin-top:23px}
#include03_wrapper .section01 .box02 ul{display:flex;overflow:hidden}
#include03_wrapper .section01 .box02 li{border:1px solid #e2e2e2;width:calc(100% / 3);height:138px;position:relative;-webkit-transition:.2s;transition:.2s}
#include03_wrapper .section01 .box02 li:nth-child(2){border-left:none;border-right:none}
#include03_wrapper .section01 .box02 li p{width:100%;font-size:15px;color:#b5b5b5;line-height:24px;font-family:'notokr-regular';word-break:keep-all}
#include03_wrapper .section01 .box02 li .box2_tit{width:50%;font-size:18px;font-family:'notokr-bold';color: #111;}

#include03_wrapper .section01 .box02 li a{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;padding:14px 20px;height:100%}
#include03_wrapper .section01 .box02 li .fax{color:#888}
#include03_wrapper .section01 .box02 li .tel{font-size:22px;color: #12335e;font-family:'notokr-bold'}

/*강사소개*/
#include03_wrapper .section02{width:calc(32% - 10px)}
#include03_wrapper .section02 .tit_wrap{display:flex;justify-content:space-between;overflow:hidden}
#include03_wrapper .section02 .tit_wrap a{position:relative;padding-right:12px;font-size:13px;color:#626262;font-family:'notokr-bold'}
#include03_wrapper .section02 .tit_wrap a i{position:absolute;top:8px;right:0;font-size:10px}
#include03_wrapper .section02 .sub_tit{padding-top: 8px;font-size:16px;color:#717171;font-family:'notokr-regular'}
#include03_wrapper .section02 h4{font-size:20px;color:#222;font-family:'notokr-medium';margin:8px 0 15px}
#include03_wrapper .section02 h4 span{font-size:15px;font-family:'notokr-regular'}
#include03_wrapper .section02 li > div > a > span{font-size:15px;color:#fff;background: #12335e;line-height:30px;padding:7px 33px;cursor:pointer;font-family:'notokr-regular'}
#include03_wrapper .section02 img{margin-top:28px}

/*슬라이드*/
#include03_wrapper .swiper-container{position:relative;width:100%;height:100%;background:#f7f7f7;text-align:center;overflow:hidden}
#include03_wrapper .pager{position:absolute;z-index:1;top:5%;right:8%;left:auto !important;bottom:auto !important;width:auto !important}
#include03_wrapper .swiper-pagination-bullet{margin:0 2px;width:7px;height:7px}
#include03_wrapper .swiper-pagination-bullet-active{background-color: #12335e;}

/* 반응형 [s] */
@media (hover:hover){
#include03_wrapper .section01 .box02 li:hover{background-color:#f7f7f7}
#include03_wrapper .section02 li > a > span:hover{background:#f46507}
#include03_wrapper .l_box .bx-controls-direction a:hover{opacity:1}
}
@media (max-width:1080px){
#include03_wrapper .section01 .box01 .video_tit{font-size:14px}
#include03_wrapper .section01 .box02 li p{font-size:14px;line-height:1.5}
}
@media (max-width:1024px){
#include03_wrapper{flex-direction:column-reverse;gap:35px;margin:0 auto 65px;width:95%}
#include03_wrapper .latest_box_tit{font-size:18px}
#include03_wrapper .section01{width:100%}
#include03_wrapper .section01 .box01 .latest_box p{font-size:17px}
#include03_wrapper .section01 .box02 li{height:auto}
#include03_wrapper .section01 .box02 li .box2_tit{font-size:16px}
#include03_wrapper .section01 .box02 li a img{width:36px}
#include03_wrapper .section01 .box02 li p:last-child{padding-top:15px}
#include03_wrapper .section02{margin-top:35px;width:100%}
#include03_wrapper .section02 img{margin-top:0px}
#include03_wrapper .section02 h4{margin:12px 0 28px}
#include03_wrapper .section02 li > div > a > span{padding:12px 42px}
#include03_wrapper .swiper-slide{display:flex;justify-content:center;align-items:center;gap:35px;padding:24px 0 18px}
#include03_wrapper .pager{top:85%;right:3%}
#include03_wrapper .swiper-pagination-bullet{margin:0 4px;width:9px;height:9px}
}
@media (max-width:768px){
#include03_wrapper{gap:30px}
#include03_wrapper .latest_box_tit{margin-bottom:12px;font-size:16px}
#include03_wrapper .section01 .box01{flex-direction:column}
#include03_wrapper .section01 .box01 .video{width:100%}
#include03_wrapper .section01 .box01 .latest_box{padding:24px 16px;width:100%}
#include03_wrapper .section01 .box01 .latest_box p{font-size:16px}
#include03_wrapper .section01 .box02 li .box2_tit{font-size:15px}
#include03_wrapper .section01 .box02 li a{padding:18px}
#include03_wrapper .section01 .box02 li a img{width:30px}
#include03_wrapper .section01 .box02 li p{font-size:13px}
#include03_wrapper .section01 .box02 li p:last-child{padding-top:12px}
#include03_wrapper .section01 .box02 li .tel{font-size:20px}
#include03_wrapper .section02{margin-top:30px}
#include03_wrapper .section02 img{width:178px}
#include03_wrapper .section02 .sub_tit{font-size:15px}
#include03_wrapper .section02 h4{margin:6px 0 22px;font-size:18px}
#include03_wrapper .section02 li > div > a > span{padding:10px 38px}
#include03_wrapper .swiper-slide{padding:20px 0 13px}
#include03_wrapper .swiper-pagination-bullet{margin:0 3px;width:8px;height:8px}
}
@media (max-width:480px){
#include03_wrapper{margin:0 auto 20px}
#include03_wrapper .latest_box_tit{margin-bottom:10px;font-size:15px}
#include03_wrapper .section01 .box01 .video img{height:195px}
#include03_wrapper .section01 .box01 .video_tit{font-size:13px}
#include03_wrapper .section01 .box01 .latest_box p{font-size:15px}
#include03_wrapper .section01 .box02 ul{flex-direction:column}
#include03_wrapper .section01 .box02 li{width:100%}
#include03_wrapper .section01 .box02 li:nth-child(2){border-left:1px solid #e2e2e2;border-right:1px solid #e2e2e2;border-top:none;border-bottom:none}
#include03_wrapper .section01 .box02 li a{flex-direction:column;justify-content:center;align-items:center;padding:20px 8px 14px}
#include03_wrapper .section01 .box02 li .box2_tit{order:1;margin-top:12px;width:auto;font-size:16px}
#include03_wrapper .section01 .box02 li p:last-child{order:2;padding:5px 0;text-align:center;font-size:14px}
#include03_wrapper .section01 .box02 li a img{width:36px}
#include03_wrapper .section01 .box02 li .tel{font-size:18px}
#include03_wrapper .section02 img{width:156px}
#include03_wrapper .section02 .sub_tit{font-size:14px}
#include03_wrapper .section02 h4{margin:4px 0 16px;font-size:16px}
#include03_wrapper .section02 li > div > a > span{padding:8px 30px;font-size:14px}
#include03_wrapper .swiper-slide{gap:22px}
#include03_wrapper .swiper-pagination-bullet{margin:0 2px;width:7px;height:7px}
}
@media (max-width:380px){
#include03_wrapper{margin:0 auto 10px}
#include03_wrapper .section01 .box01 .video img{height:178px}
#include03_wrapper .section01 .box01 .latest_box{padding:20px 16px}
#include03_wrapper .section01 .box02 li a{padding:18px 8px 10px}
#include03_wrapper .section01 .box02 li a img{width:34px}
#include03_wrapper .section01 .box02 li .box2_tit{margin-top:10px;font-size:15px}
#include03_wrapper .section01 .box02 li p:last-child{font-size:13px}
#include03_wrapper .section01 .box02 li .tel{font-size:17px}
#include03_wrapper .section02 img{width:140px}
#include03_wrapper .section02 .sub_tit{font-size:13px}
#include03_wrapper .section02 h4{margin:2px 0 12px;font-size:15px}
#include03_wrapper .section02 li > div > a > span{padding:7px 28px;font-size:13px}
#include03_wrapper .swiper-slide{padding:18px 0 11px;gap:18px}
}
/* 반응형 [e] */