/* bsSlider 초기화 */
.bx-wrapper{border:none !important;box-shadow: none !important;-moz-box-shadow:none !important;-webkit-box-shadow:none !important}
/* S: main CSS */
.mainSlide{background:#F6F9FF;}
.mainSlide ul{display:flex;justify-content: space-between;width:100%}
.content{margin:0; overflow:hidden;}
.inner{ width:1200px; margin:0 auto;}
.row{margin-bottom:40px !important;}
.smallBanner{margin-bottom:40px;}
.content h2{margin-bottom:16px; display:inline-block}
.spaceNone{align-items:flex-start}
.empty{font-size:1.4rem; color:#999;}
.center{text-align:center;}

/* E: main CSS */ 

/* S : 레이어팝업 */
.blackWrap{width:100%; height:100%; background:rgba(0,0,0,0.7); position:fixed; top:0; left:0; z-index:9999; display:grid; place-items:center}
.blackWrap .pc_item{display:block}
.blackWrap .m_item{display:none}
.blackWrap .closePop{color:#fff; cursor:pointer; font-weight:bold; background:#222; border-radius:4px; padding:7px 5px;}
.blackWrap .closePop label{font-size:1.3rem}
.blackWrap .closePop input[type="checkbox"]{width:14px;height:14px}
.blackWrap .bw_hide{float:right; margin-left:10px;}

/* S : 레이어팝업 */
 

.btnPrev{position:absolute; left:50%; cursor:pointer; top:220px; margin-left:-720px}
.btnNext{position:absolute; left:50%; cursor:pointer; top:220px; margin-left:660px;}
.sBpage{top:10px !important; text-align:right !important; padding-right:12px; bottom:auto !important}

/* S: 오픈 강의  */
.lectureArea{position: relative;align-self: flex-start;width:66%}
.lectureArea h2{margin-bottom:15px}
.lectureArea .bx-wrapper{margin:0}
.lectureArea .bx-wrapper .bx-pager{top:10px !important;right:0 !important;width:auto;padding:0;}
.lectureArea .bx-wrapper .bx-pager.bx-default-pager a{width:7px;height:7px;background:#ccc}
.lectureArea .bx-wrapper .bx-pager.bx-default-pager a:hover, .bx-wrapper .bx-pager.bx-default-pager a.active, .bx-wrapper .bx-pager.bx-default-pager a:focus{background:#00B0FF}
.lectureArea #slide1 li{max-height:500px}
.lectureArea #slide1 li a img{width:100%}
.lecturelol .owl-dots{position:absolute;top:0;right:0}

/* 이번달 오픈 강의 */
/*.openLectureArea h2{margin-top:30px}*/
.openLectureArea li{position: relative;border:1px solid #E1E1E1;padding:0px 18px 0px 0;margin-bottom:8px;}
.openLectureArea li a{display:flex;  align-items:center;}
.openLectureArea li:last-child{margin:0}
.openLectureArea li.on span:nth-child(2){color:#00B1FF}
.openLectureArea li span{font-size:1.4rem;letter-spacing: -0.48px;line-height: 2.4rem; }
.openLectureArea li .classOpen{width:80%; padding-left:16px;}
.openLectureArea li .classOpen h3{font-size:1.4rem; margin-bottom:4px }
.openLectureArea li span:nth-child(1){display:inline-flex;flex-direction:column;align-items:center;font-size:1.2rem;background:#222;color:#fff;line-height:135%;padding:12px 18px; width:60px;}
.openLectureArea li span:nth-child(1) strong{font-size:1.8rem;letter-spacing: -0.96px;margin-top:3px}
.openLectureArea li span:nth-child(2){display:inline-block;box-sizing: border-box;width: 100px;line-height:1;letter-spacing: -0.64px;color:#999;padding:0px 0px 0 15px;margin-top:18px;vertical-align: middle;font-weight: bold;} 
.openLectureArea li span:nth-child(3){position:relative;display:inline-block;width:60%;vertical-align: middle;padding:0px 20px 0 15px;margin-top:18px;border-left:1px solid #bcbcbc;font-weight: bold;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.openLectureArea li span:nth-child(4){display:inline-block; float: right; width: 10%;vertical-align: middle;font-size:1.2rem;color:#999;padding: 18px 0 0 15px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis; text-align:right;}

/* 스페셜패키지 슬라이드 */
.specialArea{padding:0 0 60px 0 }
.specialArea .swiper-slide p{font-size:1.4rem;color:#666666;letter-spacing: -0.8px;line-height:21px;padding:15px 0 0}
.specialArea .swiper-slide p strong{display: inline-block;font-size:1.4rem;color:#222222;padding-bottom:5px}
.specialImg{width:100%;height:240px;background-repeat:no-repeat;background-position:center; background-size:100%;}

/* 강의 맛보기 */
.tastingArea{align-self: flex-start;border:1px solid #e1e1e1;}
.tastingArea .top4Img{text-align:center; display:block; background:whitesmoke; min-height:360px; position:relative}
.tastingArea img{vertical-align: top; height:360px; margin:0 auto;}
.tastingArea .tBlock{position:absolute; top:0; left:0; z-index:90; width:100%; height:100%; box-sizing:border-box; overflow:hidden; background:rgba(0,0,0,0.4); transition:0.3s ease;}
.tastingArea .tBlock:hover{background:rgba(0,0,0,0.5)}
.tastingArea .tBlock img{width:auto; height:auto; padding-top:140px;}
.tastingArea h2{margin-bottom:15px}
.tastingArea ul{padding:0 15px 40px}
.tastingArea ul li{padding-top:15px;font-size:1.4rem;}
.tastingArea ul li.on .number{background:#00B1FF;}
.tastingArea ul li:first-child{padding-top:20px;}
.tastingArea ul li::after{content:'';display:block;clear:both;}
.tastingArea ul li:hover .number{background:#00B1FF;}
.tastingArea ul li .number{display:flex;justify-content: center;align-items: center;float: left;width:24px;height:24px;font-size:1.4rem;background:#002222;color:#fff;border-radius:20px;margin:0 10px 0 0; font-weight:600;}
.tastingArea ul li strong{display:inline-block;width:85%;color:#222;letter-spacing: -0.64px;line-height: 2.4rem;white-space: nowrap; font-weight:900;}
.tastingArea ul li .marquee{overflow:hidden;display:inline-block;width:85%;}
.tastingArea ul li p{color:#999;letter-spacing: -0.64px;line-height: 1.5;white-space: nowrap;text-overflow: ellipsis; font-size:1.4rem;}
.tastingArea ul li.on .marquee strong{
	display: block;
    white-space: nowrap;
	padding-left:5%;
    -webkit-animation-name:marquee;
    -webkit-animation-timing-function:linear;
    -webkit-animation-duration:8s;
    -webkit-animation-iteration-count:infinite;
    -moz-animation-name:marquee;
    -moz-animation-timing-function:linear;
    -moz-animation-duration:8s;
    -moz-animation-iteration-count:infinite;
    -ms-animation-name:marquee;
    -ms-animation-timing-function:linear;
    -ms-animation-duration:8s;
    -ms-animation-iteration-count:infinite;
    -o-animation-name:marquee;
    -o-animation-timing-function:linear;
    -o-animation-duration:8s;
    -o-animation-iteration-count:infinite;
    animation-name:marquee;
    animation-timing-function:linear;
    animation-duration:8s;
    animation-iteration-count:infinite;
}
@-webkit-keyframes marquee {
  from   { -webkit-transform: translate(0%);}
  99%,to { -webkit-transform: translate(-100%);}
}
@-moz-keyframes marquee {
  from   { -moz-transform: translate(0%);}
  99%,to { -moz-transform: translate(-100%);}
}
@-ms-keyframes marquee {
  from   { -ms-transform: translate(0%);}
  99%,to { -ms-transform: translate(-100%);}
}
@-o-keyframes marquee {
  from   { -o-transform: translate(0%);}
  99%,to { -o-transform: translate(-100%);}
}
@keyframes marquee {
  from   { transform: translate(0%);}
  99%,to { transform: translate(-100%);}
}
.tastingArea ul li.on .marquee p:hover {
-moz-animation-play-state: paused;
-webkit-animation-play-state: paused;
animation-play-state: paused;
}

/* E: 오픈 강의 */

/* S: 메인 풀 이미지 */
.fullBanner{width:100%;}
.fullBanner img{width:100%;vertical-align: top;}
/* E: 메인 풀 이미지 */

/* E: 메인 슬라이드1 */
.wingBanner{position:absolute; right:1px; top:240px; z-index:500; width:110px}
.wingToggle{display:none}
.wingBanner > div{margin-bottom:8px;border: 1px solid #e1e1e1;text-align: center;background: #fff;display: block;}
    


/* S: 강사 슬라이드2 */
#row_5 .empty{text-align:left; padding-top:24px;} 
.profSlider{position: relative;margin-bottom:20px}
.profPoint{font-size:2.8rem; line-height:1.5; color:#222 !important;}
#row_5 .profTag{overflow:hidden;}
#row_5 .profTag li{color:#fff; background:#222;  font-size:1.2rem; font-weight:bold; padding:6px 8px; border-radius:4px; float:left; margin-right:4px;}
#row_5 .profBtn{display:block;background:#f1f1f1; font-size:1.4rem; font-weight:800; margin-top:96px; padding:16px; border-radius:8px; width:80%; position:relative;}
#row_5 .profBtn span{position:absolute; right:16px;}
#row_5 .profNav{position:relative; margin-top:90px;}
#row_5 .profNext{cursor:pointer; position:absolute; left:40px; bottom:24px; text-align:right;}
#row_5 .profPrev{cursor:pointer; position:absolute; left:0; bottom:24px; text-align:left;}
#row_5 .profNav .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:#00B1FF !important}
.profSlider .swiper-slide{position: relative;min-height:350px;background:linear-gradient(45deg, #F6F9FE, #E9F0FF);;padding:32px 16px; overflow:hidden;}
.profSlider .swiper-slide .iconArea{display:inline-block;}
.profSlider .swiper-slide .iconArea span{background:#000;color:#fff;font-size:1.2rem;font-weight:bold;padding:6px 8px;border-radius:4px;}
.profSlider .swiper-slide p{width:100%;position:absolute; z-index:99; font-size:1.4rem;line-height:1.5;color:#fff; background:rgba(0,0,0,0.5);font-weight:700;overflow: hidden;white-space: normal;word-wrap: break-word;display: -webkit-box;-webkit-line-clamp: 2;padding:16px; bottom:0; left:0; transition:0.3s ease; height:auto;}
.profSlider .swiper-slide:hover p{padding:16px 16px 80px;;}
.profSlider .swiper-slide .profName{padding-top:24px; z-index:1;}
.profSlider .swiper-slide strong{font-size:2.4rem; color:#222222; font-weight:900;text-shadow: 0 0 5px #fff;}
.profSlider .swiper-slide em{display:block;font-size:1.4rem;color:#222222;font-weight:900;padding-top:8px;text-shadow: 0 0 5px #fff;}
.profSlider .swiper-slide img{position:absolute;right:-30px;bottom:0; width:220px !important}
/* E: 강사 슬라이드2 */

/* S: 추천도서 슬라이드 */
.bookRolling{position: relative;}
.bookRolling .bx-wrapper{width:100%;margin:0;background: none;}
.bookRolling .bx-controls{position: absolute;top: -25px;right: 10px;}
.bookRolling .bx-wrapper .bx-controls-direction a{width:20px;height:20px}
.bookRolling .bx-wrapper .bx-prev{left:-11px;background:url('https://cdn.jsdelivr.net/bxslider/4.2.12/images/controls.png') no-repeat -5px -38px}
.bookRolling .bx-wrapper .bx-next{right:-30px;background:url('https://cdn.jsdelivr.net/bxslider/4.2.12/images/controls.png') no-repeat -50px -37px}

.bookArea{width: 280px;
    height: 280px;
    background: #f1f1f1;
    overflow: hidden;
    display: flex;
    }
.bookArea img{
	width: 57% !important;
    align-self: flex-end;
    margin: 0 auto;
    box-shadow:3px 3px 3px #ccc
}
/* E: 추천도서 슬라이드 */

/* S: 메인탭 */
#mainTab > ul{display:flex;align-items: center;justify-content: center;}
#mainTab > ul li{border:1px solid #a5a5a5;border-radius: 15px;margin: 0px 10px;cursor: pointer;}
#mainTab > ul li:hover{background:#000;}
#mainTab > ul li:hover a{color:#fff}
#mainTab > ul li.ui-state-active{background:#000;}
#mainTab > ul li a{display: inline-block;padding: 10px 15px;font-size:1.5rem}
#mainTab > ul li.ui-state-active a{color:#fff}
#mainTab h2{padding:30px 0 0} 
.mainTabContent ul{display:flex;flex-wrap: wrap;align-items: center;}
.mainTabContent ul li{width:25%;padding-right: 2%;box-sizing: border-box;}
.mainTabContent ul li a{display:flex;flex-direction: column;}
.mainTabContent ul li div{display:flex;flex-direction: column;padding:15px 0}
.mainTabContent ul li div strong{font-weight: 700;color:#0468FF}
.mainTabContent ul li div strong span{position:relative; font-weight: normal;color:#999;margin-left: 5px;padding-left: 5px;}
.mainTabContent ul li div strong span::before{position: absolute;top: 50%;left: 0;width: 1px;height: 70%;background-color: #a5a5a5;
       -webkit-transform: translateY(-45%);
       transform: translateY(-45%);
       content: '';
}
.mainTabContent ul li div p{padding:3px 0}
.mainTabContent ul li div p strong{font-size:1.4rem;color:#222;}
/* E: 메인탭 */

/* S: 메인 수강생 리뷰 */
.mainReViewContent .swiper-slide{position: relative; height:240px;border:1px solid #e1e1e1;padding:20px 12px;box-sizing: border-box;overflow:hidden}
.mainReViewContent .starPoint{position: absolute;bottom:25px;left:15px;}

.mainReViewContent .starPoint span{font-size:1.4rem;color:#00B1FF;font-weight: bold;}
.mainReViewContent .starPoint span img{width:13px}
.mainReViewContent p:nth-child(1){background:#000;color:#fff;font-size:1.2rem;font-weight:bold;padding:6px 8px;border-radius:4px; display:inline; overflow:hidden;}
.mainReViewContent p:nth-child(2){width: 100%;font-size:1.8rem;color:#222;letter-spacing: -0.32px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis; margin-top:24px;}
.mainReViewContent p:nth-child(3){display: -webkit-box;font-size:1.4rem;color:#666;letter-spacing: -0.28px;overflow: hidden;text-overflow: ellipsis;white-space: normal;word-wrap: break-word;-webkit-line-clamp: 3;-webkit-box-orient: vertical;padding:20px 0 0 0;margin-bottom:20px; line-height:1.5}

.mainReViewContent p strong{font-size:1.5rem}
.mainReViewContent p span{color:#adadad}
/* E: 메인 수강생 리뷰 */

/* S: 메인 공지사항 */
#mainNotice{position: relative;width:100%;align-self: flex-start;}
#mainNotice .mainNoticeContent li{width: 100%;font-size:1.4rem;letter-spacing: -0.28px; white-space: nowrap;overflow: hidden;text-overflow: ellipsis;background:#F5F5F5;padding:12px 16px;margin-bottom:10px;border-radius: 8px;box-sizing: border-box;}
#mainNotice .mainNoticeContent li:last-child{margin:0}
#mainNotice .mainNoticeContent li span{display:inline;width:55px;font-weight:bold;color:#FF4188;padding-right:8px}
#mainNotice .mainNoticeContent li em{font-weight:500;}
/* E: 메인 공지사항 */

/* S: 추천도서 */
.bookTitPoint{color:#0468FF}
.mainBookList .bookLists img{width:100%;}
.mainBookList .bookLists .bookTitle{font-size:1.4rem;margin-top:20px;letter-spacing: -0.64px; font-weight:700;}
.mainBookList .bookLists .bookPrice{font-size:2.4rem;letter-spacing: -1.12px;color:#222;font-weight: bold;line-height:4.1rem;margin-top:5px}
.mainBookList .bookLists .bookPrice span{font-size:1.6rem;color:#ff0000;letter-spacing: -0.8px;padding-left:10px;}
.mainBookList .bookLists .bookPrice2{font-size:1.6rem;text-decoration:line-through;line-height:2.4rem;letter-spacing: -0.64px;color:#999}
.sales{color:#ff0000; margin-left:5px;}
/* S: 배너 풀 이미지 */
.fixedBanner2{position:fixed; right:20px; top:20px;}
/* E: 배너 풀 이미지 */

/* S: 반응형 */
@media (max-width:1200px) {
		.content{margin:0 !important; padding:0 !important}
		.inner{width:100%; padding:0 15px; box-sizing:border-box; display:block;}
       	.threeBanner img{width:100%;}
       	.smallBanner img{width:100%;}
	   	.fullBanner{width:calc(100% + 40px); margin-left:-20px;}
       	.profSlider .bx-controls{position: static;width:100%}
     	.tastingArea .top4Img{overflow:hidden;}
     	.wingToggle{display:inline-block; color:#fff; font-size:15px; font-weight:700; background:#00479c; box-sizing:border-box; width:80px; height:80px; padding:24px 12px; position:fixed; right:20px; bottom:100px; z-index:999; transition:0.3s ease; border-radius:50%; text-align:center; }
     	.wingToggle.on{right:120px;}
     	.wingBanner{height:860px; background:#fff; top:0; overflow-y:scroll; right:-110px; transition:0.3s ease; position:fixed;}
     	.wingBanner.on{right:0;}
     	.wingBanner::-webkit-scrollbar {display:none}
       	.mainTabContent ul{width:100%;margin:0 auto;}
       	.mainTabContent ul li{width:33.3333%;padding-bottom: 10px;}
       	.mainTabContent ul li:nth-child(odd){padding-right:2%}
       	.bookRolling{display:none !important}
       	.mainBookList .bookLists{width:100%;flex-wrap: wrap;}
		.mainBookList .bookLists li{width:23%;}
		.mainBookList .bookLists li .bookArea{width:auto;height:240px}
		.mainBookList .bookLists .bookTitle{font-size:1.4rem;}
		.mainBookList .bookLists .bookPrice{font-size:2.0rem;}
		.mainBookList .bookLists .bookPrice2{font-size:1.4rem;}
       	.mainBookList .bookLists li img{height:auto; }
	    #mainNotice{width:100%;}
       	#mainTab > ul{flex-wrap: wrap;}
       	#mainTab > ul li{margin:0px 10px 5px}
		.mainSlide{display:none}
       	/*.profSlider .bx-wrapper .bx-controls-direction a{top:-95px}*/
		.lectureArea{width:100%}
		.lectureArea .bx-wrapper .bx-pager{bottom:15px;top:initial !important;right: initial !important;width: 100%;}
		.lecturelol .owl-dots{position:inherit;}
		.openLectureArea li{overflow:hidden}
		.openLectureArea li span:nth-child(1) strong{font-size:1.8rem;letter-spacing: -0.96px;margin-top:3px}
		.openLectureArea li span:nth-child(2){display:inline-block;box-sizing: border-box;width: 80px;line-height:2.4rem;letter-spacing: -0.64px;color:#999;padding:0px 0px 0 10px;margin-top:16px;vertical-align: middle;font-weight: bold;} 
		.openLectureArea li span:nth-child(3){position:relative;display:inline-block;vertical-align: middle;padding:0px 0 0 10px;margin-top:16px;border-left:1px solid #bcbcbc;font-weight: bold;width: 60%;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
		.openLectureArea li span:nth-child(4){display:none;vertical-align: middle;font-size:1.2rem;color:#999;padding: 16px 0 0 5px;}
		.mainReViewContent p:nth-child(2){padding:10px 0 0;margin-bottom:10px}
		.mainReViewContent .starPoint{left:auto; right:15px; bottom:10px;}

       /* 스페셜패키지 슬라이드 */
       	.specialImg{height:280px;}
		.specialArea p{font-size:1.2rem;}
		.specialArea .swiper-slide p strong{font-size:1.4rem;}
		
		/* 강사진 슬라이드 */
		.profSlider .swiper-slide{width:40%;}
}
@media (max-width:992px) {
		
		#col-taste{margin-top:40px;}
		.prof .swiper-slide{width:80%;}
		.tastingArea{display:block;}
		.tastingArea .top4Img{display:block; width:100%;}
		.tastingArea ul{width:100%;}
		.tastingArea ul li strong{width:75%;font-size: 1.4rem;line-height:2;}
       	.tastingArea ul li p{width:75%;font-size: 1.4rem;line-height: 1.5rem;}
}
@media (max-width:768px) {
		.bw_box img{width:calc(100% - 20px); margin:0 10px;}
		#col-three{padding-right:0;}
		.threeBanner .swiper-slide{width:80%;}
		h2{font-size:1.8rem;}
		.mainContent{margin-top:20px;}
       	.flex{flex-direction: column;}
       	#sideBar{display:none}
       	#mainNotice{width:100%}
       	.mainTabContent ul li{width:50%;padding-bottom: 10px;}
       	#mainTab > ul li a{padding:5px 10px;font-size:1.2rem}
       	#mainNotice .mainNoticeTap li a{font-size:1rem}
       	.bookRolling{display:none !important}
       	.mainBookList .bookLists{width:100%}
       	.mainBookList .bookLists li{padding:15px 10px;width:49%;box-sizing: border-box;}
       	.mainBookList .bookLists li .bookArea{width:auto;height:200px}
       	.mainBookList .bookLists .bookTitle{font-size:1.3rem}
       	.mainBookList .bookLists .bookPrice{font-size:1.5rem}
       	.mainBookList .bookLists .bookPrice span{font-size:1.2rem}
       	.mainBookList .bookLists .bookPrice2{font-size:1.2rem;}
       	.mainBookList .bookLists li img{height:auto}
       	.specialArea{padding-bottom:30px}
       	.specialArea .swiper-slide{width:100%;}
       	.specialImg{height:200px;}
       	.prof .swiper-slide{width:80%;}
       	#row_5 .profBtn{width:40%; margin:20px 0; float:right; font-size:1.2rem; padding:12px;}
       	#row_5 .profNav{display:none;}
       	#row_5 .profTag{display:none;}
       	.profSlider .swiper-slide:hover p{padding:16px;}
       	.openLectureArea li span{font-size:1.4rem;letter-spacing: -0.48px;line-height:1;}
		.openLectureArea li span:nth-child(1) {padding:24px 12px;}
       	.openLectureArea li span:nth-child(1) strong{font-size:1.4rem;letter-spacing: -0.96px;margin-top:3px;}
       	/*.openLectureArea li span:nth-child(2){display:inline-block;box-sizing: border-box;width: 80px;letter-spacing: -0.64px;color:#999;padding:12px 0px 0 10px; margin-top:0px; }*/ 
       	.openLectureArea li span:nth-child(3){position:relative;display:inline-block;vertical-align: middle;padding:12px 0 0 10px;margin-top:4px;border:none;font-weight: bold; white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
       	/*.openLectureArea li span:nth-child(4){display:inline-block;float: right;vertical-align: middle;font-size:1rem;color:#999;padding: 14px 0 0 5px;}*/
		.openLectureArea li span:nth-child(2){display:none}
		.openLectureArea li span:nth-child(4){display:none}
		.mainReViewContent .starPoint em{ font-size:1.4rem;}
		.mainReViewContent .starPoint img{width:12px; margin-right:5px}
		.mainReViewContent p:nth-child(1){width:80%}
		.mainReViewContent p:nth-child(2){font-size:1.2rem; width:80%;padding:10px 0 0; line-height:1.5}
		.mainReViewContent .starPoint{bottom:17px}
		#mainNotice .mainNoticeContent li{font-size:1.4rem}
		.sales{font-size:1.2rem;}
		.profSlider2 .item img{ width:180px !important}
    	.bookArea{width: auto;
	    height: auto;
	    background: none;
	    overflow: hidden;
	    display: flex;
	    }
		.bookArea img{
			width: 100% !important;
		    align-self: flex-end;
		    margin: 0 auto;
		    box-shadow:none
		}
		.bx-wrapper img{width:100%}
		.mainBookList .bookLists li{width:100%}
		.profSlider2 .item img{width:50% !important;}
}
/* E: main CSS */