@charset "utf-8";
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable.min.css");

#contents.teacher {}
#contents.teacher .highlight { color: #9ac455; }
#contents.teacher .btn { display: inline-block; font-size: 18.5px; font-weight: 700; padding: 16px 20px; line-height: 1; border-radius: 100px; color: #fff; background: #9ac455; box-shadow: 0 0 16px 0 rgba(154, 196, 85, 0.19); }
#contents.teacher .btn:hover { background: #ebf3dd; color: #5f881c; }
#contents.teacher .btn.white { background: #fff; color: #547c12; }
#contents.teacher .page_contents { font-family: 'Pretendard Variable'; color: #252121; font-weight: 500; }


#contents.teacher .page_contents .top-banner { width: 100%; height: 355px; padding: 80px 0 0 54px; color: #fff; background: url('../images/teacher/teacher-top-bg.jpg') right bottom #9ac455; }
#contents.teacher .page_contents .top-banner > p:nth-of-type(1) { font-size: 36px; font-weight: 700; line-height: 46px; }
#contents.teacher .page_contents .top-banner > p:nth-of-type(2) { margin-top: 10px; font-size: 20px; line-height: 32px; }
#contents.teacher .page_contents .top-banner > .btn { margin-top: 25px; }


#contents.teacher .page_contents .card-list { width: 100%; padding: 34px 28px; background: linear-gradient(to bottom, #f4f2f9 50%,#9ac455 100%); }
#contents.teacher .page_contents .card-list .section { position: relative; width: 100%; padding: 49px 0 0 52px; font-size: 18px; background: #fff; border-radius: 20px; box-shadow: 0 0 40px 0 rgba(246, 245, 250, 0.57); }
#contents.teacher .page_contents .card-list .section~.section { margin-top: 25px; }
#contents.teacher .page_contents .card-list .section strong { font-weight: 700; }
#contents.teacher .page_contents .card-list .section .num { font-size: 30px; font-weight: 700; color: rgba(154,196,85,0.5); line-height: 1; }
#contents.teacher .page_contents .card-list .section .title { font-size: 25px; font-weight: 700; margin-bottom: 15px; line-height: 1; display: flex; align-items: center; gap: 5px; }
#contents.teacher .page_contents .card-list .section > .title { margin-top: 18px; }
#contents.teacher .page_contents .card-list .section .title .box { border: 1px solid #9ac455; border-radius: 5px; padding: 7px; background: #ebf3dd; font-size: 14px; font-weight: 700; margin: 0 5px; }
#contents.teacher .page_contents .card-list .section .noti { margin-top: 17px; font-size: 16px; color: rgba(37, 33, 33, 0.7); }
#contents.teacher .page_contents .card-list .section .swiper { position: relative; overflow: hidden; box-shadow: 0 0 40px 0 rgba(219, 219, 219, 0.43); }
#contents.teacher .page_contents .card-list .section .prev,
#contents.teacher .page_contents .card-list .section .next { position: absolute; top: 50%; width: 33px; height: 33px; z-index: 5; margin-top: -16px; cursor: pointer; }
#contents.teacher .page_contents .card-list .section .prev { left: 20px; }
#contents.teacher .page_contents .card-list .section .next { right: 20px; }


#contents.teacher .page_contents .card-list .section1 { padding-right: 58px; padding-bottom: 85px; }
#contents.teacher .page_contents .card-list .section1 .flex { margin-top: 18px; display: flex; justify-content: space-between; align-items: flex-start; }
#contents.teacher .page_contents .card-list .section1 .flex > div {}
#contents.teacher .page_contents .card-list .section1 .slide { width: 596px; margin: 60px auto 0; }
#contents.teacher .page_contents .card-list .section1 .slide > ul { display: flex; gap: 120px; }
#contents.teacher .page_contents .card-list .section1 .slide > ul > li { display: flex; font-size: 18px; align-items: center; gap: 12px; }
#contents.teacher .page_contents .card-list .section1 .slide > ul > li > span { padding: 10px 18px; background: #f6f5fa; border-radius: 100px; }
#contents.teacher .page_contents .card-list .section1 .slide .swiper { margin-top: 20px; }
#contents.teacher .page_contents .card-list .section1 .slide .swiper .swiper-wrapper { height: max-content; }
#contents.teacher .page_contents .card-list .section1 .slide .swiper .prev,
#contents.teacher .page_contents .card-list .section1 .slide .swiper .next { width: 38.5px; height: 38.5px; margin-top: -19px; }


