@charset "utf-8";
html,body{ font-size: 15px; word-break: keep-all; color: #313131} 
@media only screen and (max-width: 1023px){	
	html,body{ font-size: 14px;}
}
@media only screen and (max-width:767px){	
	html,body{ font-size: 13px; letter-spacing: 0}
}
/* 강좌 카드 */


.bt_detail, .bt_enroll { display:inline-block;  background:#fff; border-radius:3.5px; overflow:hidden; padding:0px 22px; white-space:nowrap; text-align:center; vertical-align:middle; border:solid 1px rgba(225,225,225); transition:all 0.2s ease !important; box-sizing: border-box;  color:rgb(29,29,29) !important; margin-right: 8px; font-size: 14px !important; background: none; border: none; margin: 0; color: #fff; padding: 10px 20px; background:#fff;color: #000;  box-shadow: 0 3px 0px #fece40; } 
.bt_enroll{box-shadow: 0 3px 0px rgba(0, 105, 217,1)} 
.bt_enroll:before, .bt_detail:before{ font-family: "remixicon"; font-style: normal; font-weight: normal; speak: none;  text-decoration: inherit; font-variant: normal;  text-transform: none; -webkit-font-smoothing: antialiased;  -moz-osx-font-smoothing: grayscale; content: "\EC5C"; vertical-align: top;  text-align: center; font-size: 20px; vertical-align: middle; padding-right: 5px} 
.bt_detail:before{ content:"\ECEF" } 
.bt_enroll:hover{ background: rgba(0, 105, 217,1); color: #fff !important;transition:all 0.2s ease;box-shadow: 0 3px 0px rgba(0,48,100,1.00) } 
.bt_detail:hover{ background:#fece40; color: #fff !important;transition:all 0.2s ease !important;box-shadow: 0 3px 0px #997017} 

ul.thumlist li div.txt{ height:40px; color: #6a737b; font-size: 13px; line-height: 1.3; width: 100%} 
ul.thumlist li div.txt > span + span{ position: relative; padding-left: 15px } 
ul.thumlist li div.txt > span + span:before{ position: absolute; left: 7px; top: 4px; width: 1px; height: 11px; background: #ddd; content: ""; display: block}


.thumlist .ico{ margin-bottom: 10px; text-align: left; width: 100%} 
.ico > span{display: inline-block;margin-bottom: 2px;margin-right: 4px;padding: 3px 12px;border-radius: 12px; font-size: 12px; color: #666; background: #f2f2f2}
.course-info header.course-profile .ico > span{ background: #fff} 

.courses-listing li div.txt{ display: none; }
.courses-listing .date{ display: none; }

.ico > span.ico_hot{ background: #D63B60}
.ico > span.ico_fin{ background: #4477be}
.ico > span.ico_short{ background: #d69c71}
.ico > span.ico_new{ background: #A2009C}
.ico > span.ico_class{ background: #008472}
.ico > span.ico_long{ background: #BB640E}
.ico > span.ico_mid{ background: #76601F}
.ico > span.ico_ing{ background: #fbdae7 !important; color:#f0689e }
.ico > span.ico_pre{ background: #fff2d4 !important; color:#ffa508 }

.ico > span.ico_keyword.card0{ background: #d8baa3 !important; color:#fff}
.ico > span.ico_keyword.card1{ background: #C7D6DB !important; color:#fff}
.ico > span.ico_keyword.card2{ background: #C6D2BE !important; color:#fff}
.ico > span.ico_keyword.card3{ background: #C0B8A2 !important; color:#fff}
.ico > span.ico_keyword.card4{ background: #83B1C9 !important; color:#fff}
.ico > span.ico_keyword.card5{ background: #d69c71 !important; color:#fff}

.ico > span.ico_keyword0{ background: #ffa508 !important; color:#fff}
.ico > span.ico_keyword1{ background: #4477be !important; color:#fff}
.ico > span.ico_keyword2{ background: #d69c71 !important; color:#fff}
.ico > span.ico_keyword3{ background: #A2009C !important; color:#fff}
.ico > span.ico_keyword4{ background: #008472 !important; color:#fff}
.ico > span.ico_keyword5{ background: #BB640E !important; color:#fff}




/* 강의 검색 */
.content-wrapper{ margin: 0; padding: 0; max-width: none} 
.find-courses{ padding-bottom: 0} 
.find-courses, .university-profile{ background: #fff} 
.find-courses .courses-container, .university-profile .courses-container {width: 100%;max-width: 1260px;margin: 0 auto;padding: 30px 0 0px 0;position: relative;}
h2.tit, .page-header h1{ text-align: center; display: block;width: 100%;font-weight: normal;font-size: 2rem;    line-height: 35px;color: #000;letter-spacing: -1px;    padding: 0px 0 20px; text-align: left; font-weight: 700 } 
.page-header{ width: 100%;max-width: 1260px;margin: 0 auto;padding: 40px 0 0 0;display: flex;flex-wrap: wrap; border-bottom: 0} 
.page-header h1{ border: none; max-width: none; margin-bottom: 0} 
/* .find-courses h2.tit{ margin-left: 280px; padding-left: 20px} */
.find-courses .wrapper-search-context{ position: relative; padding-bottom: 0; border-bottom: none} 
.find-courses .wrapper-search-context .wrapper-search-input{ position: absolute; right: 0; top: 0px; width: auto; float: none} 
.find-courses .discovery-input{ outline: none; box-shadow: none;background: none !important; font-weight: 400; font-size: 16px; height: 34px; padding: 5px 50px 5px 15px;border: 1px solid #cdd0db;color: #000;border-radius: 5px; } 
.find-courses .discovery-input:-internal-autofill-selected { background: #fff !important}
.find-courses .discovery-input:-webkit-autofill,.find-courses .discovery-input:-webkit-autofill:hover,.find-courses .discovery-input:-webkit-autofill:focus,.find-courses .discovery-input:-webkit-autofill:active {transition: background-color 5000s ease-in-out 0s; -webkit-transition: background-color 9999s ease-out;  }

.ui-accordion .ui-accordion-header .ui-icon{ display: none} 
/* 필터 */
.find-courses .filters{ margin-top: 0; border-top: 1px solid #EDEDED;position: relative; border-bottom:  1px solid #EDEDED;}
.find-courses .filters .filters-inner{ border: none; position: relative; } 
.find-courses .filters .fa-times:before{font-family: "remixicon"; font-style: normal; font-weight: normal; speak: none; display: inline-block;  text-decoration: inherit; text-align: center; font-variant: normal;  text-transform: none; -webkit-font-smoothing: antialiased;  -moz-osx-font-smoothing: grayscale; content: "\EB99"; font-size: 15px; vertical-align: middle; padding-left: 5px}
.find-courses .filters li{ margin: 0; background: none; font-weight: 400; font-size: 15px; padding: 5px 0} 
.find-courses .filters span.query{font-weight: 400; font-size: 14px; vertical-align: middle; color:#0069d9; word-break: keep-all}
.find-courses .filters .clear-filters{ font-size: 14px; color: #000 !important; border: 1px solid #000; font-weight: 400; margin: 0; line-height: 30px; padding: 0 15px; border-radius: 20px; background: #fff !important; position: absolute; left: 0; top: 11px} 
.find-courses .filters .clear-filters:before{font-family: "remixicon"; font-style: normal; font-weight: normal; speak: none; display: inline-block;  text-decoration: inherit; text-align: center; font-variant: normal;  text-transform: none; -webkit-font-smoothing: antialiased;  -moz-osx-font-smoothing: grayscale; content: "\F064"; vertical-align: middle; color: #999; padding-right: 5px} 
.find-courses .filters ul.active-filters{ padding: 10px 0 10px 100px; overflow: hidden; border: none} 
.find-courses .search-facets.phone-menu{width: 220px; box-shadow: none; margin-top: 0;  border-top:#191919 2px solid; background: #fff; padding: 0; margin:0px 60px 30px 0 } 
.find-courses .search-facets .header-search-facets, .find-courses .search-facets .header-facet{ border-top:1px solid #222; padding: 0; padding-top: 24px; color: #222; font-size: 15px; font-weight: 700; padding-bottom: 15px; margin-top: 24px }
.find-courses .search-facets .header-facet:first-of-type{ margin-top: 15px;border-top: 1px solid #222;} 
.find-courses .search-facets .header-search-facets{ margin-top: 0; padding-bottom: 0;padding-top: 16px; display: inline-block; border: none; font-size:  1.285rem } 
.find-courses .filters.is-collapsed{ border-top: none; }
.find-courses .search-facets.phone-menu{ margin-top: 0} 
.find-courses .filters.is-collapsed ~ .filter_crse_container .search-facets.phone-menu{ margin-top: 0} 
.find-courses .search-facets .search-status-label, .search-bar .search-status-label{ display: inline-block;padding-top: 16px; font-size: 14px} 
.find-courses .search-facets .search-status-label:before{ width: 1px; height: 10px; display: inline-block; background: #999; vertical-align: middle; margin: 0 10px; content: ""} 
.find-courses .search-facets .search-status-label strong, .search-bar .search-status-label strong{ color:#0069d9; padding-left: 8px} 
.find-courses .search-facets .header-search-facets:before{font-family: "remixicon"; font-style: normal; font-weight: normal; speak: none; display: inline-block;  text-decoration: inherit; text-align: center; font-variant: normal;  text-transform: none; -webkit-font-smoothing: antialiased;  -moz-osx-font-smoothing: grayscale;vertical-align: middle;content:"\ED23"; padding-right: 8px} 
.find-courses .search-facets .facet-option{ padding: 5px 40px 5px 30px; min-height: 30px; position: relative; white-space: normal; word-break: keep-all; font-weight: 400 !important; background: none !important; color: #3d3e3f !important}
.find-courses .search-facets .facet-option:before{font-family: "remixicon"; font-style: normal; font-weight: normal; speak: none; display: inline-block;  text-decoration: inherit; text-align: center; font-variant: normal;  text-transform: none; -webkit-font-smoothing: antialiased;  -moz-osx-font-smoothing: grayscale; content: "\EB7F"; position: absolute; left: 0; top:5px; width: 22px; height: 22px; font-size: 22px} 
.find-courses .search-facets .facet-option.selected{ background: none !important; color: #000 !important;font-weight: 500 !important;} 
.find-courses .search-facets .facet-option.selected:before{ content: "\EB82"; } 
.find-courses .search-facets .facet-list.collapse{ padding-bottom: 0} 
.find-courses .search-facets::before{ display: none} 
.find-courses .search-facets .facet-option:hover{ background: none; color: #000; font-weight: 500} 
.find-courses .search-facets .facet-option .count{ color: #3d3e3f !important;font-weight: 400 !important;}
.find-courses .search-facets .facet-option.selected .count{ color: #000 !important;font-weight: 400 !important;}
.find-courses .search-facets .facet-option.selected .count::before, .find-courses .search-facets .facet-option.selected:hover .count::before, .find-courses .search-facets .facet-option.selected:focus .count::before{font-family: "remixicon"; font-style: normal; font-weight: normal; speak: none; display: inline-block;  text-decoration: inherit; text-align: center; font-variant: normal;  text-transform: none; -webkit-font-smoothing: antialiased;  -moz-osx-font-smoothing: grayscale; content: "\EB99"; font-size: 15px; } 
.find-courses .search-facets .facet-list li{ height: auto; border: none} 
.find-courses .search-facets .facet-list{ border: none} 
.find-courses .discovery-submit .fa-search,.search-field-wrapper .fa-search{ background: none !important; width: 100%; height: 100%; display: block; line-height: 34px !important} 
.find-courses .discovery-submit,.search-field-wrapper .search-button, .search-field-wrapper .search-button:hover, .search-field-wrapper .search-button:focus{ color: #000;border: none; background:  none !important; outline: none; box-shadow: none; right: 0;display: block;position: absolute;top: 0;padding: 0 0px; border-radius: 0; padding-right: 0; width: 50px; margin: 0; height: 34px; line-height: 34px; text-align: center} 
.search-field-wrapper .search-button:hover, .find-courses .discovery-submit:hover{ color:#0069d9 !important; box-shadow: none !important} 

.wrapper-search-input .fa-search:before, .search-field-wrapper .fa-search:before{font-family: "remixicon"; font-style: normal; font-weight: normal; speak: none; display: inline-block;  text-decoration: inherit; text-align: center; font-variant: normal;  text-transform: none; -webkit-font-smoothing: antialiased;  -moz-osx-font-smoothing: grayscale; content:"\F0D1";font-size: 24px;}
.find-courses .courses-container .courses:not(.no-course-discovery) { position: relative} 
.find-courses .courses-container .courses:not(.no-course-discovery) .nodata{ position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%)}

form button.discovery-cancel.m-only,form button.discovery-delete.m-only{ display: none !important} 


/* 강좌 카드 */
.find-courses .courses-container .courses{ padding-top: 0} 
.courses-listing{flex-wrap: wrap;display: flex; max-width: 1260px } 
.courses-listing li .img{  overflow: hidden; margin-bottom: 20px;width: calc(100% + 30px);   padding-top: calc(100% / 60 * 40) !important;    position: relative;} 
.courses-listing li .img img{ width: 100%;position: absolute;  left: 0;  top: 0; height: 100%; } 
ul.courses-listing li{  display: block; padding: 0 !important; border: none; flex-basis: auto ; width: 25%;    flex-wrap: wrap; overflow: hidden; border-radius: 5px;  }
ul.courses-listing li:nth-of-type(4n+1){}
ul.courses-listing li div.box:hover{ box-shadow: 0 1rem 2rem rgb(0 0 0 / 18%); }
ul.courses-listing li div.box{margin: 0 20px ;padding: 0 15px 20px; display: block; flex-wrap: wrap; overflow: hidden; position: relative; margin-bottom: 10px ;background: #fff;border-radius: 5px; box-shadow:none;  border-radius: 5px;  overflow: hidden; border: 0; } 
ul.courses-listing li .img{ margin: 0px -15px 5px; border-radius: 15px; }
.courses-listing li .tit{ display: none; word-break: break-all; max-height: 60px; line-height: 1.5; font-size: 1.0666rem;margin-bottom: 7px; height:85px; overflow: hidden; font-weight:500; padding-top: 10px;overflow: hidden;text-overflow: ellipsis; -webkit-box-orient: vertical;word-wrap:break-word; -webkit-line-clamp:2; color: #6a737b; width: 100%; border-top: 1px solid #d5cfcf; text-align: left} 
.courses-listing li .make.tit{ display: -webkit-box; }
.courses-listing .ico{ margin-bottom: 10px; text-align: left; width: 100%} 
.courses-listing .ico > span{display: inline-block;margin-bottom: 2px;margin-right: 4px;padding: 3px 12px;font-size: 12px;border-radius: 12px; font-size: 12px; }

.courses-listing .ico.basic{ display: none; }
.courses-listing .ico.make{ display: block; margin-top: 16px; padding-bottom: 8px; overflow: hidden; max-height: 27px; }
.courses-listing .ico.make span{ border-radius: 5px;}

.courses-listing li div.box{margin: 0 20px ;padding: 0 15px 20px; display: flex; flex-wrap: wrap; overflow: hidden; position: relative; margin-bottom: 10px ;background: #fff;border-radius: 5px; box-shadow:none;  border-radius: 5px;  overflow: hidden; transition-duration: .3s; transition-timing-function: ease-in-out; border: 1px solid #000000; } 
.courses-listing li div.box:hover{ transform: translate3d(0,-1.6rem,0); }

.courses-listing li div.txt{ height:40px; color: #6a737b; font-size: 13px; line-height: 1.3; width: 100%; text-align: left} 
.courses-listing li div.txt > span + span{ position: relative; padding-left: 15px } 
.courses-listing li div.txt > span + span:before{ position: absolute; left: 7px; top: 4px; width: 1px; height: 11px; background: #ddd; content: ""; display: block}


.courses-listing .type{  color: #0069d9; letter-spacing: 1px; position: absolute; right: 20px; top: 100px; background: #444;  color: #fff; border-radius: 16px; border: 1px solid #000; padding: 4px 12px; font-size: 12px; } 
.courses-listing .type2{ position: absolute;  top: 100px;  left: 10px; } 
.courses-listing .type2 .ico_ing, .courses-listing .type2 .ico_end{ display: inline-block; width: 60px; height: 60px; border-radius: 100%; text-align: center; line-height: 60px; background:#f0689e; color: #fff; }
.courses-listing .type2 .ico_end{ background: #777} 
.courses-listing .btn{  width: 100%; position: absolute; left: 0; top:0;  padding:8px 0; font-size: 0; text-align: center; transition: all .3s; opacity: 0 ; height: 100%; background: rgba(0,0,0,0.75); cursor: auto !important} 
.courses-listing .btn p{ position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 90%; text-align: center} 
.courses-listing .btn a{ margin: 8px 5px ; } 
.courses-listing li.focusing .btn{opacity: 1;}
.courses-listing li:hover .btn{ display: none; }
.courses-listing .date{ width: 100%; margin-bottom:5px; color:#6a737b; text-align: left;font-size: 13px}
.courses p a:not(.btn):hover, .courses p a:not(.btn):focus, .courses p a:visited:not(.btn):hover, .courses p a:visited:not(.btn):focus{ text-decoration: none} 


.find-courses .courses-container .courses:not(.no-course-discovery), .university-profile .courses-container .courses:not(.no-course-discovery){  margin-right: 0; width: calc(100% - 280px);} 
.find-courses .courses-container .courses .courses-listing{ margin-left: -20px; width: calc(100% + 40px)}



.find-courses .courses-container .courses:not(.no-course-discovery) .courses-listing .courses-listing-item, .university-profile .courses-container .courses:not(.no-course-discovery) .courses-listing .courses-listing-item{ width: 33.333%; margin: 0; max-height: none; margin-bottom: 20px; overflow: unset} 
.sortTypeWrap{ padding: 15px 0 20px 0px; font-size: 15px} 
.sortTypeWrap button{ font-size: 13px; color: #767676;padding-left: 18px;    line-height: 22px; position: relative; margin-right: 15px; vertical-align: middle; background:  #fff !important} 
.sortTypeWrap button:before{content: '';display: block;position: absolute;left: 5px;top: 10px;width: 4px;height: 4px;border-radius: 50%;   background: #D4D4D8;}
.sortTypeWrap button.on{ color: #191919} 
.sortTypeWrap button.on:before{font-family: "remixicon"; font-style: normal; font-weight: normal; speak: none; display: inline-block;  text-decoration: inherit; text-align: center; font-variant: normal;  text-transform: none; -webkit-font-smoothing: antialiased;  -moz-osx-font-smoothing: grayscale;vertical-align: middle;content:"\EB7B"; width: auto; height: 22px; background: none; border-radius: 0; color: #0069d9; top: 0 ; left: 0; font-weight: bold} 
.m-only{ display: none} 
.find-courses .courses-container .filter_crse_container{ display: flex; flex-direction:row-reverse; clear: both; float: none; width: 100%; } 
.find-courses .courses-container .filter_crse_container .category_info{ display:none; margin: 5px; padding: 5px 12px; border: 1px solid #0f2f6ab0; border-radius: 10px; }
.find-courses .loading-spinner{ background: #fff; top: 0; right: 0; width: 50px; text-align: center; height: 34px; } 



@media only screen and (max-width: 1310px){	
	.courses-listing .btn p{ max-width: 200px; white-space: normal; text-align: center} 
	.find-courses{ padding: 0 20px} 
	/*.find-courses .filters{width: calc(100% - 270px);}*/
	/*.find-courses .courses-container .courses:not(.no-course-discovery), .university-profile .courses-container .courses:not(.no-course-discovery){width: calc(100% - 250px);}*/
}
@media only screen and (max-width: 1023px){		
	.find-courses .search-facets.phone-menu{ position: fixed; right: -200%; top: 0; display: block; left: auto; transition: .3s; -webkit-overflow-scrolling: touch; height: 100%} 
	.find-courses .search-facets.active{ right: 0; border: none; z-index: 999; transition: .3s; margin: 0} 
	.find-courses .search-facets.active .overlay{z-index: 80} 
	.find-courses .search-facets.active .search-facets-lists{ z-index: 99; position: relative;background: #fff; height: 100%; overflow: hidden; overflow-y: auto} 
	.find-courses .search-facets.active .m-only{ display: block; text-align: center; position:sticky; bottom: 0px; width:220px; background: #fff; z-index: 12; padding: 0 0 calc(constant(safe-area-inset-bottom) + 15px) 0;} 
	.find-courses .search-facets .search-status-label,.find-courses .search-facets .header-search-facets{ display: none} 
	.find-courses .filters, .find-courses .courses-container .courses:not(.no-course-discovery), .university-profile .courses-container .courses:not(.no-course-discovery){ width: 100%; float: none} 
	.find-courses .courses-container, .university-profile .courses-container{ } 
	.find-courses .courses-container{ padding-bottom: 0} 	
	.find-courses .courses-container .courses .courses-listing{ margin-right:0; width: calc(100% + 40px); margin-left: -20px}
	.sortTypeWrap{ padding-left: 0; position: relative} 
	.sortTypeWrap button.btnFilter.m-only{ position: absolute; right: 0; top: 0; display: block !important; padding: 0; margin: 0; line-height: 54px} 
	.sortTypeWrap button.btnFilter.m-only:before{font-family: "remixicon"; font-style: normal; font-weight: normal; speak: none; display: inline-block;  text-decoration: inherit; text-align: center; font-variant: normal;  text-transform: none; -webkit-font-smoothing: antialiased;  -moz-osx-font-smoothing: grayscale;vertical-align: middle;content:"\ED23"; position: relative; left: auto; top: auto; width:auto; height: 50px; background: none; border-radius: 0; line-height: 50px; color: #000; font-size: 1.466rem; padding-right: 5px  } 
	ul.courses-listing li .btn, ul.courses-listing li .btn p, ul.courses-listing li .btn .bt_detail{  width: 100% !important; height: 100% !important; position: absolute; left: 0 !important; top: 0 !important; transform: none !important; opacity: 1 !important; background: none !important; border-radius: 0 !important; font-size: 0 !important; line-height: 0; text-indent: -999999px; overflow: hidden; box-shadow: none !important; transition: none; margin: 0 !important; padding: 0 !important} 
	ul.courses-listing li .btn .bt_enroll, ul.courses-listing li .btn .bt_detail:before{ display: none !important} 
	ul.courses-listing li .btn{ margin-left: 0px; padding: 0 !important;} 
	.find-courses .search-facets .header-facet{ padding-left: 10px; border-color: #bbb}
	.find-courses .search-facets .header-facet:first-of-type{ margin-top: 40px;} 
	.find-courses .search-facets .facet-list{ padding-left: 10px;} 
	.find-courses .search-facets .facet-list:last-of-type{ padding-bottom: 160px} 
	
	.find-courses .search-facets.active .close_bx.m-only{position: fixed; right: 0; top: 0; background: #fff; width:220px; height: 50px; text-align: right; z-index: 101; border-bottom: 1px solid #222 }
	.find-courses .search-facets.active .bt_close{  width: 40px; height: 50px; background: none !important; } 
	.find-courses .search-facets.active .bt_close:before{font-family: "remixicon"; font-style: normal; font-weight: normal; speak: none; display: inline-block;  text-decoration: inherit; text-align: center; font-variant: normal;  text-transform: none; -webkit-font-smoothing: antialiased;  -moz-osx-font-smoothing: grayscale; content: "\EB99"; font-size: 22px; color: #000} 
	.find-courses .search-facets.active .bt_reset,.find-courses .search-facets.active .bt_apply{ height: 45px; width: 90px; border-radius: 25px; border: 2px solid #1a1a1a; margin: 20px 3px 20px 3px; box-shadow: none !important; background: #fff !important  } 
	.find-courses .search-facets.active .bt_apply{ background: #1a1a1a !important; color: #fff} 
	.find-courses .courses-container .courses:not(.no-course-discovery) .nodata{ position: relative; left: auto; top: auto; transform: none; text-align: center; padding: 50PX 0} 
	.find-courses .filters{ max-height: none} 
	.courses-listing .btn p{ max-width: none} 
	.courses-listing li .tit{height:78px;} 
}
@media only screen and (max-width:767px){
	h2.tit{ margin-bottom: 20px; }	
	.find-courses .courses-container, .university-profile .courses-container { padding-top: 30px} 
	.courses-listing li .tit{ font-size: 14px !important;    height: 73px} 	
	ul.courses-listing li{ height: auto; width: 50% !important;}
	ul.courses-listing li .img{  border-bottom: none !important}
	ul.courses-listing li div.box{ margin-bottom: 10px} 
	
	ul.courses-listing li .btn .bt_detail{} 
	.find-courses .wrapper-search-context .wrapper-search-input{ z-index: auto; top: -5px} 
	.mobile .find-courses .discovery-input, .mobile .find-courses .discovery-submit{ display: none}
	.mobile .find-courses label.sr{clip: auto;position: relative;margin: -1px;height: 48px;width: 50px;border: 0;padding: 0;overflow: hidden; margin: 0; clip-path: none; font-size: 0; line-height: 0}
	.mobile .find-courses label.sr:before{font-family: "remixicon"; font-style: normal; font-weight: normal; speak: none; display: inline-block;  text-decoration: inherit; text-align: center; font-variant: normal;  text-transform: none; -webkit-font-smoothing: antialiased;  -moz-osx-font-smoothing: grayscale; content:"\F0D1"; font-size: 20px; line-height: 45px; text-align: center; width: 100%; height: 100%; display: block; color: #999} 
	.wrapper-search-input.active{ background: #fff; width: 100%; position: absolute; left: 0; top: 0;} 
	.mobile .find-courses .wrapper-search-input.active .discovery-input, .mobile .find-courses .wrapper-search-input.active .discovery-submit{ display: inline-block; float: left}
	.mobile .find-courses .wrapper-search-input.active{ border: 2px solid #000; z-index: 2} 
	.mobile .find-courses .wrapper-search-input.active label.sr{float: left } 
	.mobile .find-courses .wrapper-search-input.active .discovery-input{ width: calc(100% - 110px); margin-top: 8px; border: none !important } 
	h2.tit{ padding-bottom: 10px; font-size: 26px} 
	.mobile .find-courses .wrapper-search-input.active label.sr:before{  line-height: 50px } 
	.mobile .find-courses .wrapper-search-input.active .discovery-submit{ padding: 0; margin-top: 1px; display: none } 
	.mobile .find-courses .discovery-cancel{ display: none} 
	.mobile .find-courses .wrapper-search-input.active .discovery-cancel, 	.mobile .find-courses .wrapper-search-input.active .discovery-delete{ display: inline-block;position: absolute;    top: 0; right: 0; line-height: 48px; padding: 0; background: none!important; border: none !important; border-left: 1px solid #000 !important; padding: 0 15px; font-weight: 400; font-size: 14px; border-radius: 0 !important; box-shadow: none !important; display: block !important; color: #313131} 
	.mobile .find-courses .active label.sr{ } 
	.mobile .find-courses .wrapper-search-input.active .discovery-delete{ right: 60px; border: none !important} 
	.mobile .find-courses .wrapper-search-input.active .discovery-delete:before{font-family: "remixicon"; font-style: normal; font-weight: normal; speak: none; display: inline-block;  text-decoration: inherit; text-align: center; font-variant: normal;  text-transform: none; -webkit-font-smoothing: antialiased;  -moz-osx-font-smoothing: grayscale;  font-size: 20px;  text-align: center; width: 100%; height: 100%; display: block; color: #999;content:"\EB97"; line-height: 50px}
	.courses-listing li div.txt{	height: 30px;font-size: 0.925rem;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;word-break: keep-all;}
	.find-courses .courses-container .courses .courses-listing .courses-listing-item{} 
	
    .mobile .find-courses .sortTypeWrap .wrapper-search-input.active{ border: none; z-index: auto; position: unset    } 
    
	
}
@media only screen and (max-width:500px){		
	.courses-listing .ico.make{ max-height: 25px; }
	ul.courses-listing li .img{ width: calc(100% + 15px); margin: 0px -10px 5px -10px; border-radius: 15px; max-height: 40px;}
	ul.courses-listing li .img img{width: 100% !important;}
	.courses-listing .type{ right: 15px !important; padding: 5px !important; top: 70px !important} 
	.courses-listing .type2{ top:10px !important; left: 10px !important}	
	.courses-listing li .tit{ font-size: 13px !important;    -webkit-line-clamp: 4; height: 80px !important; padding-top: 0 !important; line-height: 1.56; max-height: 40px; } 
	ul.courses-listing li div.box{ margin: 0 5px 20px 10px; padding: 0 10px 20px 10px	}
	ul.courses-listing li:nth-of-type(2n) div.box{ margin: 0 10px 10px 5px	}
	.courses-listing .ico > span{ } 
	.courses-listing .date{ font-size: 10.5px !important; word-break: break-all; white-space: normal; margin-top: 3px; letter-spacing: -0.195px} 
	.find-courses .courses-container .courses .courses-listing{ margin-right:0; width: calc(100% + 20px); margin-left: -10px; padding-bottom: 20px}
	.courses-listing .ico > span{ padding: 3px 6px !important;margin-right: 2px !important; font-size:0.9rem; letter-spacing: -0.5px} 
	.courses-listing .ico > span:last-of-type{ margin-right: 0} 
	.find-courses .courses-container .courses .courses-listing .courses-listing-item{ margin-bottom: 0 !important} 
}

@media only screen and (max-width:340px){	
	.courses-listing .date{ letter-spacing: -0.5px} 
}



/* 강좌상세 */
.course-info .container{ padding-bottom:  0} 
.content-wrapper header:before{ display: none} 
.course-info header.course-profile{ background:#f3f4f9; box-shadow: none; padding: 0; border-bottom: none} 
.course-info header.course-profile .intro-inner-wrapper{width: 100%;  max-width: 1260px;margin: 0 auto;padding: 30px 0;position: relative; box-shadow: none; border: 0; background: none} 
.course-info header.course-profile .intro-inner-wrapper .intro{ padding:0 0 0 60px; vertical-align: top; display: table-cell; position: relative; width: 68.23843%; z-index: 2} 
.course-info header.course-profile .intro-inner-wrapper .intro>.heading-group{ padding-bottom: 20px;width: 100%;box-shadow: none; border: none; margin-bottom: 0} 
.course-info header.course-profile .intro-inner-wrapper .intro>.heading-group h1{color: #313131;display: inline-block;margin: 0;letter-spacing: 0;text-align: left;text-shadow: 0 1px rgb(255 255 255 / 60%); font-weight: 500; font-size: 24px} 
.important-dates{ font-size: 15px; margin-bottom: 30px} 
.important-dates-item-title{ font-weight: 500; width: 200px; color: #313131}
.important-dates-item.short_description{ padding-bottom: 25px; }
.important-dates li{ overflow: hidden; display: table; width: 100%; padding:5px 0;} 
.important-dates li .important-dates-item-title, .important-dates li .important-dates-item-text{ display: table-cell}
.course-info header.course-profile .intro-inner-wrapper .intro .main-cta{ clear: both; float: none; margin: 0; overflow: hidden; width: 50%; display: inline-block; vertical-align: top} 
.course-info header.course-profile .intro-inner-wrapper .intro  .register{ float: none !important; margin: 0 !important; display: inline-block !important; text-shadow: none !important; height: 56px !important; line-height: 56px !important; padding: 0 !important; font-size:  1.285rem !important; font-weight: 500 !important; letter-spacing: 0 !important; border: none !important; width: 100% !important; background:rgb(0,105, 217) !important; color: #fff !important; box-shadow: none !important; text-align: center}
.course-info header.course-profile .intro-inner-wrapper .intro  .register.study{ background: #fece40 !important}
.course-info header.course-profile .intro-inner-wrapper .intro  .register.end{ background: #6B6B6B !important; color: rgba(255,255,255,0.5) !important} 
.course-profile .social-sharing{display: block; vertical-align: top; margin-right: 20px; text-align: center; margin-top: 30px  } 
.course-profile .social-sharing .sharing-message{ display: none} 
.course-profile .social-sharing a{ display: inline-block;  width: 50px; height: 50px; border: 1px solid #6a737b; text-align: center; border-radius: 100%; margin: 0 5px} 
.course-profile .social-sharing a span.icon:before{ display: block; width: 100%; height: 100%;font-family: "remixicon"; font-style: normal; font-weight: normal; speak: none; display: inline-block;  text-decoration: inherit; text-align: center; font-variant: normal;  text-transform: none; -webkit-font-smoothing: antialiased;  -moz-osx-font-smoothing: grayscale;vertical-align: middle;content:"\F23A"; line-height: 48px; font-size: 24px; color: #6a737b; background-image: none !important }
.course-profile .social-sharing a span.icon.fa-thumbs-up:before{content:"\ECBC"; }  
.course-profile .social-sharing a span.icon.fa-envelope:before{content:"\EEFB"; } 
.course-info header.course-profile .intro-inner-wrapper .media .hero .play-intro{ border-radius: 100%;background-image: linear-gradient(-90deg, rgba(0,0,0,0.65), rgba(0,0,0,0.75));box-shadow: 0 1px 12px 0 rgb(0 0 0 / 40%);border: 2px solid rgba(255,255,255,0.8);height: 80px;left: 50%;margin-top: -40px;margin-left: -40px;position: absolute;top: 50%;width: 80px;} 
.course-info .details{ width: 100%; font-size: 1rem; line-height: 1.6; margin: 0; box-shadow: none; border: none; padding-bottom: 30px} 
.course-info .details h2{padding: 20px 0 15px;font-size: 1.466rem;line-height: 1;letter-spacing: 0.5px;color: #2d2f39;padding-top: 30px;border-bottom: 2px solid #191919; margin-bottom: 20px; font-weight: 400; margin-top: 0; font-weight: 700} 
.course-info .details section:first-of-type h2{ padding-top:0px; margin-top: 0}
.course-info .details .accordion dt{ color: #313131 !important; font-size: 20px; text-align: left; margin: 0 0 15px 0; padding:15px 0 0px 0; border: none; border-top: 1px solid #ddd; font-weight: 700; background: #fff !important} 
.course-info .details .accordion dt:before{font-family: "remixicon"; font-style: normal; font-weight: normal; speak: none; display: inline-block;  text-decoration: inherit; text-align: center; font-variant: normal;  text-transform: none; -webkit-font-smoothing: antialiased;  -moz-osx-font-smoothing: grayscale;vertical-align: middle;content:"\EA4D"; padding-right: 5px } 
.course-info .details .accordion dt.ui-accordion-header-active{} 
.course-info .details .accordion dt.ui-accordion-header-active:before{content:"\EA77";}
.course-info .details .accordion dt:first-of-type{  border-top: 0; padding-top: 0}
.course-info .details .accordion dd{ font-size:14px; line-height: 1.6; padding: 0; border: none !important; box-shadow: none; padding: 0 20px 20px 20px; width: 100% !important} 
.course-info .details .accordion .ui-icon{ display: none} 
.course-info .inner-wrapper > div{ padding: 0} 
.course-info header.course-profile .intro-inner-wrapper>div.table{ margin-bottom: 0; display: table; width: 100%} 
.course-info header.course-profile .intro-inner-wrapper .media{background: transparent;box-sizing: border-box;display: table-cell;padding:0;position: relative;width: 31.76157%;z-index: 2;} 
.course-info header.course-profile .intro-inner-wrapper .media .hero{height: 100%;overflow: hidden;position: relative;border: 0;padding: 5px;   background: #fff;} 
.course-info header.course-profile .intro-inner-wrapper .media .hero img{display: block;width: 100%;} 
.course-info header.course-profile .intro-inner-wrapper .media .hero .play-intro::after {color: rgba(255,255,255,0.8);content: "\25B6";display: block;font: normal 2em/1em "Open Sans","Helvetica Neue",Helvetica,Arial,sans-serif;    left: 50%;
margin-left: -11px;margin-top: -16px;position: absolute;text-shadow: 0 -1px rgb(0 0 0 / 80%);top: 50%;}
.course-info .details .inner-wrapper .course-staff .teacher{ } 
.course-info .details p{ margin-bottom: 10px; word-break: break-all} 
.teacher .teacher-image{background: #fff;border: 1px solid #c8c8c8;height: 115px;float: left;margin: 0 15px 0 0;overflow: hidden;padding: 1px;width: 115px;} 
.teacher .teacher-image img{display: block;min-height: 100%;max-width: 100%;} 
.course-info .course-staff .teacher{ margin-bottom:30px} 
.course-info .course-staff .teacher h3{color: #313131;font-weight: 700;margin-bottom: 15px;text-transform: none; font-size:1.2rem !important; min-height: inherit }
.course-info .details .inner-wrapper .course-staff .teacher:after, .course-info .details .entitlement-unenrollment-modal .entitlement-unenrollment-modal-inner-wrapper .course-staff .teacher:after, .entitlement-unenrollment-modal .course-info .details .entitlement-unenrollment-modal-inner-wrapper .course-staff .teacher:after{ content: ""; display: table; clear: both} 



 .CourseSyllabus .block-tree .section ol.outline-item{ width:  auto !important; top: auto !important; border: none  !important; overflow: hidden; padding: 0; margin: 0} 
 .CourseSyllabus .block-tree .outline-button,   .CourseSyllabus .block-tree .section .section-name{display: block;padding: 10px 0 10px 2px;
border: none;text-align: left;margin: 0;background: none;cursor: pointer; padding: 15px 0; width: 100%;box-shadow: none; overflow: hidden} 

  .CourseSyllabus .block-tree .section .section-name .section-title{ font-size: 1rem; font-weight: 700;color: #313131 !important;margin: 0;    display: block;padding-left:25px; min-height: inherit} 
  .CourseSyllabus .block-tree li .fa-chevron-right{ font-size: 1rem !important; display: none} 
  .CourseSyllabus .block-tree > li > .outline-button:before,  .CourseSyllabus  .block-tree .section .section-name:before,.fa-edit:before, .fa-pencil-square-o:before,  .CourseSyllabus .block-tree > li > .outline-button[aria-expanded="false"]:before {font-family: "remixicon"; font-style: normal; font-weight: normal; speak: none; display: inline-block;  text-decoration: inherit; text-align: center; font-variant: normal;  text-transform: none; -webkit-font-smoothing: antialiased;  -moz-osx-font-smoothing: grayscale;vertical-align: middle;content:"\EA4D"; padding-right: 5px; color: #313131; font-size: 1rem !important } 
  .CourseSyllabus .block-tree > li > .outline-button.ui-state-active:before,   .CourseSyllabus .block-tree > li > .outline-button[aria-expanded="true"]:before { content: "\EA77"}
 .CourseSyllabus .fa-edit:before,  .CourseSyllabus .fa-pencil-square-o:before{ content:"\EC80" } 
 .CourseSyllabus .fa-chevron-right.fa-rotate-90{ transform: rotate(180deg)} 

 .CourseSyllabus  > .block-tree{ float: none; clear: both; border-top: 1px solid #e7e7e7} 

#expand-collapse-outline-all-button{ margin-bottom: 20px;padding: 10px 10px; border-radius: 5px;background-color: #fff;color: #6a737b;border: 1px solid #6a737b; font-size: 13px; min-width: 124px} 
#expand-collapse-outline-all-button span:before{font-family: "remixicon"; font-style: normal; font-weight: normal; speak: none; display: inline-block;  text-decoration: inherit; text-align: center; font-variant: normal;  text-transform: none; -webkit-font-smoothing: antialiased;  -moz-osx-font-smoothing: grayscale;vertical-align: middle;content:"\EA4D"; padding-right: 5px; color: #313131; font-size: 1rem !important} 
#expand-collapse-outline-all-button span.expand-collapse-outline-all-extra-padding:before{ content: "\EA77"} 
 .CourseSyllabus .block-tree .section ol.outline-item .subsection .subsection-title{ font-size: 1rem; font-weight: 400; display: inline} 
 .CourseSyllabus .block-tree .section ol.outline-item .subsection{list-style-type: none;  border-top: 1px solid #e7e7e7;margin: 0 0 0 35px;}
.CourseSyllabus .block-tree > li > .outline-button:before, .CourseSyllabus .block-tree .section .section-name:before,  .CourseSyllabus .block-tree > li > .outline-button[aria-expanded="false"]:before{ position: absolute; left: 0; top: 18px}

 .CourseSyllabus .block-tree .section ol.outline-item .subsection .subsection-text .details{ font-size: 14px; color: #555; padding-left: 25px; padding-bottom: 0} 
 .CourseSyllabus .block-tree .section ol.outline-item .subsection.current a h4,   .CourseSyllabus .block-tree .section ol.outline-item .subsection.current a .fa:before{ color: #0069d9} 
.CourseSyllabus .block-tree .section ol.outline-item .subsection.current a h4{ display: inline; margin: 0} 
.CourseSyllabus .block-tree .section{margin: 0 ;padding: 0;border-bottom: 1px solid #e7e7e7;}

.course-info .details .inner-wrapper .course-staff .teacher:last-of-type{ margin-bottom: 0} 
.main-cta.m_only{ display: none} 
@media only screen and (max-width: 1310px){	
	.course-info{ padding: 0 !important} 
	.course-info header.course-profile, .course-info .details{ padding: 0 20px} 
	.course-info .container{ padding:30px 0} 
}

@media only screen and (max-width: 1023px){	
	.course-info header.course-profile .intro-inner-wrapper .media{ width: 40%} 
	.course-info header.course-profile .intro-inner-wrapper .intro{ padding: 0 0 0 40px} 
	.important-dates-item-title{ width: 120px} 
	.important-dates li{ padding: 0; padding-bottom: 10px} 
	.course-profile .social-sharing a{ width: 45px; height: 45px} 
	.course-profile .social-sharing a span.icon:before{ line-height: 45px; font-size: 22px} 
	.course-info header.course-profile .intro-inner-wrapper .intro .main-cta a.register{height: 45px !important; line-height: 45px !important} 
	.content-wrapper.leclist_container{} 
	.main-cta.m_only.fixed{ position: sticky; bottom: 0px; left: 0; display: block; z-index: 3; padding: 20px; background: #fff} 
	
	.main-cta.m_only .register{ float: none !important; margin: 0 !important; display: inline-block !important; text-shadow: none !important; height: 56px !important; line-height: 56px !important; padding: 0 !important; font-size:  1.285rem !important; font-weight: 500 !important; letter-spacing: 0 !important; border: none !important; width: 100% !important; background:rgb(0,105, 217) !important; color: #fff !important; box-shadow: none !important; text-align: center;height: 45px !important;
    line-height: 45px !important;}
	.main-cta.m_only .register.study{ background: #fece40 !important}
	.main-cta.m_only .register.end{ background: #6B6B6B !important; color: rgba(255,255,255,0.5) !important} 
	
	
	
	
}

@media only screen and (max-width:767px){	
.course-info header.course-profile .intro-inner-wrapper .media, .course-info header.course-profile .intro-inner-wrapper .intro{ width: 100%; display: block} 
	.course-info header.course-profile .intro-inner-wrapper .intro{ padding: 30px 0 0 0} 
	.course-info header.course-profile .intro-inner-wrapper .intro>.heading-group h1{ font-size: 20px} 
	.course-profile .social-sharing{ display: none} 
	.course-info header.course-profile .intro-inner-wrapper .intro .main-cta{ width: 100%} 
	.course-info .details h2{ font-size: 1.2rem } 
	.course-info .details section:first-of-type h2{ padding-top: 0} 
	.important-dates{ font-size: 1.02rem} 
	.important-dates-item-title{ width: 100px} 
	.course-outline .block-tree .section ol.outline-item .subsection{ margin-left: 20px} 
    .inner-wrapper {position: relative;width: 100%; height: auto;}
    .inner-wrapper iframe {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
    .modal.video-modal, .video-modal.leanModal_box {width: 100%; max-width: 500px}
    .modal.video-modal .inner-wrapper, .video-modal.leanModal_box .inner-wrapper {width: 100%;}
}

.course-info .safari-wrapper { padding-bottom: 0px; }