@charset "utf-8";
/* CSS Document */

.clearfix:before, .clearfix:after {
        display: block; 
        content: ' '; 
        line-height: 0;
}
.clearfix:after {
        clear: both;
}
.clearfix{
        *zoom:1;
}
.cont_box{
    width:1200px;
    margin:0 auto;
}
.cont_box h1{
    font-size: 50px;
    font-family:'Noto Sans KR','Nanum Barun Gothic','나눔바른고딕',sans-serif;
    text-align:center;
    letter-spacing:-2px;
    margin-bottom:35px;
    margin-top:50px;
}
.lectureIntro_cont{
	position:relative;
	height:666px;
}

.teacherD_cont{
	width:1200px;
	margin:0 auto;
	height:666px;
	overflow:hidden;
    font-family:'Noto Sans KR';
    color:white;
}
.teacherD_cont .box{
    position: relative;
}
.teacherD_cont .box .mov{
    position: absolute;
    bottom:115px;
    right:78px;
}
/*---------------- 페이지가 있는 섹션 타이틀 -------------------*/
.best_wrapper .teacherD_title{
    font-family:'Noto Sans KR','Nanum Barun Gothic','나눔바른고딕',sans-serif;
    font-size:22px;
    letter-spacing: -0.5px;
    text-align: left;
    display: inline-block;
}
.best_wrapper{
    padding:50px 60px;
}
.best_wrapper > div{
    float:left;
    width:47%;
}
.best_wrapper .left{
    margin-right:50px;
}
.best_wrapper .page_num_title{
    position:relative;
    padding-bottom:5px;
    width:100%;
    border-bottom:1px solid #c2c2c2;
    margin-bottom:20px;
}
.best_wrapper .bx-wrapper .bx-controls{
    position:absolute;
    top:-47px;
    right:0;
}
.best_wrapper .bx-controls .bx-controls-direction{
    display: none;
}
.best_wrapper .bx-controls .bx-pager-item{
    float:left;
    display: inline-block;
    margin: 0 0 0 4px;
}
.best_wrapper .bx-controls .bx-pager-item a{
    display: block;
    width: 9px;
    height: 9px;
    border: 1px solid #ccc;
    text-indent: -9999em;
    overflow: hidden;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    background-color: #fff;
}
.best_wrapper .bx-controls .bx-pager-item a.active{
    background-color:#2551b4;
    border-color:#2551b4;
}
/*---------------- normal 섹션 타이틀 -------------------*/
.section_title{
    position:relative;
    padding-bottom:5px;
    width:100%;
    border-bottom:1px solid #c2c2c2;
    margin-bottom:20px;
}
/*---------------- vertical 섹션 타이틀 -------------------*/
h2.title{
    font-family:'Noto Sans KR','Nanum Barun Gothic','나눔바른고딕',sans-serif;
    font-size:22px;
    letter-spacing: -1.5px;
    text-align: left;
    display: inline-block;
    padding-left:15px;
    margin-bottom:15px;
    border-left:2px solid #5887f5;
    line-height:20px;
}
/*---------------- vertical 섹션 서브타이틀 -------------------*/
p.sub_title{
    font-family:'Noto Sans KR','Nanum Barun Gothic','나눔바른고딕',sans-serif;
    font-size:18px;
    letter-spacing: -1.5px;
    font-weight: 300;
    line-height:23px;
    padding-left:17px;
}
/*---------------- BEST 추천강의 style -------------------*/
.best_thumb{
    width:209px;
    position:relative;
    margin-right:15px;
}
.best_thumb img{
    width:209px;
}
.best_thumb .txt-rec{
    position: absolute;
    z-index: 9;
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    text-align: center;
    display: inline-block;
    width: 65px;
    padding: 9px 0;
    background-color: #e9463f;
}
.best_info_cont > div{
    float:left;
}
.best_detail{
    width:270px;
}
.best_detail p{
    font-size:11px;
    color:#8e8e8c;
    letter-spacing: -.5px;
    line-height: 16px;
    margin-bottom:6px;
}
.best_detail p strong{
    color:black;
    font-weight: bold;
    padding-right:10px;
}
.best_detail .subject{
    font-size:14px;
    color:black;
    font-weight: bold;
    margin-bottom:8px;
}
.best_detail .lec_label{
    margin-bottom:3px; margin-right:3px;
}
.best_detail .subject span{
    color:#fe251c;
    padding-left:5px;
}
.best_detail .describe{
    word-break: keep-all;
    margin-bottom:12px;   
}
.best_detail .term_info{
    width:80px;
    display: inline-block;
    padding-right:12px;
    border-right:1px solid #eaeaea;
}
.best_detail .lesson_info{
    display: inline-block;
    width:88px;
    padding-left:12px;
}
.best_detail .btn_area .btn_best{
    width:39%;
    border-width: 1px;
    padding:9px;
    border-style: solid;
    display: inline-block;
    text-align: center;
    font-weight: bold;
}
.best_detail .btn_area .btn_best:hover{
    background-color:black;
    border-color:black;
    color:#fff;
    transition:all .2s;
}
.best_detail .btn_area .btn_ot{
    border-color:#979797;
}
.best_detail .btn_area .btn_detail{
    background-color:#2650b6;
    color:white;
    border-color:#2650b6;
    margin-left:3px;
}
/*-----------------best 수강 후기 --------------------*/
.best_review_cont li {width:500px; cursor: default;}
.best_review_cont li span{
    display: inline-block;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
	text-align:left;
}
.best_review_cont li .curriculum{
    width:42%;
    margin-right:10px;
}
.best_review_cont li .review{
    width:41%;
}
.best_review_cont li .review_id{
    width:13%;
}
/*----------------- 강의 미리보기 --------------------*/
.bg_container{
    padding-top:55px;
    padding-bottom:10px;
}
.mov_cont{
    padding-bottom:40px;
    position: relative;
}
.mov_cont > div{
    float:left;
}
.mov_cont .mov_left{
    width:325px;
    margin-top:10px;
}
.move_right{
    width:825px;
}
.move_right .jcarousel {
    overflow: hidden;
    width: 825px;
    position:relative;
}
.move_right .jcarouse:after{
    content: "";
    display: block;
    visibility: hidden;
    clear: both;
    height: 0;
}
.move_right .jcarousel ul{
    width:20000em;
    position:relative;
}
.move_right .jcarousel ul li{
    float:left;
    overflow: hidden;
}
.move_right .jcarousel ul li span{
    font-size:14px;
    text-align: center;
    display: inline-block;
    width:192px;
    margin-top:5px;
    color:#464646;
    line-height:20px;
}
.mov_cont .jcarousel-control-prev{
    position: absolute;
    left: 275px;
    top: -40px;
    color: #c2c2c2;
    font-size: 105px;
    font-weight: bold;
    font-family: 'Noto Sans KR';
}
.mov_cont .jcarousel-control-next{
    position: absolute;
    right: 0px;
    top: -40px;
    color: #c2c2c2;
    font-size: 105px;
    font-weight: bold;
    font-family: 'Noto Sans KR';
}