#contents.teacher .page_contents .card-list .section2 { padding-bottom: 323px; background: url('../images/teacher/teacher-sec2-1.png') 84px bottom no-repeat #fff; }
#contents.teacher .page_contents .card-list .section2 > ul { margin-top: 20px; }
#contents.teacher .page_contents .card-list .section2 > ul > li { display: flex; align-items: center; gap: 5px; font-size: 18px; line-height: 1; }
#contents.teacher .page_contents .card-list .section2 > ul > li~li { margin-top: 8px; }
#contents.teacher .page_contents .card-list .section2 > ul > li > span:nth-of-type(1) { width: 20px; height: 20px; border-radius: 20px; background: #9ac455; color: #fff; font-size: 12px; font-weight: 700; text-align: center; line-height: 20px; }

#contents.teacher .page_contents .card-list .section2 > .qr { position: absolute; bottom: 39px; right: 93px; display: flex; flex-direction: column; align-items: center; }
#contents.teacher .page_contents .card-list .section2 > .qr > p:nth-of-type(1) { width: 112px; }
#contents.teacher .page_contents .card-list .section2 > .qr > p:nth-of-type(1) > img { width: 100%; }
#contents.teacher .page_contents .card-list .section2 > .qr > p:nth-of-type(2) { margin: 19px 0 12px 0; font-size: 14px; font-weight: 600; }
#contents.teacher .page_contents .card-list .section2 > .qr > p:nth-of-type(2) > span { font-weight: 800; }


#contents.teacher .page_contents .card-list .section3 { padding-bottom: 50px; }
#contents.teacher .page_contents .card-list .section3 .slide { margin-top: 50px; display: flex; gap: 39px; }
#contents.teacher .page_contents .card-list .section3 .slide .swiper { border-radius: 10px; }
#contents.teacher .page_contents .card-list .section3 .slide > div:nth-of-type(1) { width: 351px; height: 264px; position: relative; }
#contents.teacher .page_contents .card-list .section3 .slide > div:nth-of-type(1) > p { position: absolute; left: -23px; top: -32px; z-index: 5; min-width: 141px; height: 65px; background: url('../../images/teacher-sec3-mark.png') left top/141px no-repeat; padding: 8px; }
#contents.teacher .page_contents .card-list .section3 .slide > div:nth-of-type(1) > p > span { display: flex; justify-content: center; align-items: center; color: #fff; font-size: 20px; font-weight: 700; line-height: 1; padding: 0 17px; height: 46px; background: #434445; border-radius: 10px; }
#contents.teacher .page_contents .card-list .section3 .slide > div:nth-of-type(1) .prev { left: 10px; }
#contents.teacher .page_contents .card-list .section3 .slide > div:nth-of-type(1) .next { right: 10px; }

#contents.teacher .page_contents .card-list .section3 .slide > div:nth-of-type(2) { width: 344px; height: 264px; background: url('../images/teacher/teacher-sec3-2-bg.png') center/100%; display: flex; justify-content: center; align-items: center; border-radius: 15px; }
#contents.teacher .page_contents .card-list .section3 .slide > div:nth-of-type(2) .prev { left: 10px; }
#contents.teacher .page_contents .card-list .section3 .slide > div:nth-of-type(2) .next { right: 10px; }
#contents.teacher .page_contents .card-list .section3 .slide > div:nth-of-type(2) .swiper { width: 309px; height: 205px; }


