@charset "euc-kr";

.courseWrap {position: relative; width: 100%; max-width: 1080px; margin: 40px auto 100px; font-family: "Pretendard", sans-serif; letter-spacing: normal; font-weight: 400; line-height: normal; color: var(--brand-color-gray-900); box-sizing: border-box; text-align: center;}

/* 사이드 배너 */
.side-banner-wrap {position: absolute; top: 0; max-width: 106px;}
.side-banner-wrap.left {left: -30px; transform: translateX(-100%);}
.side-banner-wrap.right {right: -30px; transform: translateX(100%);}
.side-banner + .side-banner {margin-top: 10px;}
.side-banner .item {display: block;}
.side-banner-mobile {display: none; flex-wrap: wrap; gap: 10px; margin-bottom: 30px;}
.side-banner-mobile .side-banner {flex: 1 0 auto; margin: 0;}
.side-banner-mobile .side-banner .item {height: 100%; box-sizing: border-box; border-radius: 10px; border: 1px solid #89C4FC; background: #FFF; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 6px; padding: 16px; font-weight: 700; font-size: 13px; line-height: 1.3;}
.side-banner-mobile .side-banner.event {width: 100%;}
.side-banner-mobile .side-banner.event .item {border: none; background: #E3F1FF; flex-direction: row; justify-content: flex-start; padding: 10px 16px; text-align: left;}
.side-banner-mobile .side-banner.event .item .text-caption {display: block; color: #000; font-weight: 400; opacity: 0.4; margin-top: 3px;}
.special .side-banner-mobile .side-banner .item {border-color: #FF8885;}

/* 컨텐츠 영역 */
.course-title-wrap {display: flex; align-items: center; gap: 10px; margin-bottom: 20px;}
.course-title-wrap .tab-list {display: inline-flex; gap: 5px;}
.course-title-wrap .tab-list li a {font-weight: 400; padding: 1px 15px; color: var(--brand-color-gray-500); border-color: var(--brand-color-gray-100); background: var(--brand-color-gray-50);}
.course-title-wrap .tab-list li.on a {color: var(--brand-primary-blue); border-color: var(--brand-primary-blue); background: var(--brand-primary-white);}

.lecTab_wrap > div ul li button {font-family: "Pretendard", sans-serif;}
.special .lecTab_wrap > div ul li.on button span {background: #FF2A28;}

@media screen and (max-width: 1200px){
    .courseWrap {padding: 0 20px;}

    /* 사이드 배너 */
    .side-banner-wrap {display: none;}
    .side-banner-mobile {display: flex;}
}