@charset "utf-8";
@import url(http://fonts.googleapis.com/css?family=Noto+Sans);


@font-face {
    font-family: 'notokr-bold';
    src: url('/fonts/NotoKR-Bold/notokr-bold.eot');
    src: url('/fonts/NotoKR-Bold/notokr-bold.eot?#iefix') format('embedded-opentype'),
    url('/fonts/NotoKR-Bold/notokr-bold.woff2') format('woff2'),
    url('/fonts/NotoKR-Bold/notokr-bold.woff') format('woff'),
    url('/fonts/NotoKR-Bold/notokr-bold.ttf') format('truetype'),
    url('/fonts/NotoKR-Bold/notokr-bold.svg#notokr-bold') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'notokr-medium';
    src: url('/fonts/NotoKR-Medium/notokr-medium.eot');
    src: url('/fonts/NotoKR-Medium/notokr-medium.eot?#iefix') format('embedded-opentype'),
    url('/fonts/NotoKR-Medium/notokr-medium.woff2') format('woff2'),
    url('/fonts/NotoKR-Medium/notokr-medium.woff') format('woff'),
    url('/fonts/NotoKR-Medium/notokr-medium.ttf') format('truetype'),
    url('/fonts/NotoKR-Medium/notokr-medium.svg#notokr-medium') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'NotoSansKR-Regular';
    src: url('/fonts/NotoSansKR-Regular/notokr-regular.eot');
    src: url('/fonts/NotoSansKR-Regular/notokr-regular.eot?#iefix') format('embedded-opentype'),
    url('/fonts/NotoSansKR-Regular/notokr-regular.woff2') format('woff2'),
    url('/fonts/NotoSansKR-Regular/notokr-regular.woff') format('woff'),
    url('/fonts/NotoSansKR-Regular/notokr-regular.ttf') format('truetype'),
    url('/fonts/NotoSansKR-Regular/notokr-regular.svg#notokr-regular') format('svg');
    font-weight: normal;
    font-style: normal;
}




@font-face {
    font-family: 'NotoSansKR-Light';
    src: url('/fonts/NotoSansKR-Light/NotoSansKR-Light.eot');
    src: url('/fonts/NotoSansKR-Light/NotoSansKR-Light.eot?#iefix') format('embedded-opentype'),
    url('/fonts/NotoSansKR-Light/NotoSansKR-Light.woff2') format('woff2'),
    url('/fonts/NotoSansKR-Light/NotoSansKR-Light.woff') format('woff'),
    url('/fonts/NotoSansKR-Light/NotoSansKR-Light.ttf') format('truetype'),
    url('/fonts/NotoSansKR-Light/NotoSansKR-Light.svg#notokr-light') format('svg');
    font-weight: normal;
    font-style: normal;
}



.main #contents {position:relative; width:auto; margin-top:60px; padding-bottom:80px; border-top:1px solid #e6e6e6;}
.main #contents:before {content:''; display:block; position:absolute; top:0; left:0; right:0; height:220px; background:#fbfbfb; z-index:1;}
.main #contents > .inner {position:relative; width:1200px; margin:0 auto 0; z-index:2;}

.main .title-box01 {font-size:0;}
.main .title-box01 > * {display:inline-block; margin-right:25px; vertical-align:middle;}

/* 상단 비주얼 */
.main-visual {position:relative; background:#f7f7f7; border-bottom:1px solid #e6e6e6; height:430px}
.main-visual .visual {position:static; width:1900px; margin:0 0 0 50%; }
.main-visual .visual ul {height:400px !important; overflow:hidden;}
.main-visual .visual li {float:left;  height:500px !important; padding:20px 10px 0 10px; box-sizing:border-box; overflow:hidden;}
.main-visual .visual li a {position:relative; display:block; max-width:620px; margin:0 auto; overflow:hidden;}
.main-visual .visual li a .img {overflow:hidden;}
/*.main-visual .visual li a .img img {position:relative; left:50%; display:block; width:620px; margin-left:-310px;}*/
.main-visual .visual li a .img img {position:relative; display:block; width:615px;}
.main-visual .visual li a .info {position:absolute; bottom:40px; left:50px; right:50px; height:82px;}
.main-visual .visual li a .info:after {content:''; display:block; clear:both;}
.main-visual .visual li a .info .box {position:relative; float:left; display:table; min-width:160px; height:78px; margin-right:18px; text-align:center; border:1px solid rgba(255,255,255,0.5); box-sizing:border-box;}
.main-visual .visual li a .info .box .channel {display:table-cell; width:80px; height:80px; background:#fff; vertical-align:middle;}
.main-visual .visual li a .info .box .channel img {vertical-align:top;}
.main-visual .visual li a .info .box .time {display:table-cell; padding:0 15px; color:#fff; vertical-align:middle;}
.main-visual .visual li a .info .box .time span {display:block; font-size:20px; font-weight:400; font-family:'roboto';}
.main-visual .visual li a .info .txt {float:left;}
.main-visual .visual li a .info .txt > strong {display:block; margin-top:-3px; color:#fff; font-size:20px; font-weight:400; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}
.main-visual .visual li a .info .txt > span {display:block; height:44px; margin-top:7px; color:#fff; line-height:22px; opacity:0.7; text-overflow:ellipsis; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;}

.main-visual .visual .move-btn {position:absolute; top:400px; left:50%; width:1200px; margin:-20px 0 0 -600px; text-align:center;}
.main-visual .visual .move-btn > * {display:inline-block; vertical-align:middle;}
.main-visual .visual .auto {margin-left:15px; margin-top:2px;}
.main-visual .visual .auto .btn-play {display:none;}
.main-visual .visual .auto .btn-pause {display:inline-block;}
.main-visual .visual .auto.stop .btn-play {display:inline-block;}
.main-visual .visual .auto.stop .btn-pause {display:none;}
.main-visual .visual .swiper-pagination {position:static;}
.main-visual .visual .swiper-pagination > * {position:relative; width:8px; height:8px; background:#c8c8c8; opacity:1;}
.main-visual .visual .swiper-pagination > * .bar {display:block; position:absolute; top:0; bottom:0; left:0; width:0; background:#009ace;}
.main-visual .visual .swiper-pagination > * + * {margin-left:16px;}
.main-visual .visual .swiper-pagination > *.swiper-active-switch,
.main-visual .visual .swiper-pagination > *.swiper-pagination-bullet-active {width:8px; background:#009ace;}
.main-visual .visual .swiper-pagination > *.swiper-active-switch .bar {}
.main-visual .visual .control a {position:absolute; top:40%; width:80px; height:60px; background:rgba(0,0,0,0.0) url('/img/main/arr_prev1.png') no-repeat center center; text-indent:-9999px; overflow:hidden; transition:all 0.3s ease; z-index:10;}
.main-visual .visual .control a:hover {background-color:rgba(0,0,0,0.0);}
.main-visual .visual .control .btn-prev {left:0; background-image:url('/img/main/arr_prev.png');}
.main-visual .visual .control .btn-next {right:0; background-image:url('/img/main/arr_next.png');}

/* 프로그램 */
.main .program-list {border-bottom:2px solid #e6e6e6;}
.main .program-list ul {margin-left:-24px; margin-bottom:-2px; overflow:hidden;}
.main .program-list li {margin-left:24px; overflow:hidden;}
.main .program-list li a {position:relative;}
.main .program-list li a:after {content:''; display:block; position:absolute; bottom:0; left:0; width:100%; height:2px; background:#1f91be; transform:scaleX(0.00001); transition:all 0.3s ease;}
.main .program-list li a .info {height:98px;}
.main .program-list li a:hover:after {transform:scaleX(1);}

/* 핫클립 */
.main .hotclip-box {position:relative; min-height:340px;}
.main .hotclip-box .thumb-list01 {margin:-24px 0 0 -24px;}
.main .hotclip-box .thumb-list01 li {width:282px; margin:24px 0 0 24px;}
.main .hotclip-box .ad-box {position:absolute; bottom:0; right:0; width:282px; height:269px; overflow:hidden; background:#e6e6e6;}
.main .hotclip-box .ad-box li {float:left;}
.main .hotclip-box .ad-box .swiper-wrapper {width:9999px; }
.main .hotclip-box .ad-box .swiper-pagination {position:absolute; top:20px; right:56px;}
.main .hotclip-box .ad-box .auto {position:absolute; top:12px; right:20px;}
.main .hotclip-box .ad-box .auto .btn-play {display:none;}
.main .hotclip-box .ad-box .auto .btn-pause {display:block;}
.main .hotclip-box .ad-box .auto.stop .btn-play {display:block;}
.main .hotclip-box .ad-box .auto.stop .btn-pause {display:none;}


/*추가*/
.conter { width:100%; min-width:1140px; margin:auto; background-color:#fff}
.conter .cont01 { width:1140px; height: auto; overflow:hidden; margin:auto; padding:0;}

/*직렬탭*/
.banner_tabmenu { margin-bottom:2px; padding: 0; width: 1140px;float:left; }
.banner_tabmenu:after { content:""; display:block; clear:both; }
.banner_tabmenu ul { margin: 0 ; padding: 0; clear:both; margin-left:1px; }
.banner_tabmenu li{ 
	float:left; display: inline-block; zoom: 1; *display: inline; width:142px; 
	border-style: solid; border-width: 1px; border-color: #dddde1; 
	padding: 14px 0 14px 0; text-align: center; margin: 0 -1px -1px -1px; cursor: pointer; 
	color: #666666; background-color: #fafafa; font-size:15px; font-weight:600  }
.banner_tabmenu li.on { font-weight:600; color: #333; background-color: #fff; border-color: #333; margin-right:1px }



/**********/
.product { width:1140px;  height:auto; float:left; border:0;  }
.product ul{overflow:hidden;position:relative;margin:0; list-style:none;*zoom:1;  }
.product ul:after{display:block;clear:both;}
.product li{overflow:hidden;float:left; width:268px;height:148px; margin:15px 20px 5px 0; border:1px solid #dbd8d8;position:relative;}
.product_mr22{ margin-right:22px}
.product .no_r { margin-right:0}
.product img{display:block;width:277px; height:148px;border:0; margin:0 auto; cursor:pointer; position:relative  }
.product .icon{ width:11px; height:11px; display:inline; border:0; margin:3px 0 0 3px;}
.product li a{text-decoration:none;}
.product li div{width:248px; height:60px; text-align:left; display:table-cell; vertical-align:middle; background-color:#fff;word-break:keep-all; padding:6px 10px 6px 13px; font-weight:normal; font-size:14px; color:#666; line-height:18px}
.product li div p{ height:16px; text-align:right; font-size:10px}

.product a strong{display:block;font-size:14px; text-decoration:none; line-height:17px; color:#666;}
.product a:hover strong{text-decoration: none;}

#tit_area2{height:16px; padding:3px 5px; border:1px solid #6ab0dc; font-size:11px; line-height:16px; vertical-align:top; color:#6ab0dc; background:#FFFFFF; top:10px; left:10px; position:absolute;opacity:0.9; z-index:9; width:58px; text-align:center }
.product .spot-list2 .list_info > .shadow{
		position: absolute;
		width: 277px;
		height: 148px;
		top: 0;
		left: 0;
		background: url(/img/main/bg_mask.png) repeat 0 0;
opacity:0.9;
		display: none; z-index:20
	}
.product .spot-list2 li a:hover .list_info  > .shadow {
	   
		display: block;}
.product .spot-list2 .list_info {
	position: absolute;
	left: 0px;
	top: 0px;
	float: left;
	width: 277px;
	height: 148px;}
.shadow > em {
		display: block;
		width: 120px;
		margin: 0 auto;
		padding: 12px 0;
		border: 2px solid #fff;
		font-size: 13px;
		margin-top:20%;
		text-align: center;
		color: #fff;}


.conter03 { width:100%; min-width:1140px; margin:auto; background-color:#fff}
.conter03 .cont04{ width:1140px; height: auto; overflow:hidden; margin:auto; padding:0;}
.b_review{ width:560px; height:auto; margin:40px 0 40px 0; float:}
.i_month{position:absolute; width:60px; height:40px; font-family:Tahoma, Geneva, sans-serif; font-weight:bold; font-size:33px; top:53px; left:536px; }
.b_review .month{position:absolute; width:60px; height:40px; font-family:Tahoma, Geneva, sans-serif; font-weight:bold; font-size:33px; top:53px; left:170px; }
.b_review .tit{ width:560px; height:51px; border-bottom:1px solid #e0e1e3; float:left; position:relative}
.b_review .tit .text{ width:200px; font-size:22px; font-weight:600; text-align:left; line-height:51px; color:#333}
.r_style_bg { font-size:13px; height:auto; float:left;position:relative}

.r_style_bg th{text-align:left; font-size:15px; font-weight:600;height:43px;border-bottom:1px solid #dedede; position:relative}
.r_style_bg .font_s12{ font-size:12px; font-weight:normal; color:#666666}


.r_style_bg .no_l{border-bottom:0;}
.r_style_bg td { text-align:left }



.td_box1 {background:#fff; text-align:left;}
.box_in1 {background:#fff; border-bottom:2px solid #333;padding:10px 0 15px 0;font-size:14px; line-height:22px; width:100%;height:auto; float:left; font-weight:normal }

.box_in1 .bleft{ width:52px; height:100%; float:left}
.box_in1 .bright{ width:490px; height:100%; float:right;font-size:14px; line-height:22px;}
.more_l01{
	position:absolute;
	top:7px;
	right:1px;
	margin-top:10px;
	margin-right:0px;
	width:55px;
	height:25px;
	border:0;
}

.mProjectWrap{height:178px; background:url(/img/main/mbig_banner_ba1.jpg)center no-repeat; background-attachment:fixed; background-size:cove}

.mProjectWrap .projectimg{width:1140px;margin:0 auto;}

/*1:1 학습담당 플래너 */
.qconter{ width:100%; min-width:1140px; margin:auto; background-color:#fff; background:url(/img/main/qm_baimg.jpg)center no-repeat; height:423px}
.qconter .service{ width:1140px; height: auto; overflow:hidden; margin:auto; padding:0; }

.service h2{height:39px;color:#333335;font-size:22px;font-weight:600; text-align:center; margin-top:70px}
.service p{ font-size:14px; font-weight:normal; height:25px; margin-bottom:20px;text-align:center;}
.service ul{overflow:hidden;margin-left:30px}
.service ul li{float:left;width:14%;margin-top:25px;text-align:center; }
.service ul li a{display:inline-block;min-width:115px;margin:0 auto;background:url(/img/main/serviceBg.png) no-repeat 50% 3px;color:#767575;letter-spacing:-1px}
.service ul li a:hover, .service ul li a:focus{background:url(/img/main/serviceBgOn.png) no-repeat 50% 0;color:#6c5648}
.service ul li a span{display:inline-block;min-width:75px;padding-top:130px; color:#333333}
.service ul li a:hover span, .service ul li a:focus span{text-decoration:underline}
.service ul li.service1 a span{background:url(/img/main/simg01.png) no-repeat 50% 30px}
.service ul li.service2 a span{background:url(/img/main/simg02.png) no-repeat 50% 30px}
.service ul li.service7 a span{background:url(/img/main/simg07.png) no-repeat 50% 30px}
.service ul li.service3 a span{background:url(/img/main/simg03.png) no-repeat 50% 30px}
.service ul li.service4 a span{background:url(/img/main/simg04.png) no-repeat 53% 30px}
.service ul li.service5 a span{background:url(/img/main/simg05.png) no-repeat 50% 30px}
.service ul li.service6 a span{background:url(/img/main/simg06.png) no-repeat 50% 30px}


/*쌤배너2*/
.sconter{width:100%; min-width:1140px; margin:auto; height:111px; margin:20px 0 20px 0}
.sconter .pro_ss{ width:1140px; margin:0 auto;}
.sconter .pro_ss ul{float:left;}
.sconter .pro_ss ul li{ width:570px; display:inline}

/*하단배너들*/
.bconter{width:100%; min-width:1140px; margin:auto; height:210px; margin:20px 0 20px 0}
.bconter .ebo{ width:1140px; margin:0 auto;}
.bconter .ebo img{ display:inline}



/**/
.conter07 { width:100%; min-width:1140px; margin:auto;height:auto;  background-color:#f0f1f3}
.conter07 .cont08 { width:1140px; height:auto; overflow:hidden; margin:auto; ; position:relative}

#selection{position:relative; width:1140px; float:left; margin:30px 0 20px 0 }
#selection .titbox{ width:355px; height:160px; float:left}
#selection .titbox  h2{ float:left; padding:0 10px 5px 0; font-size:22px; line-height:40px; font-weight:bold; text-align:left}
#selection .titbox p{ width:369px; height:50px; font-size:13px; line-height:20px; float:left; text-align:left; margin:0 0 5px 0;letter-spacing:-1px; }
#selection .titbox .num{ float:left; margin:10px 0 5px 0}
#selection .titbox .btn{ width:369px;float:left;}
#selection .titbox .btn li{ margin-right:3px; float:left; width:120px}
#selection .motion{width:680px; height:85px; margin:0 auto; float: right; margin:30px 0 0 40px; border:1px solid #c3c3c3; overflow:hidden}



.btn-type{ position:relative;}
.al-c{text-align:center !important;}
.btn-type03{display:inline-block; width:282px; height:48px; line-height:46px; padding:0 10px; color:#333; font-weight:400; text-align:center; border: 1px solid #ccc; box-sizing:border-box; transition: all 0.3x;-webkit-transition: all 0.3s;}


/*모바일로가기*/
.mobile_box{ margin:15px}
.mobile_box .btn{width:100%; padding:15px 0px; font-size:45px; font-weight:500; text-align:center; border:5px solid #999; cursor:pointer }
.mobile_box .btn a{ color:#323238}