@charset"utf-8";

/**
	MYCLASS
**/

/** myclass **/
.myclass .line_title{padding-top:0}
.myclass .myclass_menu > li{margin:35px 0 0 0;padding:4px 4px 4px 0;background:#f4f4f4}
.myclass .myclass_menu > li:first-child{margin:0}
.myclass .myclass_menu > li dl{position:relative;padding:0 0 0 334px;font-size:17px;color:#7a7a7a}
.myclass .myclass_menu > li dl dt{position:absolute;left:0;top:50%;margin:-82px 0 0 0;width:212px;height:174px;font-size:34px;color:#000;text-align:center;font-weight:700}
.myclass .myclass_menu .menu1 dl dt{background:url('/asset/img/sub/myclass/menu_bg1.jpg') no-repeat 50% 100%}
.myclass .myclass_menu .menu2 dl dt{background:url('/asset/img/sub/myclass/menu_bg2.jpg') no-repeat 50% 100%}
.myclass .myclass_menu .menu3 dl dt{background:url('/asset/img/sub/myclass/menu_bg3.jpg') no-repeat 50% 100%}
.myclass .myclass_menu > li dl dt a{position:absolute;left:190px;top:58px;padding:0 12px 0 0;width:98px;height:44px;font-size:18px;color:#bebebe;line-height:44px;border:solid 4px #bebebe;background:url('/asset/img/sub/myclass/btn_search_bg.png') no-repeat 85px 45%}
.myclass .myclass_menu > li dl dt a:hover{color:#fff;background:#bebebe url('/asset/img/sub/myclass/btn_search_bg_ov.png') no-repeat 85px 45%}
.myclass .myclass_menu > li dl dt + dd{margin-top:0}
.myclass .myclass_menu > li dl dd{margin:4px 0 0 0;background:#fff}
.myclass .myclass_menu > li dl dd a{display:block;padding:8px 50px 0 25px;height:65px;line-height:1.5;background:url('/asset/img/sub/myclass/btn_arr.png') no-repeat 472px 50%}
.myclass .myclass_menu > li dl dd a:hover{background-color:#e1e1e1}
.myclass .myclass_menu > li dl dd a strong{font-size:23px;color:#000;font-weight:700}
.myclass .info{margin:0 0 20px 0}
.myclass .info .chartbox{float:left;padding:23px 0 0 0;width:290px;font-size:17px;text-align:center}
.myclass .info .chartbox .tit{margin:0 0 11px 0;font-size:18px;font-weight:700}
.myclass .info .chartbox .chart{position:relative;margin:0 0 4px 0}
.myclass .info .chartbox .chart .tx1{position:absolute;left:0;top:64px;width:100%;line-height:1.1}
.myclass .info .chartbox .chart .tx1.row2{top:48px}
.myclass .info .chartbox .chart .tx1 .num{margin:0 0 5px 0;font-size:70px;font-weight:800;letter-spacing:-2px}
.myclass .info .video{margin:0 0 0 320px;padding:9px;height:337px;background:#e5e5e5}
.myclass .info .video .top{position:relative;margin:0 0 9px 0;height:285px}
.myclass .info .video .top img{width:507px;height:285px}
.myclass .info .video .top a{position:absolute;left:0;top:0;width:100%;height:100%;text-indent:-9999px;background:url(about:blank)}
.myclass .info .video .bottom{height:42px;font-size:25px;font-weight:700;text-align:center;line-height:42px;background:#fff}
.myclass .list_box .caution{margin:0 0 12px 0;font-size:12px;color:#888;text-align:right}
.myclass .list_box .caution span{display:inline-block;padding:0 0 0 30px;line-height:1.4;background:url('/asset/img/sub/myclass/caution_bg.jpg') no-repeat 0 0}
.myclass .list_box .tabmenu{overflow:hidden;margin:0 0 15px 0;font-size:20px;color:#99ca3b;text-align:center;border:solid #99ca3b;border-width:1px 0 5px 1px}
.myclass .list_box .tabmenu li{float:left;width:25%}
.myclass .list_box .tabmenu.col5 li{width:20%}
.myclass .list_box .tabmenu li a{display:block;height:49px;line-height:49px;border-right:solid 1px #99ca3b}
.myclass .list_box .tabmenu .on a{color:#fff;font-weight:700;background:#99ca3b}
.myclass .list_box .board_nav{margin:0 0 16px 0;font-size:0;text-align:right}
.myclass .list_box .board_nav li{display:inline-block;margin:0 0 0 4px;font-size:18px}
.myclass .list_box .board_nav li:first-child{float:left;margin:0}
.myclass .list_box .board_nav li:first-child a{margin:0 12px 0 0}
.myclass .list_box .board_nav li a{display:inline-block;padding:0 35px 0 14px;height:34px;line-height:34px;border:solid 2px #404040;background:url('/asset/img/sub/myclass/btn_down.png') no-repeat 100% 42%}
.myclass .list_box .board_nav li a:hover{color:#fff;background:#404040 url('/asset/img/sub/myclass/btn_down_w.png') no-repeat 100% 42%}
.myclass .list_box .table_board td{padding:12px 5px}
.myclass .list_box .btn_view{display:inline-block;width:24px;height:24px;text-align:left;text-indent:-9999px;background:url('/asset/img/sub/myclass/btn_view.png') no-repeat 0 0}
.myclass .list_box .btn_note{display:inline-block;width:35px;height:24px;text-align:left;text-indent:-9999px;background:url('/asset/img/sub/myclass/btn_note.png') no-repeat 0 0}
.myclass .list_box .btn_quiz{display:inline-block;width:31px;height:25px;text-align:left;text-indent:-9999px;background:url('/asset/img/sub/myclass/btn_quiz.png') no-repeat 0 0}
.myclass .list_box .btn_file_down{display:inline-block;padding:0;width:25px;height:25px;text-align:left;text-indent:-9999px;background:url('/asset/img/sub/myclass/btn_file_down.png') no-repeat 0 0}
.myclass .list_box .btn_mp3{display:inline-block;padding:0;width:25px;height:25px;text-align:left;text-indent:-9999px;background:url('/asset/img/sub/myclass/btn_mp3.png') no-repeat 0 0}
.myclass .list_box .toggle_zzim{margin:0;width:21px;height:19px;text-align:left;text-indent:-9999px;border:none;background:url('/asset/img/sub/myclass/zzim.png') no-repeat 0 100%;cursor:pointer}
.myclass .list_box .toggle_zzim.on{background-position:0 0}
.myclass .list_box .bar{display:inline-block;margin:0 5px 0 0;width:72px;background:#eee}
.myclass .list_box .bar strong{display:block;width:0;height:12px;background:#555}
.myclass .tabmenu2{margin:0 0 20px 0}
.myclass .tabmenu2 .tit{height:51px;font-size:20px;color:#fff;font-weight:700;text-align:center;line-height:51px;background:#99ca3b}
.myclass .tabmenu2 .list{height:86px;color:#666;font-weight:700;text-align:center;line-height:1.3;border-right:solid 1px #b8d484}
.myclass .tabmenu2 .list li{position:relative;float:left;width:92px;border-left:solid 1px #d8d484}
.myclass .tabmenu2 .list li:first-child{width:96px}
.myclass .tabmenu2 .list li a{display:block;height:86px;font-size:0;border-bottom:solid 1px #d8d484}
.myclass .tabmenu2 .list li a:before{content:'';display:inline-block;height:100%;vertical-align:middle}
.myclass .tabmenu2 .list li a span{display:inline-block;font-size:17px;vertical-align:middle}
.myclass .tabmenu2 .list .on a{position:relative;z-index:2;margin:0 -1px;height:87px;border-bottom:none;background:#cce49d}
.myclass .search{margin:0 0 24px 0}
.myclass .search .top{position:relative;margin:0 0 1px 0;padding:0 0 0 20px;height:55px;font-size:20px;color:#fff;font-weight:700;line-height:55px;background:#525252}
.myclass .search .top .right{position:absolute;right:8px;top:8px}
.myclass .search .top .right input{padding:0 10px;width:278px;height:38px;line-height:38px;color:#777;font-weight:400;border:none;vertical-align:top}
.myclass .search .top .right a{display:inline-block;width:50px;height:38px;font-size:17px;color:#636363;font-weight:700;text-align:center;line-height:38px;background:#cbcbcb;vertical-align:top}
.myclass .search .bottom{padding:20px 0;font-size:0;text-align:center;background:#cbcbcb}
.myclass .search .bottom li{display:inline-block;padding:0 8px;font-size:17px;font-weight:700;border-left:solid 1px #252525}
.myclass .search .bottom li:first-child{border:none}
.myclass .search .bottom .on a{color:#01309b}
.myclass .search2{margin:0 0 40px 0;height:38px}
.myclass .search2 .sort{float:left;font-size:17px;color:#868686;font-weight:700;text-align:center;line-height:38px}
.myclass .search2 .sort li{float:left;margin:0 9px 0 0}
.myclass .search2 .sort li a{display:block;width:108px;height:38px;border:solid 1px #bebebe}
.myclass .search2 .sort .on a{color:#fff;border-color:#787878;background:#787878}
.myclass .search2 .right{float:right}
.myclass .search2 .right input{padding:0 10px;width:216px;height:38px;line-height:38px;font-size:17px;color:#777;font-weight:400;border:solid 1px #cbcbcb;vertical-align:top}
.myclass .search2 .right a{display:inline-block;width:50px;height:38px;font-size:17px;color:#636363;font-weight:700;text-align:center;line-height:38px;background:#cbcbcb;vertical-align:top}
.myclass .table_tit{height:36px;font-size:18px;color:#fff;font-weight:700;text-align:center;line-height:36px;background:#555}
.myclass .table_tit.bg{background:#2b2b2b}
.myclass .tablebox_col2{overflow:hidden;margin:20px 0 0 0}
.myclass .tablebox_col2 > div{width:412px}
.myclass .tablebox_col2 > div tbody th{border:solid #eee;border-width:0 1px 1px 0}
.myclass .tablebox_col2 > div tbody td a{margin:0 2px}
.myclass .tablebox_col2 .left{float:left}
.myclass .tablebox_col2 .right{float:right}

/** learning_center **/
.myclass .center_info{margin:0 0 25px 0;padding:30px 0;font-size:18px;text-align:center;border:solid 3px #e5e5e5;border-radius:10px}
.myclass .center_info .zzim{display:inline-block;position:relative;padding:0 40px 0 45px}
.myclass .center_info .zzim:after{content:'';position:absolute;left:0;top:50%;margin:-22px 0 0 0;width:38px;height:37px;background:url('/asset/img/common/icon/ico_zzim.gif') no-repeat 0 0}
.myclass .center_info .zzim:before{content:'';position:absolute;right:0;top:50%;margin:-22px 0 0 0;width:31px;height:37px;background:url('/asset/img/common/icon/ico_hand.gif') no-repeat 0 0}
.myclass .center_info .pattern{display:inline-block;position:relative;padding:0 94px 0 0}
.myclass .center_info .pattern:before{content:'';position:absolute;right:0;top:50%;margin:-35px 0 0 0;width:70px;height:70px;background:url('/asset/img/common/icon/ico_down.png') no-repeat 0 0}
.myclass .center_info.qna{padding:26px 0 26px 54px;text-align:left;line-height:1.4;background:url('/asset/img/sub/myclass/center_qna_bg.jpg') no-repeat 678px 50%}
.myclass .center_info.qna strong{color:#7eb416}
.myclass .center_info .reference{display:inline-block;position:relative;padding:0 95px 0 0}
.myclass .center_info .reference:before{content:'';position:absolute;right:0;top:50%;margin:-33px 0 0 0;width:83px;height:65px;background:url('/asset/img/common/icon/ico_reference.gif') no-repeat 0 0}
.myclass .tabmenu1{overflow:hidden;margin:0 0 28px 0;font-size:21px;font-weight:700;text-align:center;border:solid 1px #72a909}
.myclass .tabmenu1 li{float:left;width:280px}
.myclass .tabmenu1 li a{display:block;height:50px;color:#71a50e;line-height:50px;border-left:solid 1px #72a909}
.myclass .tabmenu1 li:first-child a{border-left:none}
.myclass .tabmenu1 .on a{color:#fff;background:#99ca3b}
.myclass .tabmenu3{overflow:hidden;margin:0 0 18px 0;font-size:18px;text-align:center;font-weight:700;border-bottom:solid 9px #99ca3b}
.myclass .tabmenu3 li{float:left;margin:0 -1px -1px 0}
.myclass .tabmenu3 li a{display:block;padding:0 10px;min-width:147px;height:48px;line-height:48px;border:solid 1px #b4b4b4}
.myclass .tabmenu3 .on a{position:relative;color:#fff;border-color:#99ca3b;background:#99ca3b}
.myclass .btn_right{margin:0 0 8px 0;padding:10px 0 0 0;text-align:right}
.myclass .btn_right a{padding:0;width:160px;min-width:0;height:44px;color:#404040;line-height:44px}
.myclass .btn_right a:hover{color:#fff}
.myclass .in_form{margin:0 0 40px 0;padding:40px 40px 13px 0;font-size:20px;border:solid 1px #d2d2d2}
.myclass .in_form .tit{margin:0 0 36px 40px;padding:0 0 0 12px;height:23px;line-height:23px;border-left:solid 6px #99ca3b}
.myclass .in_form dl{position:relative;padding:0 0 0 180px}
.myclass .in_form dl dt{position:absolute;left:0;width:180px;text-align:center;line-height:45px}
.myclass .in_form dl dd{margin:0 0 15px 0}
.myclass .in_form dl dd > div{padding:11px 0}
.myclass .in_form dl dd .full{padding:0 10px;width:100%}
.myclass .in_form dl .editor{min-height:300px}
.myclass .in_form dl .file{padding:7px 0}
.myclass .in_form dl .file span{font-family:'Dotum';font-size:12px;color:#999}
.myclass .btn_center li{margin:0 4px}
.myclass .btn_center li > *{padding:0;min-width:160px}
.myclass .board_top{position:relative;margin:0 0 6px 0;height:31px}
.myclass .board_top .btn_arr{padding:0;min-width:0;width:185px;height:34px;font-size:17px;line-height:34px;border-color:#000}
.myclass .board_top .search{font-size:0;text-align:right}
.myclass .board_top .search li{display:inline-block;margin:0 0 0 5px;font-size:17px}
.myclass .board_top .search li:first-child{float:left;margin:0}
.myclass .board_top .search li select,
.myclass .board_top .search li input{height:31px;line-height:31px;border:solid 4px #666}
.myclass .board_top .search li select{padding:3px}
.myclass .board_top .search li input{padding:0 5px;width:230px}
.myclass .paging{margin:48px 0 0 0}