/*----------------- 강사 커리큘럼 --------------------*/
.curlm_wrapper{
    border-collapse: collapse;
    width:90%;
    margin:0 auto 90px auto;
}
.curlm_wrapper thead th{
    background-color:#e5eaf5;
    color:black;
    font-family:'Noto Sans KR','Nanum Barun Gothic','나눔바른고딕',sans-serif;
    font-size:24px;
    font-weight: bold;
}
.curlm_wrapper thead th:first-child{
    background-color:#fff;
}
.curlm_wrapper td, .curlm_wrapper th{
    border-right:1px solid #333; 
    border-bottom:1px solid #333; 
    text-align: center;
    padding:10px 35px;;
}
.curlm_wrapper tbody th{
    font-family:'Noto Sans KR','Nanum Barun Gothic','나눔바른고딕',sans-serif;
    font-size:19px;
    color:#000;
    letter-spacing: -1.5px;
    padding:10px;
}
.curlm_wrapper td a{
    font-family: 'Noto Sans KR','Nanum Barun Gothic','나눔바른고딕',sans-serif;
    font-size:19px;
    color:#fff;
    padding:10px 0;
    display: inline-block;
    width:100%;
    background:#ddd url(../images/arrow_right.png) no-repeat right center;
    position: relative;
    letter-spacing: -2px;
}
.curlm_wrapper td a:hover{
    background-color:#000;
    transition:.3s all;
}
.curlm_wrapper td a:hover:before{
    border-right:24px solid #000;
    transition:.3s all;
}
.curlm_wrapper td a:hover:after{
    border-left:24px solid #000;
    transition:.3s all;
}
.curlm_wrapper td a:before{
    content: " ";
    display: inline-block;
    position: absolute;
    top:0;
    left:-48px;
    width:0px;
    height:0px;
    border-right:24px solid #ddd;
    border-top:24px solid transparent;
    border-left:24px solid transparent;
    border-bottom:24px solid transparent;
}
.curlm_wrapper td a:after{
    content: " ";
    display: inline-block;
    position: absolute;
    top:0;
    right:-48px;
    width:0px;
    height:0px;
    border-right:24px solid transparent;
    border-top:24px solid transparent;
    border-left:24px solid #ddd;
    border-bottom:24px solid transparent;
}
/*----------------- 커리큘럼 color system --------------------*/
/*---- 500+ -----*/
.curlm_wrapper td .color_500{background-color:#58d9d4;}
.curlm_wrapper td .color_500:before{border-right:24px solid #58d9d4;}
.curlm_wrapper td .color_500:after{border-left:24px solid #58d9d4;}
/*---- 600+ -----*/
.curlm_wrapper td .color_600{background-color:#58bcd9;}
.curlm_wrapper td .color_600:before{border-right:24px solid #58bcd9;}
.curlm_wrapper td .color_600:after{border-left:24px solid #58bcd9;}
/*---- 700+ -----*/
.curlm_wrapper td .color_700{background-color:#589ed9;}
.curlm_wrapper td .color_700:before{border-right:24px solid #589ed9;}
.curlm_wrapper td .color_700:after{border-left:24px solid #589ed9;}
/*---- 800+ -----*/
.curlm_wrapper td .color_800{background-color:#5a87e2;}
.curlm_wrapper td .color_800:before{border-right:24px solid #5a87e2;}
.curlm_wrapper td .color_800:after{border-left:24px solid #5a87e2;}
/*---- 900+ -----*/
.curlm_wrapper td .color_900{background-color:#656ddd;}
.curlm_wrapper td .color_900:before{border-right:24px solid #656ddd;}
.curlm_wrapper td .color_900:after{border-left:24px solid #656ddd;}
/*---- etc  -----*/
.curlm_wrapper td .color_etc_1{background-color:#926acf;}
.curlm_wrapper td .color_etc_1:before{border-right:24px solid #926acf;}
.curlm_wrapper td .color_etc_1:after{border-left:24px solid #926acf;}
/*---- special  -----*/
.curlm_wrapper td .color_special{background-color:#FF7C80;}
.curlm_wrapper td .color_special:before{border-right:24px solid #FF7C80;}
.curlm_wrapper td .color_special:after{border-left:24px solid #FF7C80;}


/*----------------- 단과과정 탭 UI--------------------*/
.byScore_tab_wrapper{
    position:relative;
}
.byScore_tab_wrapper .ui-tabs{
    border:0;
    background:transparent;
}
.byScore_tab_wrapper .ui-tabs .tabs1_wrapper ul{
    background:transparent;
    border:0;
    float:right;
    margin-top:24px;
    margin-bottom:-3px;
}
.byScore_tab_wrapper .ui-tabs .tabs1_wrapper ul li{
    background-color:transparent;
    background-image: none;
    border:0;
    margin-right:-3px;
}
.byScore_tab_wrapper .ui-tabs .tabs1_wrapper ul li a{
    font-size: 24px;
    font-family: 'Noto Sans KR','Nanum Barun Gothic','나눔바른고딕',sans-serif;
    border: 3px solid #2655b1;
    background-color: transparent;
    font-weight: 500;
    letter-spacing: -1.5px;
    padding-right: 18px;
    width: 120px;
    text-align: center;
}
.byScore_tab_wrapper .ui-tabs .tabs1_wrapper ul li a:after{
    content: ' ';
    background: url(../images/arrow_bottom_small.png) no-repeat 8px 4px;
    width: 20px;
    display: inline-block;
    height: 10px;
    position: relative;
    top: -5px;
}
.byScore_tab_wrapper .ui-tabs .tabs1_wrapper ul li.offline_class a:after{
    content: ' ';
    background: url(../images/new_window_icon.png) no-repeat 8px 4px;
    width: 20px;
    display: inline-block;
    height: 12px;
    position: relative;
    top: -5px;
}
.byScore_tab_wrapper .ui-tabs .tabs1_wrapper ul li.offline_class a:hover:after{
    background: url(../images/new_window_icon.png) no-repeat 8px -5px;
}
.byScore_tab_wrapper .ui-tabs .tabs1_wrapper ul li a:hover:after{
    background: url(../images/arrow_bottom_small.png) no-repeat 8px -3px;
}
.byScore_tab_wrapper .ui-tabs .tabs1_wrapper ul li a:hover, .byScore_tab_wrapper .ui-tabs .tabs1_wrapper ul li.ui-tabs-active a{
    background-color:#2655b1;
    color:#fff;
}
.byScore_tab_wrapper .ui-tabs .tabs1_wrapper ul li.ui-tabs-active a{
    cursor:default;
}
.byScore_tab_wrapper .ui-tabs .tabs1_wrapper ul li.ui-state-disabled{
    opacity:1;	
}
.byScore_tab_wrapper .ui-tabs .tabs1_wrapper ul li.ui-state-disabled a{
    cursor:pointer;
}
.byScore_tab_wrapper .ui-tabs .tabs1_wrapper ul li.ui-tabs-active a:after{
    background: url(../images/arrow_bottom_small.png) no-repeat 8px -3px;
}
.tabs1_wrapper{
    border-bottom:3px solid #2655b1;
    margin-top:50px;
}
.tabs1_wrapper .collage_title{
    font-weight: 900;
    color:#2655b1;
    font-size:75px;
    font-family: 'Noto Sans KR','Nanum Barun Gothic','나눔바른고딕',sans-serif;
    text-align: left;
    position:absolute;
    letter-spacing: -1.5px;
    overflow:hidden;
    height:87px;
}
.byScore_tab_wrapper #content{
    padding:0;
}
/*----------------- bx slider UI--------------------*/
.teacherD_slider_wrapper .bx-wrapper{
    position:relative;
}
.teacherD_slider_wrapper .bx-wrapper .bx-controls{
    position:absolute;
    top:45%;
    width:100%;
}
.teacherD_slider_wrapper .bx-wrapper .bx-controls a.bx-prev, .teacherD_slider_wrapper .bx-wrapper .bx-controls a.bx-next{
    display: inline-block;
    width:32px;
    height:65px;
    text-indent: -9999px;
    overflow: hidden;
    position:absolute;
}
.teacherD_slider_wrapper .bx-wrapper .bx-controls a.bx-prev{     background:url(//toeic.ybmclass.com/toeic/css/img/btn_c_prev.png) left top no-repeat;
    left: 50%;
    margin-left: -620px;
}
.teacherD_slider_wrapper .bx-wrapper .bx-controls a.bx-next{            background:url(//toeic.ybmclass.com/toeic/css/img/btn_c_next.png) left top no-repeat;
    right: 50%;
    margin-right: -620px;
}
.teacherD_slider_wrapper .bx-pager{
    text-align:center;
    position: relative;
    bottom:-150px;
}
.teacherD_slider_wrapper .bx-pager-item{
    display: inline-block; 
}
.teacherD_slider_wrapper .bx-pager-item a{
    display: inline-block;
    border:2px solid #ddd;
    border-radius:10px;
    width:10px;
    height:10px;
    margin:2px;
    text-indent:-9999999px;
}
.teacherD_slider_wrapper .bx-pager-item a.active, .teacherD_slider_wrapper .bx-pager-item a:hover{
    background-color:#ddd;
}