#contents.teacher .page_contents .card-list .section4 { padding-bottom: 60px; }
#contents.teacher .page_contents .card-list .section4 > ul { margin-top: 30px; display: flex; gap: 18px; }
#contents.teacher .page_contents .card-list .section4 .btn { width: 208px; text-align: center; }
#contents.teacher .page_contents .card-list .section4 .slide { margin-top: 50px; display: flex; width: 100%; gap: 50px; }
#contents.teacher .page_contents .card-list .section4 .slide > div {}
#contents.teacher .page_contents .card-list .section4 .slide > div > p { font-size: 18.5px; font-weight: 700; color: #211e1e; text-align: center; margin-bottom: 25px; }
#contents.teacher .page_contents .card-list .section4 .slide > div:nth-of-type(1) > ul { display: flex; gap: 10px; }
#contents.teacher .page_contents .card-list .section4 .slide > div:nth-of-type(1) > ul > li { width: 191px; height: 393px; background: url('../images/teacher/teacher-sec4-bg.png') center/100%; display: flex; justify-content: center; align-items: center; }
#contents.teacher .page_contents .card-list .section4 .slide > div:nth-of-type(1) > ul > li .swiper { width: 178px; border-radius: 30px; }
#contents.teacher .page_contents .card-list .section4 .slide > div:nth-of-type(1) > ul > li .swiper-wrapper { height: max-content; }
#contents.teacher .page_contents .card-list .section4 .slide > div:nth-of-type(1) > ul > li .swiper .next { right: 10px; }
#contents.teacher .page_contents .card-list .section4 .slide > div:nth-of-type(1) > ul > li .swiper .prev { left: 10px; }
#contents.teacher .page_contents .card-list .section4 .slide > div:nth-of-type(1) > ul > li .swiper .swiper-button-disabled { opacity: 0; }

#contents.teacher .page_contents .card-list .section4 .slide > div:nth-of-type(2) > p { margin-bottom: 35px; }
#contents.teacher .page_contents .card-list .section4 .slide > div:nth-of-type(2) > div { width: 289px; position: relative; }
#contents.teacher .page_contents .card-list .section4 .slide > div:nth-of-type(2) > div > p:nth-of-type(1) { position: absolute; left: -23px; top: -32px; z-index: 5; min-width: 141px; height: 65px; background: url('../../images/teacher-sec3-mark.png') left top/141px no-repeat; padding: 8px; }
#contents.teacher .page_contents .card-list .section4 .slide > div:nth-of-type(2) > div > p:nth-of-type(1) > span { display: flex; justify-content: center; align-items: center; color: #fff; font-size: 20px; font-weight: 700; line-height: 1; padding: 0 17px; height: 46px; background: #434445; border-radius: 10px; }
#contents.teacher .page_contents .card-list .section4 .slide > div:nth-of-type(2) > div .swiper { border-radius: 10px; overflow: hidden; }
#contents.teacher .page_contents .card-list .section4 .slide > div:nth-of-type(2) > div .swiper-wrapper { height: max-content; }
#contents.teacher .page_contents .card-list .section4 .slide > div:nth-of-type(2) > div .swiper-slide img { width: 100%; }
#contents.teacher .page_contents .card-list .section4 .slide > div:nth-of-type(2) > div .swiper .next { right: 10px; }
#contents.teacher .page_contents .card-list .section4 .slide > div:nth-of-type(2) > div .swiper .prev { left: 10px; }


#contents.teacher .page_contents .card-list .section5 { padding-bottom: 65px; background: url('../images/teacher/teacher-sec5.png') calc(100% - 68px) center no-repeat #fff; }
#contents.teacher .page_contents .card-list .section5~.section { padding-bottom: 65px; }


#contents.teacher .page_contents .card-list .section6 { background: url('../images/teacher/teacher-sec6.png') calc(100% - 79px) center no-repeat #fff; }
#contents.teacher .page_contents .card-list .section6 .btn { margin-top: 25px; }



#contents.teacher .page_contents .card-list .section7 { background: url('../images/teacher/teacher-sec7.png') calc(100% - 60px) center no-repeat #fff; }
#contents.teacher .page_contents .card-list .section7 .btn { margin-top: 25px; }