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

html {font-size: 10px;}
body {font-size: 1rem;}
.pc {display: block;}
.mo {display: none !important;}

/* HEADER : START */
#wrap {min-width: 1180px; margin: 0; padding: 0; font-size: 1.6rem; letter-spacing: -0.5px;}
#header{position: relative; width: 100%; margin: 0 auto; padding-top: 80px; font-family: 'NotoSansKR'; color: #fff;}
#header .topbar{position: fixed; top: 0; display: block; width: 100%; height: 80px; background: rgb(4,115,234); background: linear-gradient(90deg, rgba(26,26,26,1) 0%, rgba(26,26,26,1) 80%, rgba(217,27,27,1) 100%); transition: background-color 0.3s ease; z-index: 9999; border-bottom: #505050 solid 0.0rem;}
#header .topbar.fixed {position:fixed; top:0px; width: 100%; background: #000; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.2); z-index:100;}
#header .cont-sp{position: relative;}
#header .topbar .logo { display: flex; width: 17rem; height: 3.7rem; }
#header .topbar .allmenu { display: flex; padding: 0.7rem 0.9rem 0.9rem; border: 0.1rem solid #7A7A7A; border-radius: 0.2rem; font-family: 'NotoSansKR','Noto sans KR'; font-size: 1.4rem; color: #fff;}
#header .topbar .allmenu span:before{content: ''; display: inline-block; background: url(/resource/images/icon_allmenu.svg) no-repeat 50%; width: 1.2rem; height: 1.2rem; margin: 0rem 0.7rem -0.1rem 0;}
#header .topbar .g-menu { display: flex; align-items:center; font-weight: 400; font-size: 1.7rem; }
#header .topbar .g-menu li { display: flex; align-items: center; flex-direction: row; } 
#header .topbar .g-menu li:first-child { padding:0 2rem 0 0; }
#header .topbar .g-menu li a { display: inline-block; padding: 2rem 1.2rem; }
#header .topbar .g-menu li a:hover { color: #FFc068; }
#header .topbar .g-menu li.bultxt{position: relative; color: #FF9839; font-weight: 600; z-index: 10;}
#header .topbar .g-menu li.bultxt .sub-menu{display: none; position: absolute; top: 6.5rem; left: 0; width: 25.6rem; background: #fff; color: #323232; line-height: 2.2rem; padding: 0 2.2rem; box-sizing: border-box; -webkit-box-shadow: 3px 3px 4px 0 rgba(0,0,0,0.2); 
    box-shadow: 3px 3px 4px 0 rgba(0,0,0,0.2);}
#header .topbar .g-menu li.bultxt .sub-menu a{display: inline-block; font-size: 1.4rem; padding: 1.3rem 0;}
#header .topbar .g-menu li.bultxt .sub-menu a + a:before{content: '???'; display: inline-block; font-size: 1.4rem; padding: 0 0.5rem 0 0.3rem;}
#header .topbar .g-menu li.bultxt:hover .sub-menu{display: block; }

#header .topbar .btnbox{position: absolute; top: 50%; right: 11.6rem; transform: translateY(-50%);}
#header .topbar .btnbox a{display: inline-block; font-size: 1.6rem; vertical-align: middle;}
#header .topbar .btnbox a:after{content: ''; display: inline-block; background: url(/resource/images/icon_spacebar.svg) no-repeat 50%; width: 0.1rem; height: 1.6rem; padding: 0 1.2rem; vertical-align: middle;}
#header .topbar .btnbox a:last-child:after { content:''; background: none; padding-right: 0;}
#header .topbar .btnbox a.login span:before { content: ''; display: inline-block; background: url(/resource/images/icon_login.svg) no-repeat 50%; width: 1.2rem; height: 1.4rem; margin: 0rem 0.7rem -0.1rem 0;}
#header .topbar .btnbox a.login span { vertical-align: middle; }
#header .topbar .btnbox .top_cart{position: relative; display: inline-block; background: url(/resource/images/icon_cart2.svg) no-repeat 50%; width: 2rem; height: 1.9rem;}
#header .topbar .btnbox .top_cart .n_count{position: absolute; top: -1rem; right: -1.2rem; border-radius: 50%; width: 1.8rem; height: 1.8rem; background: #fff; color: #1B1D1C; text-align: center; margin-left: 0.3rem; font-size: 1.2rem; font-weight: 700; line-height: 1.6rem; vertical-align: middle; margin-top: -0.2rem; padding: 0 0.1rem 0 0; box-sizing: border-box;}
#header .topbar .btnbox .top_my { display: inline-block; width: auto; height: 1.8rem; padding-right:0.5rem;}
#header .topbar .btnbox .top_my:after { display: inline-block; background: url(/resource/images/icon_newwin.svg) no-repeat 50% 50%; width: 30px; height: 1.8rem; background-size: 14px auto; vertical-align: middle; content: ''; }
#header .topbar .btnbox .top_my span { display: inline-block; vertical-align: middle; }

#header .topbar .inner_flex { display: flex; justify-content: space-between; align-items: center; }
#header .topbar .btn_r_box { display: flex; align-items: center;  flex-wrap: nowrap; height: 8rem; vertical-align: middle;}
#header .topbar .btn_r_box a + a { margin-left: 1rem; }
#header .topbar .btn_r_box a { display: flex; padding: 0 1.4rem 0 2rem; line-height: 5.4rem; font-size: 1.8rem; font-weight: 500; justify-content: center; box-sizing: border-box; border-radius: 0.8rem; }
#header .topbar .enrolment { background: #D91B1B;  }
#header .topbar .enrolment span:after { content: ''; display: inline-block; background: url(/resource/images/icon_arrow_w_right.svg) no-repeat 50% 50%; width: 2rem; height: 1.4rem; margin-left: 0.5rem; }
#header .topbar .edu_mypage { background: #555; padding: 0 1.5rem 0 !important; font-size: 1.7rem !important; }
#header .topbar .edu_mypage span:after { content: ''; display: inline-block; background: url(/resource/images/icon_newwin.svg) no-repeat 50% 50%; width: 2rem; height: 1.4rem; margin-left: 0.5rem;}

#header .topbar .submenuwrap{display: none; position: absolute; bottom: -34rem; left: 0; width: 118rem; height: 34rem; padding: 5rem 5rem 10rem 14rem; background: rgba(45,45,45,9.7); box-sizing: border-box; z-index: 9;}
#header .topbar .submenuwrap .submbox{display: inline-block; margin-right: 4.4rem;}
#header .topbar .submenuwrap .submbox em{display: block; font-size: 2rem; font-weight: 400; padding-bottom: 2.2rem;}
#header .topbar .submenuwrap .mosubmenu{display: inline-block; margin-right: 6.6rem; border-left: 0.1rem solid #505050; padding-left: 1.2rem;}
#header .topbar .submenuwrap .mosubmenu.myp{display: inline-block; width: 46rem; margin-right: 0;}
#header .topbar .submenuwrap .mosubmenu.myp a{display: inline-block; width: 22rem;}
#header .topbar .submenuwrap .mosubmenu a{display: block; font-size: 1.4rem; padding: 0.7rem 0;}
#header .topbar .submenuwrap .mosubmenu a:first-child{padding-top: 0;}
#header .topbar .submenuwrap .mosubmenu a:last-child{padding-bottom: 0;}
#header .topbar .submenuwrap .mosubmenu a span:after{content: ''; display: inline-block; background: url(/resource/images/icon_newwin.svg) no-repeat 50%; width: 1rem; height: 1rem; margin-left: 0.8rem;}
#header .topbar .submenuwrap .sub_close{position: absolute; top: 0; right: 0.1rem; background: url(/resource/images/icon_close_w.svg) no-repeat 50%; width: 4.4rem; height: 4.4rem; border: 0.1rem solid #fff;}

#header .current_page{font-size: 0; background: #1C85B4;}
#header .current_page a{display: inline-block; width: 50%; height: 6rem; line-height: 6rem; font-size: 3rem; font-weight: 600;  font-family: 'NotoSansKR'; text-align: center; letter-spacing: -0.15rem;}
#header .current_page a em:after{content: ''; display: inline-block; background: url(/resource/images/icon_smenu_arrow.svg) no-repeat 50%; width: 1rem; height: 2.1rem; margin-left: 2rem;}
#header .current_page a.submenu01{background: rgb(217,27,27); background: linear-gradient(286deg, rgba(217,27,27,1) 0%, rgba(139,65,242,1) 100%); border-radius: 0 0 1rem 1rem;}
#header .current_page a.submenu02{background: rgb(0,65,64); background: linear-gradient(135deg, rgba(0,65,64,1) 0%, rgba(139,65,242,1) 100%); border-radius: 0 0 1rem 1rem;}
#header .current_page a span{color: #FFE145;}
/* HEADER : END */


/* MAIN : START */
#main .identity_ar{background: #b4b4b4; margin-top: 6rem;}
#main .identity_ar .cont-sp{position: relative; width: 118rem; height: 30rem;}
#main .identity_ar .cont-sp .banner{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 68rem;}
#main .identity_ar .cont-sp .banner img{width: 100%;}
#main .identity_ar .main_mpwrap {position: relative; width: 100%; min-width: 1180px; height: 329px; /*background: url(/resource/images/main_bg_250206.jpg) no-repeat 50%; */background: #1C85B4;  overflow:hidden; }
/* #main .identity_ar .main_mp {position: absolute; left: 0; width: 100%; height: 100%;} */
#main .identity_ar .main_mp { position: relative; left: 0; width: 100%; height: 100%;}
#main .identity_ar .main_mp .mask-left { position: absolute; left: 50%; transform: translateX(-610px); top: 0; bottom: 0; content: ''; width: 40px; height: 329px; background: linear-gradient(90deg, #1C85B4 40%, rgba(28, 133, 180, 0.00) 100%); }
#main .identity_ar .main_mp .mask-right { position: absolute; left: 50%; transform: translateX(556px); top: 0; bottom: 0; content: ''; width: 40px; height: 329px; background: linear-gradient(90deg,rgba(28, 133, 180, 0.00) 40%, #1C85B4 100% ); }


#main .cont_area .lecwrap,
#main .cont_area .contboxwrap,
#main .cont_area .youtubewrap,
#main .cont_area .livewrap,
#main .cont_area .consultwrap{font-size: 0; font-family: 'NotoSansKR'; margin-bottom: 12rem;}

#main .cont_area .tit_ar{position: relative; margin: 6rem 0;}
#main .cont_area .tit_ar .barbg_gray{display: block; width: 100%; height: 0.8rem; background: #E7E7E8; margin: 2.1rem 0 1.7rem;}
#main .cont_area .tit_ar .title{position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); font-size: 4rem; font-family: 'GmarketSans'; background: #fff; padding: 0 2rem; text-align: center;}
#main .cont_area .youtubewrap .tit_ar .title{width: 66rem; margin-bottom: 8rem;}


#main .cont_area .rcm_lec .best_ar{position: relative; display: inline-block; width: 26rem; padding: 0 2.5rem; box-sizing: border-box; border-radius: 1rem;
background: rgb(83,109,254);
background: -moz-linear-gradient(280deg, rgba(83,109,254,1) 0%, rgba(139,65,242,1) 100%);
background: -webkit-linear-gradient(280deg, rgba(83,109,254,1) 0%, rgba(139,65,242,1) 100%);
background: linear-gradient(280deg, rgba(83,109,254,1) 0%, rgba(139,65,242,1) 100%);}
#main .cont_area .rcm_lec .best_ar .best_num{position: absolute; top: 2.2rem; left: 50%; transform: translateX(-50%); width: 15rem; font-size: 2.2rem; font-weight: 500; color: #fff; text-align: center;}
#main .cont_area .rcm_lec .best_ar .tbox,
#main .cont_area .rcm_lec .best_ar .tbox .subtxt,
#main .cont_area .rcm_lec .best_ar .tbox .teachers{color: #fff;}

#main .cont_area .rcm_lec .other_lec{display: block; width: 118rem;}
#main .cont_area .rcm_lec .other_lec .lecbtn_list{display: block; font-size: 0; padding-bottom: 1rem; text-align:center;}
#main .cont_area .rcm_lec .other_lec .lecbtn_list .tabbtn{display: inline-block; padding: 0.75rem 3.15rem; color: #B1B1B1; font-family: 'NotoSansKR'; font-size: 2.2rem; font-weight: 500; border-radius: 1rem; border: 0.2rem solid #b1b1b1; box-sizing: border-box;}
#main .cont_area .rcm_lec .other_lec .lecbtn_list .tabbtn + .tabbtn{margin-left: 1.85rem;}
#main .cont_area .rcm_lec .other_lec .lecbtn_list .tabbtn.on{background: #1B1D1C; color: #fff;  border: 0.2rem solid transparent;}

#main .cont_area .rcm_lec .pointwrap {display: block; background: #f6f6f6; border-top: 0.1rem solid #b1b1b1; border-bottom: 0.1rem solid #b1b1b1; font-size: 0; font-weight: 400; margin-bottom: 1.5rem; box-sizing: border-box;}
#main .cont_area .rcm_lec .pointwrap button.pbox{display: inline-block; width: 25%; text-align: center; font-size: 1.8rem; height: 4rem; line-height: 4.4rem; color: #979797; box-sizing: border-box;}
#main .cont_area .rcm_lec .pointwrap button.pbox.on,
#main .cont_area .rcm_lec .pointwrap button.pbox:hover{background: #505050; color: #fff; font-weight: 500;}

#main .cont_area .rcm_lec .photo{position: relative; width: 22.8rem; border-radius: 8px; overflow: hidden;}
#main .cont_area .rcm_lec .best_ar .photo{margin-top: 7.2rem;}
#main .cont_area .rcm_lec .photo .gray-screen{position: absolute; width: 22.8rem; height: calc(100%); border-radius: 8px; background: rgba(0,0,0,0.3);}
#main .cont_area .rcm_lec .photo .gray-screen .end-mark{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background: url(/resource/images/end_mark.png) no-repeat 50%; width: 96px; height: 58px;}
#main .cont_area .rcm_lec .photo img{width: 100%;}

#main .cont_area .class-list{font-size: 0; text-align: left;}
#main .cont_area .class-list li{display: inline-block; margin: 0 10px 15px 0; width: 22.8rem; text-align: left; border-radius: 10px;}
#main .cont_area .class-list li:nth-child(5n){margin: 0 0 15px 0;}
#main .cont_area .rcm_lec .tbox{min-height: 135px; padding: 20px 10px; box-sizing: border-box; letter-spacing: -0.1rem;}
#main .cont_area .rcm_lec .tbox .class{font-size: 1.8rem; font-weight: 500; vertical-align: middle;}
#main .cont_area .rcm_lec .tbox .subtxt{font-size: 1.3rem; font-weight: 300; color: #979797;display: block; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;} 
#main .cont_area .rcm_lec .tbox .teachers{font-size: 1.4rem; font-family: 'NotoSansKR'; color: #1A1A1A; margin: 2px 0 8px;}
#main .cont_area .rcm_lec .tbox .mark{font-family: 'NotoSansKR'; font-size: 12px; font-weight: 400; padding-bottom: 0.6rem;}
#main .cont_area .rcm_lec .tbox .mark span{display: inline-block; background: #fff; color: #1B1D1C; border: 1px solid #1B1D1C; padding: 1px 9px; box-sizing: border-box; margin-bottom: 2px; margin-right: 3px;}
#main .cont_area .rcm_lec .tbox .mark .media_01{background: #EB018C; color: #fff; border: 1px solid #EB018C;}
#main .cont_area .rcm_lec .tbox .mark .media_02{background: #EE0808; color: #fff; border: 1px solid #EE0808;}
#main .cont_area .rcm_lec .tbox .mark .media_03{background: #0166EB; color: #fff; border: 1px solid #0166EB;}
#main .cont_area .rcm_lec .tbox .mark .media_10{background: #ffd819; color: #000; border: 1px solid #ffd819;} /* ����??????(??????) */
#main .cont_area .rcm_lec .tbox .mark .media_11{background: #5882f7; color: #fff; border: 1px solid #4a72e3;} /* ����??????(����) */
#main .cont_area .rcm_lec .tbox .mark .media_12{background: #c7eb6e; color: #000; border: 1px solid #a4c948;} /* ����??????(??????) */
#main .cont_area .rcm_lec .tbox .mark .media_13{background: #fbbc05; color: #000; border: 1px solid #fbbc05;} /* ����??????(??????) */

#main .cont_area .rcm_lec .photo .best{position: absolute; bottom: 10px; left: 10px; width: 4rem; height: 4rem; text-align: center; border-radius: 50%; background: #4B00FC; color: #fff; font-size: 12px; font-weight: 500; border: 0; padding: 12px 0 17px 2px; box-sizing: border-box;}
#main .cont_area .rcm_lec .photo .best1{position: absolute; bottom: 10px; left: 10px; width: 4rem; height: 4rem; text-align: center; border-radius: 50%; color: #fff; font-size: 12px; font-weight: 500; border: 0; padding: 19px 0 17px 2px; box-sizing: border-box; background: #DBA300 url(/resource/images/icon_best1.svg) no-repeat 50% 20%; background-size:20px 16px;}
#main .cont_area .rcm_lec .tbox .mark .media_04{background: #747474; color: #fff; border: 1px solid #747474;}
#main .cont_area .rcm_lec .tbox .title{font-size: 14px; font-weight: 500;s}
#main .cont_area .rcm_lec .tbox .title .end{display: inline-block; color: #979797; vertical-align: middle;}
#main .cont_area .rcm_lec .tbox .title .ending{display: inline-block; color: #EA1821; vertical-align: middle;}
#main .cont_area .rcm_lec .tbox .title .ending:before{content: ''; display: inline-block; background: url(/resource/images/icon_timer.svg) no-repeat 50%; width: 16px; height: 19px; margin: -5px 5px 0 0; vertical-align: middle;}
#main .cont_area .rcm_lec .best_ar .tbox .end{color: #fff;}
#main .cont_area .lec_allview{text-align: center; margin-top: 2rem;}
#main .cont_area .lec_allview .btn{display: inline-block; font-family: 'NotoSansKR'; width: 28rem; height: 7rem; line-height: 7rem; color: #fff; background: #1B1D1C; font-size: 2.2rem; font-weight: 400;}
 
#main .cont_area .contbox{display: inline-block; width: 38.6rem; vertical-align: top;}
#main .cont_area .contbox + .contbox{margin-left: 1.1rem;}
#main .cont_area .contbox .imgbox{display: inline-block; width: 38.6rem; height: 21.7rem; border-radius: 1rem; overflow: hidden;}
#main .cont_area .contbox .imgbox img{width: 100%;}
#main .cont_area .contbox .m_copy{font-size: 1.8rem; color: #1B1D1C; font-weight: 600; padding: 1rem 0 0.3rem;}
#main .cont_area .contbox .s_copy{font-size: 1.3rem; color: #979797; font-weight: 400;}

#main .cont_area .livewrap .livetxt{position: relative; letter-spacing: -0.1rem; padding: 5rem 7rem 6rem; background: #F6F6F6;}
#main .cont_area .livewrap .livetxt p{font-size: 2rem; font-weight: 500; padding-bottom: 0.5rem;}
#main .cont_area .livewrap .livetxt span{font-size: 1.5rem; font-weight: 500; color: #979797;}
#main .cont_area .livewrap .livetxt .btn{position: absolute; top: 50%; right: 7rem; transform: translateY(-50%); display: inline-block; width: 28rem; height: 7rem; line-height: 7rem; text-align: center; background: #1B1D1C; color: #fff; font-size: 2.2rem; font-weight: 500;}

#main .consultwrap .cs-center{position: relative; right: 0; margin-top: 0; text-align: left; font-weight: 500; font-size: 2rem; background: #F6F6F6; padding: 5rem 7rem; box-sizing: border-box; letter-spacing: -0.1rem;}
#main .consultwrap .cs-center .txt{display: block; width: 100%; line-height: 32px; text-align: center;}
#main .consultwrap .cs-center .timetb{text-align: center; font-size: 1.5rem; font-weight: 400; font-family: 'NotoSansKR'; vertical-align: middle; color: #979797; padding-top: 0.8rem;}
#main .consultwrap .cs-center .cs-btn{position: relative; display: block; width: 32.4rem; height: 7rem; line-height: 7rem; margin: 0 auto; font-family: 'NotoSansKR'; font-size: 2.2rem; font-weight: 500; color: #fff; background: #1B1D1C; margin-top: 4rem;}
#main .consultwrap .cs-center .cs-btn:after{content: ''; display: inline-block; background: url(/resource/images/icon_newwin.svg) no-repeat 50%; width: 1.6rem; height: 1.6rem; background-size: cover; margin-left: 1rem;}
#main .consultwrap .cs-center .tel_area{border-top: 1px solid #707070; border-bottom: 1px solid #707070; font-size: 1.5rem; font-weight: 500; font-family: 'NotoSansKR'; margin-top: 3rem;}
#main .consultwrap .cs-center .tel_area li{float: left; width: 33.3%; text-align: center; height: 4.6rem; line-height: 4.6rem; text-align: left; padding-left: 5rem; box-sizing: border-box;}
#main .consultwrap .cs-center .tel_area li span{display: inline-block; width: 100px;}
#main .consultwrap .cs-center .tel_area li span:before{content: ''; display: inline-block; width: 4px; height: 4px; background: #1B1D1C; margin: 0 1rem .5rem 0;}
#main .consultwrap .cs-center .tel_area li .tel_stxt{display:inline-block;}
#main .consultwrap .cs-center .tel_area li{border-bottom: 1px dashed #ccc;}
#main .consultwrap .cs-center .tel_area li:nth-child(10){border-bottom: 0;}
#main .consultwrap .cs-center .tel_area li:nth-child(11){ width: 66%; border-bottom: 0;}
/* MAIN : END */


#main{position: relative;}
#main .line-banner{position: fixed; width: 100%; height: 90px; line-height: 95px; background: #FFEA2A; font-size: 2rem; font-weight: 500; text-align: center; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.2); z-index:100;}
#main .line-banner em{font-size: 3rem; font-weight: 700; padding-left: 20px;}

#main .identity{height: 58rem; overflow: hidden; background: #1B1D1C; box-sizing: border-box;}
#main .identity .cont-sp{position: relative;}
#main .identity .teachers_introduce{position: relative;}
#main .identity .id_img{float: right; position:relative;}
#main .identity .id_txt{position:absolute; bottom:150px; left: 50%; transform: translateX(-50%); -ms-transform: translateX(-50%); -webkit-transform: translateX(-50%); font-size:40px; font-weight:600; color:#fff; text-shadow:0 0 5px rgba(0, 0, 0, 0.8);}
#main .identity .top_copy{float: left; width: 600px; padding-top: 6.8rem;}
#main .identity .top_copy .wrcon{display: inline-block; text-align: center; font-family: 'NotoSansKR'; font-weight: 500; padding: 0.8rem 2rem; box-sizing: border-box; margin-bottom: 1.7rem;}
#main .identity .top_copy .wrcon.ing{color: #ffffff; border: 0.1rem solid #ffffff;}
#main .identity .top_copy .wrcon.soon{color: #F44336; border: 0.1rem solid #F44336;}
#main .identity .top_copy .wrcon.end{color: #747474; border: 0.1rem solid #747474;}
#main .identity .top_copy .title{font-size: 4rem; line-height: 52px; font-weight: 700; color: #fff; padding-bottom: 18px;}
#main .identity .top_copy .title span{display: block;}
#main .identity .top_copy .title em{color: #EA1821;}
#main .identity .top_copy .scopy{font-size: 1.8rem; line-height: 28px; font-weight: 500; color: #B1B1B1; padding-bottom: 40px;}
#main .identity .top_copy .scopy span{display: block;}
#main .identity .top_copy .scopy_point { padding: 0 0 40px 0; font-size: 21px; line-height: 1.5; color: #fff; font-weight: 500; }
#main .identity .top_copy .scopy_point p { font-size: 25px; font-weight: 700; }
#main .identity .myoutube{position: absolute; bottom: 4rem; left: 0; width: 38rem; height: 21.4rem;}
#main .identity .otherlink{position: absolute; top: 54%; right: -13rem; transform: translateY(-50%); border-radius: 1.6rem; padding: 0 1rem; text-align: center; background: #fff;}
#main .identity .otherlink .twlk{position: relative; display: table; width: 10rem; height: 8rem; vertical-align: middle; font-size: 1.3rem; font-weight: 600; padding-top: 3rem; box-sizing: border-box;}
#main .identity .otherlink .twlk + .twlk{border-top: 0.1rem solid #D9D9D9;}
#main .identity .otherlink .twlk span{vertical-align: middle; text-align: center;}
#main .identity .otherlink .twlk .buyinfo:before{content: ''; position: absolute; top: 1.5rem; left: 50%; transform: translateX(-50%); background: url(/resource/images/icon_books.svg) no-repeat 50%; width: 2.4rem; height: 1.8rem;}
#main .identity .otherlink .twlk .fshare:before{content: ''; position: absolute; top: 1.5rem; left: 50%; transform: translateX(-50%); background: url(/resource/images/icon_share.svg) no-repeat 50%; width: 1.8rem; height: 2rem;}
#main .identity .otherlink .twlk .kakao:before{content: ''; position: absolute; top: 1.5rem; left: 50%; transform: translateX(-50%); background: url(/resource/images/icon_kakao.svg) no-repeat 50%; width: 2rem; height: 1.8rem;}
#main .identity .otherlink .twlk .youtube:before{content: ''; position: absolute; top: 1.5rem; left: 50%; transform: translateX(-50%); background: url(/resource/images/icon_youtube.svg) no-repeat 50%; width: 2.6rem; height: 1.8rem;}


#main .identity .sharewrap{display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.7); z-index: 9;}
#main .identity .sharewrap .popup{position: relative; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); background: #fff; border: 0.1rem solid #000; box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); padding: 3rem 3.5rem 5.5rem; text-align: center;}
#main .identity .sharewrap .popup em{display: block; font-size: 1.8rem; font-weight: 700; padding-bottom: 2rem;}
#main .identity .sharewrap .popup a{position: relative; display: inline-block; margin-right: 3rem; font-family: 'NotoSansKR'; font-size: 1.4rem; font-weight: 400;}
#main .identity .sharewrap .popup a:last-child{margin-right: 0;}
#main .identity .sharewrap .popup .icon_kakao{width: 4rem; height: 4rem; background: url(/resource/images/icon_share_kakao.svg) no-repeat 50%;}
#main .identity .sharewrap .popup .icon_facebook{width: 4rem; height: 4rem; background: url(/resource/images/icon_share_facebook.svg) no-repeat 50%;}
#main .identity .sharewrap .popup .icon_twitter{width: 4rem; height: 4rem; background: url(/resource/images/icon_share_twitter.svg) no-repeat 50%;}
#main .identity .sharewrap .popup .icon_url{width: 4rem; height: 4rem; background: url(/resource/images/icon_share_url.svg) no-repeat 50%;}
#main .identity .sharewrap .popup a span{position: absolute; bottom: -2.8rem; left: 50%; transform: translateX(-50%);}
#main .identity .sharewrap .popup .clbtn{position: absolute; top: 1.5rem; right: 1.5rem; background: url(/resource/images/icon_pop_close.svg) no-repeat 50%; width: 1.8rem; height: 1.8rem;}


#main .lecinfowrap{font-family: 'NotoSansKR';}
#main .tabarea.fixed2 {position:fixed; top:6rem; width: 100%; background: #fff; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.2); z-index:8;}
#main .tabarea{position:absolute; top:58rem; width: 100%; border-bottom: 0.1rem solid #1B1D1C;}
#main .tabarea .cont-sp{display: table; padding-top: 2rem;}
#main .tabarea .cont-sp a{display: table-cell; width: 25%; text-align: center; height: 5rem; background: #E7E7E8; color: #7A7A7A; font-weight: 500; vertical-align: middle;}
#main .tabarea .cont-sp a.on{background: #1B1D1C; color: #fff;}
#main .tabarea .cont-sp a + a{border-left: 0.1rem solid #fff;}

#main .lecinfowrap .lecpick{padding-top: 9rem;}
#main .lecinfowrap .lecpick .dvtable tr + tr{border-top: 0.1rem solid #ddd;}
#main .lecinfowrap .lecpick .dvtable{border-top: 0.1rem solid #1B1D1C; border-bottom: 0.1rem solid #1B1D1C;}
#main .lecinfowrap .lecpick .dvtable th{width: 16rem; height: 6rem; vertical-align: middle; padding-left: 2rem; color: #505050;font-weight: 500; background: #E7E7E8; text-align: left; box-sizing: border-box;}
#main .lecinfowrap .lecpick .dvtable td{width: 102rem; vertical-align: middle; padding-left: 2rem; color: #505050; text-align: left;;}
#main .lecinfowrap .lecpick .dvtable button{position: relative; display: inline-block; min-width: 10rem; height: 4.3rem; border: 0.1rem solid #B1B1B1; border-radius: 0.2rem; color: #1B1D1C; font-family: 'NotoSansKR'; font-weight: 600; padding: 0 1rem; box-sizing: border-box;}
#main .lecinfowrap .lecpick .dvtable button.on{background: #1B1D1C; color: #fff; font-weight: 500;}
#main .lecinfowrap .lecpick .dvtable button + button{margin-left: 0.3rem;}
#main .lecinfowrap .lecpick .dvtable button.end_mk{color: #D9D9D9; border: 0.1rem solid #D9D9D9; cursor: unset}
#main .lecinfowrap .lecpick .dvtable button.end_mk span{position: absolute; top: -1.5rem; left: 50%; transform: translateX(-50%); font-size: 1.1rem; font-weight: 700; color: #D91B1B; border: 0.1rem solid #D91B1B; border-radius: 1.5rem; padding: 0.2rem 1rem; background: #fff;}


#main .lecinfowrap .lecpick select {width: 20rem; height: 4.3rem; padding: 0 5% 0 1.5rem; background: url(/resource/images/icon_arrow_down_g.svg) no-repeat 90% 50%; background-size: 2rem 1rem; vertical-align: middle; -webkit-appearance: none; -moz-appearance: none; appearance: none;
transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s; font-weight: 600;}

#main .lecinfowrap .leclist{margin-top: 3rem; border-bottom: 0.1rem solid #D9D9D9;}
#main .lecinfowrap .leclist li{position: relative; padding: 2rem 0; border-top: 0.1rem solid #D9D9D9; font-size: 0;}
#main .lecinfowrap .leclist li.app_end{filter: grayscale(1) opacity(0.5);}
#main .lecinfowrap .leclist .lecscore{display: inline-block; width: 14rem; padding: 0 1rem; text-align: center; box-sizing: border-box; vertical-align: middle;}
#main .lecinfowrap .leclist .lecscore em{display: block; font-size: 1.9rem; font-weight: 600; padding-bottom: 0.6rem; line-height: 2.2rem;}
#main .lecinfowrap .leclist .lecscore .monthb{display: inline-block; font-size: 1.2rem; width: 8.8rem; height: 2rem; line-height: 2rem; letter-spacing: 0;}
#main .lecinfowrap .leclist .lecscore .monthb.mark_bf{background: #FF9839; color: #fff;}
#main .lecinfowrap .leclist .lecscore .monthb.mark_af{background: #8b41f2; color: #fff;}
#main .lecinfowrap .leclist .lecscore .toeicmark{display: inline-block; font-size: 1.1rem; font-weight: 600; width: 8.8rem; height: 2rem; line-height: 1.8rem; color: #536dfe; border: 0.1rem solid #536dfe; box-sizing: border-box; margin-top: 0.2rem;}
#main .lecinfowrap .leclist .lecdetail{width: calc(100% - 14rem);  vertical-align: middle;}
#main .lecinfowrap .leclist .lecdetail,
#main .lecinfowrap .leclist .lecinfo,
#main .lecinfowrap .leclist .paywarp{display: inline-block;}
#main .lecinfowrap .leclist .lecinfo{width: 69rem; font-size: 1.6rem; font-weight: 500; padding-left: 1.2rem; box-sizing: border-box; vertical-align: middle;}
#main .lecinfowrap .leclist .paywarp{width: calc(100% - 69rem); text-align: right; padding-right: 1rem; box-sizing: border-box; vertical-align: middle;}
#main .lecinfowrap .leclist .lecinfo .infot{padding-bottom: 0.8rem;}
#main .lecinfowrap .leclist .lecinfo .day{font-weight: 600;}
#main .lecinfowrap .leclist .lecinfo .dview{display: inline-block; font-family: 'NotoSansKR'; font-size: 1.2rem; color: #7A7A7A; text-decoration: underline;}
#main .lecinfowrap .leclist .lecinfo .time:before,
#main .lecinfowrap .leclist .lecinfo .time:after{content: ''; display: inline-block; background: url(/resource/images/icon_spacebar.svg) no-repeat 50%; width: 0.1rem; height: 1.4rem; padding-right: 3.5rem; vertical-align: middle;}
#main .lecinfowrap .leclist .lecinfo .level:after{content: ''; display: inline-block; background: url(/resource/images/icon_spacebar.svg) no-repeat 50%; width: 0.1rem; height: 1.4rem; padding-right: 3.5rem; vertical-align: middle;}
#main .lecinfowrap .leclist .lecinfo .tname{font-size: 1.3rem;}
/* Ķ��??? POPUP - START */
.calendar-wrap {display: none; position: absolute; top: 0px; left: 0; z-index: 9;}
.calendar-wrap .calendar{position: absolute; top: 0; left: 0; width: 320px; max-height: 640px; border: 1px solid #3E3E3E; padding: 20px 20px 22px; box-sizing: border-box; background: #fff; font-family: 'NotoSansKR';
-webkit-box-shadow: 7px 7px 18px -4px rgba(0,0,0,0.2);
box-shadow: 4px 4px 18px -4px rgba(0,0,0,0.2);
}
.calendar-wrap .calendar .close-btn{position: absolute; bottom: -44px; left: -1px; width: 320px; height: 44px; border: 1px solid #3E3E3E; background: #000; background-size: 20px 20px; color: #fff; font-family: 'NotoSansKR'; font-size: 1.6rem; font-weight: 400;}
.calendar-wrap .calendar .month{float: left; font-size: 2.2rem; font-weight: 600; color: #1B1D1C; padding-left: 10px;}

.calendar-wrap .calendar .gtxt{float: right; font-size: 1.2rem; font-weight: 400; color: #979797; padding: 15px 10px 0 0;}
.calendar-wrap .calendar .gtxt1{position: relative; margin-right: 5px;}
.calendar-wrap .calendar .gtxt1:before{content: ''; display: inline-block; position: absolute; top: -10px; left: 50%; transform: translateX(-50%); width: 8px; height: 8px; border-radius: 50%; background: #8B41F2;}
.calendar-wrap .calendar .gtxt2{position: relative;}
.calendar-wrap .calendar .gtxt2:before{content: ''; display: inline-block; position: absolute; top: -10px; left: 50%; transform: translateX(-50%); width: 8px; height: 8px; border-radius: 50%; background: #B1B1B1;}
.calendar-wrap .calendar table{margin-top: 25px; width: 100%;}
.calendar-wrap .calendar table th{color: #A0A0A0; font-size: 1rem; text-align: center; font-weight: 500;padding-bottom: 15px;}

.calendar-wrap .calendar table td{text-align: center; width: 36px; height: 36px; line-height: 36px; font-weight: 700; font-size: 1.3rem; vertical-align: middle;}
.calendar-wrap .calendar table td span{display: inline-block; width: 36px; height: 36px; border-radius: 40px; margin-bottom: 3px;}
.calendar-wrap .calendar table .off{color: #CFCFCF;}
.calendar-wrap .calendar table .class-day{background: #ECECEC;}
.calendar-wrap .calendar table .start-date{color: #fff; background: #8B41F2;}
/* Ķ��??? POPUP - END */

#main .lecinfowrap .leclist .paywarp .paycount{display: inline-block; vertical-align: middle; font-size: 1.6rem;}
#main .lecinfowrap .leclist .paywarp .dcr{color: #D91B1B; font-weight: 600;}
#main .lecinfowrap .leclist .paywarp .orwon{display: inline-block; color: #979797; text-decoration: line-through; margin-left: 1.4rem;}
#main .lecinfowrap .leclist .paywarp .paytxt{display: block; font-size: 2.2rem; font-weight: 700; text-align: right;}
#main .lecinfowrap .leclist .paywarp .lecapply{display: inline-block; margin-left: 2rem; vertical-align: middle;}
#main .lecinfowrap .leclist .paywarp .lecapply .cartbtn{display: inline-block; width: 5rem; height: 5rem; border-radius: 0.2rem; border: 0.1rem solid #707070; background: url(/resource/images/icon_cart.svg) no-repeat 50%; background-size: 2.4rem 2.1rem; vertical-align: middle;}
#main .lecinfowrap .leclist .paywarp .lecapply .apbtn{display: inline-block; width: 13rem; height: 5rem; border-radius: 0.2rem; background: #D91B1B; font-size: 1.7rem; font-weight: 500; color: #fff; text-align: center; line-height: 5rem; margin-left: 0.5rem; vertical-align: middle;}
#main .lecinfowrap .leclist .app_end .paywarp .lecapply .cartbtn,
#main .lecinfowrap .leclist .app_end .paywarp .lecapply .apbtn{cursor:unset;}

#main .lecinfowrap .lec-blank{font-size: 2rem; font-weight: 600; text-align: center; padding: 10rem 0 0;}

#main .contwrap .cont-review{text-align: center;}
#main .contwrap .cont-review img{max-width: 100%;}


#main .contwrap{padding-top: 130px;}
#main .teacher_int{padding-top: 130px;}
#main .teacher_int .pfwrap{position: relative; font-family: 'NotoSansKR'; font-weight: 400; color: #7A7A7A; margin-top: 6rem; padding-bottom: 6rem; border-bottom: 0.1rem solid #ddd;}
#main .teacher_int .pfwrap:last-child{border-bottom: 0;}
#main .teacher_int .pfwrap .tbox{margin-left: 42rem;}
#main .teacher_int .pfwrap .tbox .photo{position: absolute; top: 0; left: 0; width: 38rem;}
#main .teacher_int .pfwrap .tbox .photo img{max-width: 100%;}
#main .teacher_int .pfwrap .tbox .profile em{display: block; font-size: 2.4rem; font-weight: 600; padding-bottom: 1.5rem; color: #1B1D1C;}
#main .teacher_int .pfwrap .tbox .profile p{line-height: 2.2rem; font-size: 1.5rem; border-bottom: 0.1rem solid #ddd; padding-bottom: 2rem; margin-bottom: 2rem;}
#main .teacher_int .pfwrap .tbox.int02 em{display: block; font-size: 1.7rem; font-weight: 600; padding-bottom: 1rem; color: #1B1D1C;}
#main .teacher_int .pfwrap .tbox.int02 p{font-size: 1.4rem; line-height: 2.6rem;}
#main .teacher_int .pfwrap .tbox.int02 img{max-width: 75rem;}

/* ?????????���� : START */
#main .moviewrap .title{font-size: 4rem; line-height: 60px; font-weight: 700; padding: 10rem 0 4rem; text-align: center;}
#main .moviewrap .textbox{font-family: 'NotoSansKR'; text-align: left; margin: 1.5rem 0 20rem;}
#main .moviewrap .m_copy{font-size: 2.4rem; color: #1B1D1C; font-weight: 600; padding: 1rem 0;}
#main .moviewrap .s_copy{font-size: 1.8rem; color: #979797; font-weight: 400;}
/* ?????????���� : END */

/* �Ҷ�??? ?????? : START */
#main .introduce{font-family: 'NotoSansKR';}
#main .introduce .fc_red{color: #f04932;}
#main .introduce .fttxt{font-size: 2rem; text-align: center; padding: 6rem 0 1rem; font-weight: 600;}
#main .introduce .title{font-size: 4rem; font-weight: 700; padding: 10rem 0 2rem; text-align: center; font-family: 'GmarketSans';}
#main .introduce .subcopy{font-size: 2rem; font-weight: 500; padding: 0 0 7rem; text-align: center; letter-spacing: -0.07rem;}
#main .introduce .illust{text-align: center; padding-bottom: 8rem;}
#main .introduce .illust li{display: inline-block; width: 19.6rem;}
#main .int_visual{width: 100%; background: #1B1D1C url(/resource/images/int_visual_pc.jpg) no-repeat 50%; color: #fff; text-align: center;}
#main .int_visual .cont-sp{position: relative; height: 76rem;}
#main .int_visual .toptxt{font-size: 2rem; font-weight: 500; padding-top: 6rem;}
#main .int_visual .bttxt{position: absolute; left: 50%; bottom: 8rem; transform: translateX(-50%); font-size: 2.1rem; font-weight: 400; white-space:nowrap;}
#main .int_issue2{background: #F5F5F5; letter-spacing: -0.1rem;}
#main .int_issue2 .title,
#main .int_issue3 .title,
#main .int_issue4 .title,
#main .int_issue5 .title{font-size: 4rem; padding: 0 0 4rem; font-weight: 700;}
#main .int_issue2 .cardwrap{font-size: 0; }
#main .int_issue2 .cardwrap li{display: inline-block; width: 38rem; height: 64rem; padding: 4.5rem 4rem 6rem; box-sizing: border-box; -webkit-box-shadow: 0px 5px 11px 5px rgba(0,0,0,0.07); 
    box-shadow: 0px 8px 11px 3px rgba(0,0,0,0.07); background: #fff;}
#main .int_issue2 .cardwrap li + li{margin-left: 2rem;}
#main .int_issue2 .cardwrap li em{display: block; font-size: 1.8rem; padding: 2rem 0 1rem; font-weight: 600;}
#main .int_issue2 .cardwrap li p{font-size: 1.5rem; line-height: 2.6rem; font-weight: 500; padding-bottom: 2rem;}
#main .int_issue2 .cardwrap li .date{font-size: 1.5rem; color: #979797;}
#main .int_issue2 .btmtxt{text-align: center; padding: 6rem 0 7.7rem;}
#main .int_issue2 .btmtxt span{display: inline-block; width: 52rem; font-size: 2rem; font-weight: 500;}

#main .int_issue3 .cont-sp{padding-bottom: 8rem;}
#main .int_issue3 .exbox{padding-bottom: 60px;}
#main .int_issue3 .exbox:last-child{padding-bottom: 0;}
#main .int_issue3 .fl-l .graybox{float: left;}
#main .int_issue3 .fl-l .tbox{float: right; text-align: left; padding: 95px 200px 0 0;}
#main .int_issue3 .fl-r .graybox{float: right;}
#main .int_issue3 .fl-r .tbox{float: left; text-align: right; padding: 95px 0 0 11s0px;}
#main .int_issue3 .graybox{display: inline-block; width: 585px; line-height: 339px; background: #F6F6F6; border-radius: 0.8rem; text-align: center;}
#main .int_issue3 .tbox .tt{display: inline-block; font-size: 2.2rem; font-weight: 700; color: #1A1A1A;}
#main .int_issue3 .tbox .st{font-size: 2rem; color: #505050; font-family: 'NotoSansKR'; padding-top: 10px;}
#main .int_issue3 .tbox .st span{display: block;}

#main .int_issue4{background: #EBE2D9;} 
#main .int_issue4 .cont-sp{position: relative; background: url(/resource/images/int_moneyimg.png) no-repeat 50% 58%; height: 65rem;}
#main .int_issue4 .copyrt{position: absolute; bottom: 6rem; left: 50%; transform: translateX(-50%); white-space: nowrap;}
#main .int_issue4 .copyrt li{display: inline-block; vertical-align: middle; background: url(/resource/images/text_sp_bar.svg) no-repeat 0 50%; background-size: 0.2rem 4rem; padding: 0 5rem; font-size: 2rem; font-weight: 600; text-align: center;}
#main .int_issue4 .copyrt li:first-child{background: none;}
#main .int_issue4 .copyrt li span{display: block;}

#main .int_issue5{background: #F5F5F5;}
#main .int_issue5 .cont-sp{position: relative; background: url(/resource/images/int_illustmen.png) no-repeat 50% 100%; height: 86rem;}
#main .int_issue5 .bodycopy{text-align: center; font-size: 2rem; font-weight: 400;}
#main .int_issue5 .balloon{width: 15rem; height: 13.8rem; border-radius: 50%; color: #fff; font-size: 1.6rem; line-height: 2.6rem; text-align: center; padding-top: 4rem; box-sizing: border-box;} 
#main .int_issue5 .balloon.pink{position: absolute; top: 40%; left: 7rem; background: #DD989A;}
#main .int_issue5 .balloon.green{position: absolute; top: 40%; right: 7rem; background: #8EA9A8;}

#main .movie_area{background: #1B1D1C; padding: 10rem 0;}

/* �Ҷ�??? ?????? : END */


.neon {
 color: #FB4264;
 font-size: 29px;
 line-height: 42px;
 text-shadow: 0 0 10px #F40A35;
}

.flux { display: inline-block;
 color: #426DFB;
 font-size: 25px;
 line-height: 3a5px;
 text-shadow: 0 0 1vw #2356FF;
}

.neon {
 animation: neon 4s ease infinite;
 -moz-animation: neon 4s ease infinite;
 -webkit-animation: neon 4s ease infinite;
 -o-animation: flux 4s linear infinite;
}

@keyframes neon {
 0%,
 100% {
 text-shadow: 0 0 5px #fa166c, 0 0 15px #c20d51, 0 0 10px #fa166c, 0 0 10px #873252, 0 0 4px #fe5528, 1px 1px 1px #802d14;
 color: #f55a5a; font-weight: 700;
 }
 50% {
 text-shadow: 0 0 5px #420d27, 0 0 15px #420d27, 0 0 50px #420d27, 0 0 50px #420d27, 0 0 2px #420d27, 3px 3px 1px #40170a;
 color: #f55a5a; /*?????????���� ??? ?????? */
 }
}
/*
@keyframes neon {
 0%,
 100% {
 text-shadow: 0 0 1vw #FA1C16, 0 0 3vw #FA1C16, 0 0 5vw #FA1C16, 0 0 10vw #FA1C16, 0 0 .4vw #FED128, .3vw .3vw .1vw #806914;
 color: #FED128;
 }
 50% {
 text-shadow: 0 0 .5vw #800E0B, 0 0 1.5vw #800E0B, 0 0 5vw #800E0B, 0 0 5vw #800E0B, 0 0 .2vw #800E0B, .3vw .3vw .1vw #40340A;
 color: #806914;
 }
}
*/

.flux {
 animation: flux 4s linear infinite;
 -moz-animation: flux 4s linear infinite;
 -webkit-animation: flux 4s linear infinite;
 -o-animation: flux 4s linear infinite;
}

@keyframes flux {
 0%,
 100% {
 text-shadow: 0 0 1vw #c0c0c0, 0 0 3vw #c0c0c0, 0 0 10vw #c0c0c0, 0 0 5vw #c0c0c0, 0 0 .4vw #ffeecc, .5vw .5vw .1vw #3d4647;
 color: #fef6d7;
 }
 50% {
 text-shadow: 0 0 .5vw #082180, 0 0 1.5vw #082180, 0 0 5vw #082180, 0 0 2vw #082180, 0 0 .2vw #082180, .5vw .5vw .1vw #0A3940;
 color: #146C80;
 }
}



#teacherBanner .scroll{display: inline-block; padding-bottom: 30px}
#teacherBanner .teacher_box{display: inline-block; font-size: 0; width: 396px;}
#teacherBanner .teacher_box .tea-thumb{position: relative; display: inline-block; width: 122px; height: 122px; border-radius: 15px; margin: 0 10px 10px 0; opacity: 0.5; filter: alpha(opacity = 50); border-radius: 16px; overflow: hidden; }
#teacherBanner .teacher_box .tea-thumb:hover{opacity: 1; filter: alpha(opacity = 10 0);}
#teacherBanner .teacher_box .tea-thumb.s2{width: 254px; height: 122px;}
#teacherBanner .teacher_box .tit{position: absolute; top: 86%; left: 50%; transform: translate(-50%, -50%); font-size: 1.6rem; font-weight: 600; color: #fff; box-sizing: border-box;}
#teacherBanner .teacher_box .tit.other{ display: inline-block; position: relative; top: 0; left: 0; transform: translate(0, 0); width: 118px; text-align: center; vertical-align: middle; /*width: 150px; height: 150px; */ }

#teacherBanner .teacher-zoom{position: absolute; bottom: 0; width: 730px; height: 525px; overflow: hidden; display: inline-block; margin-left: 50px;}
#teacherBanner .teacher-zoom .default_img{margin-left: 60px;}
#teacherBanner .teacher-zoom .onair{margin-left: 30px;}
#teacherBanner .teacher-zoom .startday{font-size: 2.8rem; color: #EA1821; font-weight: 600; margin-top: 37px;}
#teacherBanner .teacher-zoom .tea-img {display: none; font-size: 0;}
#teacherBanner .teacher-zoom .tea-img.on {display: inline-block;}
#teacherBanner .teacher-zoom .text{position: absolute; top: 90px; left: 0; width: 390px; color: #fff; z-index: 2;}
#teacherBanner .teacher-zoom .text .btn{display: inline-block; width: 180px; height: 56px; line-height: 58px; color: #fff; background: #EA1821; border-radius: 8px; font-size: 2rem; font-weight: 500; text-align: center; margin-top: 40px;}
#teacherBanner .teacher-zoom .scopy{font-size: 1.4rem; font-weight: 500;}
#teacherBanner .teacher-zoom .mcopy{font-size: 4rem; font-weight: 600; padding: 20px 0 25px;}
#teacherBanner .teacher-zoom .big13 .mcopy{ width: 450px; }
#teacherBanner .teacher-zoom .mcopy .line-break { display: block; }
#teacherBanner .teacher-zoom .bcopy{display: inline-block; font-size: 1.8rem; font-weight: 400; color: #B1B1B1; font-family: 'NotoSansKR'; width: 390px;}
#teacherBanner .teacher-zoom .big03 .bcopy{width: 220px;}
#teacherBanner .teacher-zoom .big04 .bcopy{width: 220px;}
#teacherBanner .teacher-zoom .big05 .bcopy{width: 270px;}
#teacherBanner .teacher-zoom .big06 .bcopy{width: 320px;}
#teacherBanner .teacher-zoom .img_ar{position: absolute; top: -22px; right: 0;}
#teacherBanner .teacher-zoom .big01 .img_ar{position: absolute; top: 0; right: 0;}
#teacherBanner .teacher-zoom .big02 .img_ar{position: absolute; top: 5px; right: 0;}
#teacherBanner .teacher-zoom .big03 .img_ar{position: absolute; top: 0; right: 30px;}
#teacherBanner .teacher-zoom .big05 .img_ar{position: absolute; top: 15px; right: 0;}
#teacherBanner .teacher-zoom .big06 .img_ar{position: absolute; top: 5px; right: -30px;}
#teacherBanner .teacher-zoom .big07 .img_ar{position: absolute; top: 20px; right: 0;}
#teacherBanner .teacher-zoom .big09 .img_ar{position: absolute; top: 0px; right: 0;}
#teacherBanner .teacher-zoom .big10 .img_ar{position: absolute; top: 0px; right: 0;}
#teacherBanner .teacher-zoom .big13 .img_ar{position: absolute; top: 0px; right: 0;}
#teacherBanner .teacher-zoom .big14 .img_ar{position: absolute; top: 0px; right: 0;}
#teacherBanner .teacher-zoom .big15 .img_ar{position: absolute; top: 0px; right: 0;}
#teacherBanner .teacher_box .tea-thumb.no01 { background: #2D2D2D url(/resource/images/teacher_thumnail_01.png) no-repeat 0 0;}
#teacherBanner .teacher_box .tea-thumb.no02 { background: #707070 url(/resource/images/teacher_thumnail_02.png) no-repeat 0 0;}
#teacherBanner .teacher_box .tea-thumb.no03 { background: #2D2D2D url(/resource/images/teacher_thumnail_03.png) no-repeat 0 0;}
#teacherBanner .teacher_box .tea-thumb.no04 { background: #707070 url(/resource/images/teacher_thumnail_04.png?v5) no-repeat 0 0;}
#teacherBanner .teacher_box .tea-thumb.no05 { background: #707070 url(/resource/images/teacher_thumnail_05.png?v2) no-repeat 0 0;}
#teacherBanner .teacher_box .tea-thumb.no06 { background: #2D2D2D url(/resource/images/teacher_thumnail_13.png) no-repeat 0 0;}
#teacherBanner .teacher_box .tea-thumb.no07 { background: #707070 url(/resource/images/teacher_thumnail_07.png) no-repeat 0 0;}
#teacherBanner .teacher_box .tea-thumb.no08 { background: #707070 url(/resource/images/teacher_thumnail_08.png) no-repeat 0 0;}
#teacherBanner .teacher_box .tea-thumb.no09 { background: #2D2D2D url(/resource/images/teacher_thumnail_09.png) no-repeat 0 0;}
#teacherBanner .teacher_box .tea-thumb.no10 { background: #707070 url(/resource/images/teacher_thumnail_10.png?v2) no-repeat 0 0;}
#teacherBanner .teacher_box .tea-thumb.no11 { background: #2D2D2D url(/resource/images/teacher_thumnail_11_220227.png) no-repeat 0 0;}
#teacherBanner .teacher_box .tea-thumb.no12 { background: #2D2D2D url(/resource/images/teacher_thumnail_12.png) no-repeat 0 0;}
#teacherBanner .teacher_box .tea-thumb.no13 { background: #707070 url(/resource/images/teacher_thumnail_16.png) no-repeat 0 0;}
#teacherBanner .teacher_box .tea-thumb.no14 { background: #707070 url(/resource/images/teacher_thumnail_14.png) no-repeat 0 0;}
#teacherBanner .teacher_box .tea-thumb.no15 { background: #707070 url(/resource/images/teacher_thumnail_15_.png) no-repeat 0 0;}
#teacherBanner .teacher_box .tea-thumb:before { position: absolute; left: 0; right: 0; bottom: 0; height: 50px; background: rgba(0,0,0,0.7); content: ''; 
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000000+0,000000+33&0+0,0+0,1+33 */
background: -moz-linear-gradient(to bottom,  rgba(0,0,0,0) 0%, rgba(0,0,0,0.5) 60%); /* FF3.6-15 */
background: -webkit-linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.5) 60%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.5) 60%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#000000',GradientType=0 ); /* IE6-9 */
}
#teacherBanner .teacher_box .tea-thumb.none { background: #707070 }
#teacherBanner .teacher_box .tea-thumb.none:after { display: inline-block; width: 1px; height: 122px; margin: 0 0 0 -1px; vertical-align: middle; content: ''; }

#main .que-wrap{padding: 120px 0; text-align: center; background: #fff;}
#main .que-wrap .title{font-size: 4rem; line-height: 60px; font-weight: 700;}
#main .que-wrap .scopy{font-size: 2rem; line-height: 30px; font-family: 'NotoSansKR'; padding: 23px 0 40px;}
#main .que-wrap .title2{font-size: 4rem; line-height: 60px; font-weight: 700; vertical-align: bottom;}
#main .que-wrap .title2 em{color: #EA1821; font-size: 5rem; vertical-align: baseline;}
#main .que-wrap .scopy2{font-size: 2rem; line-height: 30px; font-family: 'NotoSansKR'; padding: 32px 0 23px;}

#main .infowrap{padding: 120px 0; text-align: center; background: #1B1D1C;}
#main .infowrap .title{font-size: 4rem; line-height: 60px; font-weight: 700; padding-bottom: 100px; color: #fff;}
#main .infowrap .title span{color: #EA1821;}
#main .infowrap .infoboxs .box{display: inline-block; width: 380px;}
#main .infowrap .infoboxs .box + .box{margin-left: 10px;}
#main .infowrap .infoboxs .box .stit{font-size: 6rem; font-weight: 700; color: #EA1821; padding-bottom: 25px;}
#main .infowrap .infoboxs .box em{display: block; font-size: 3rem; font-weight: 500; padding-bottom: 20px; color: #fff;}
#main .infowrap .infoboxs .box .txt{font-family: 'NotoSansKR'; font-size: 2rem; line-height: 30px; color: #B1B1B1;}
#main .infowrap .infoboxs .box .txt span{display: block;}
#main .infowrap .infoboxs .box .ft{display: block; text-align: right; padding: 25px 40px 0 0; font-size: 2rem; color: #B1B1B1;}

#main .expwrap{padding: 120px 0; text-align: center;}
#main .expwrap .title{font-size: 4rem; line-height: 60px; font-weight: 700;}
#main .expwrap .scopy{font-size: 2rem; line-height: 30px; font-family: 'NotoSansKR'; padding: 23px 0 80px;}
#main .expwrap .scopy span{display: block;}
#main .expwrap .exbox{padding-bottom: 60px;}
#main .expwrap .exbox:last-child{padding-bottom: 0;}
#main .expwrap .fl-l .graybox{float: left;}
#main .expwrap .fl-l .tbox{float: right; text-align: left; padding: 95px 150px 0 0;}
#main .expwrap .fl-r .graybox{float: right;}
#main .expwrap .fl-r .tbox{float: left; text-align: left; padding: 95px 0 0 100px;}

#main .expwrap .graybox{display: inline-block; width: 585px; line-height: 339px; background: #F6F6F6; border-radius: 20px; text-align: center;}

#main .expwrap .tbox .tt{display: inline-block; font-size: 3rem; font-weight: 700; color: #1A1A1A;}
#main .expwrap .tbox .st{font-size: 2rem; color: #505050; font-family: 'NotoSansKR'; padding-top: 20px;}
#main .expwrap .tbox .st span{display: block;}


#main .meritwrap{background: #1B1D1C; text-align: center; padding-top: 100px;}
#main .meritwrap .title{font-size: 4rem; line-height: 60px; font-weight: 700; padding-bottom: 23px; color: #fff;}
#main .meritwrap .scopy{font-size: 2rem; line-height: 30px; font-family: 'NotoSansKR'; padding-bottom: 40px; color: #B1B1B1;}
#main .meritwrap .scopy span{display: block;}
#main .meritwrap .ad-ar{position: relative; width: 100%; padding-bottom: 120px; left: 50%; transform: translateX(-50%); -ms-transform: translateX(-50%); -webkit-transform: translateX(-50%);}


#main .lgwrap{padding: 120px 0; text-align: left;}
#main .lgwrap .lglogo{float: right; padding-right: 100px; padding-top: 90px;}
#main .lgwrap .txtbox{float: left; padding-left: 100px;}
#main .lgwrap .txtbox p{font-size: 4rem; line-height: 60px; font-weight: 700; padding-bottom: 23px;}
#main .lgwrap .txtbox span{font-size: 2rem; line-height: 30px; font-family: 'NotoSansKR';}
#main .lgwrap .txtbox span em{display: block;}
#main .lgwrap .img_area{margin: 6rem 10rem 0;}
#main .lgwrap .img_area ul{display: inline-block; margin-bottom: 10rem;}
#main .lgwrap .img_area ul li{float: left; margin-right: 2rem; margin-bottom: 2rem;}
#main .lgwrap .img_area ul li:nth-of-type(2n){margin-right: 0;}
#main .lgwrap .img_area .tt{font-size: 3rem; font-weight: 700; text-align: left;}
#main .lgwrap .img_area .ds{line-height: 3rem; font-size: 2rem; padding: 2rem 0 6rem; text-align: left; font-family: 'NotoSansKR';}
#main .lgwrap .img_area .btm{font-size: 0;}
#main .lgwrap .img_area .btm img{margin-bottom: 1rem;}
#main .lgwrap .img_area .btm img:nth-child(1){margin: 0 2rem 2rem 0;}
#main .lgwrap .img_area .btm .thum{display: inline-block;}
#main .lgwrap .img_area .btm .ytv{width: 48rem;}

#main .redwrap{background: #EA1821; padding: 110px 0; box-sizing: border-box;}
#main .redwrap .cont-sp{position: relative;}
#main .redwrap .cont-sp .tbox{padding: 0 0 0 80px;  color: #fff;}
#main .redwrap .cont-sp .tt{font-size: 4rem; font-weight: 700; padding-bottom: 23px;}
#main .redwrap .cont-sp .st{font-size: 2rem; font-family: 'NotoSansKR'; font-weight: 400;}
#main .redwrap .cont-sp .leclist_btn{position: absolute; right: 80px; top: 50%; transform: translateY(-50%); width: 325px; height: 80px; line-height: 80px; text-align: center; font-size: 2.8rem; color: #fff; font-weight: 700; border: 2px solid #fff; border-radius: 8px;}



#main .howwrap{text-align: center; padding: 120px 0 60px; background: #F6F6F6;}
#main .howwrap .title{font-size: 4rem; line-height: 60px; font-weight: 700; padding-bottom: 100px;}
#main .howwrap .stit{font-size: 2.4rem; font-weight: 700; padding-bottom: 30px; text-align: left;}
#main .howwrap .stit span{font-weight: 500;}
#main .howwrap ul li{float: left; width: 288px; height: 400px; border: 1px solid #979797; border-radius: 10px; padding: 60px 15px; box-sizing: border-box;}
#main .howwrap ul li + li{margin-left: 9px;}
#main .howwrap ul li p{font-size: 2rem; line-height: 23px; padding-bottom: 10px; font-weight: 700;}
#main .howwrap ul li .st{font-size: 1.4rem; line-height: 20px; font-family: 'NotoSansKR'; font-weight: 400;}
#main .howwrap ul li span em{display: block;}
#main .howwrap .web{margin-bottom: 100px;}
#main .howwrap .app{margin-bottom: 100px;}
#main .howwrap .icon01 { background: #fff url(/resource/images/how_icon01_.png?v3) no-repeat 50% 75%; background-size: 240px 160px; }
#main .howwrap .icon04{background: #fff url(/resource/images/how_icon04_pc.jpg) no-repeat 50% 77%; background-size: 166px 156px; padding: 50px 25px;}
#main .howwrap .web02 { background: #fff url(/resource/images/how_web02.svg) no-repeat 50% 75%; }
#main .howwrap .web03 { background: #fff url(/resource/images/how_web03.svg) no-repeat 50% 75%; }
#main .howwrap .web04 { background: #fff url(/resource/images/how_web04_240701.svg) no-repeat 50% 75%; }

#main .howwrap .howto { flex-direction: column; display: flex; padding: 0 0 40px 0; }
#main .howwrap .howto + .howto { margin-top: 16px; }
#main .howwrap .howto .stit { display: flex; gap:16px; padding: 0 0 12px 0; }
#main .howwrap .howto .help_img_wrap { display: flex; flex-direction: row; gap:16px; width: 100%; }

#main .howwrap .howto .help_img_wrap .unit { display: flex; flex-direction: column; justify-content: center; align-items: center; width: calc((100% - 32px) / 2); gap:16px; background: #FFF; border: 1px solid #979797; border-radius: 10px; padding: 32px 15px 21px; box-sizing: border-box; font-size: 20px; line-height: 23px; font-weight: 700; text-align: center; }
#main .howwrap .howto .help_img_wrap .unit p { display: inline-block; }
#main .howwrap .howto .help_img_wrap .unit.help_img_01::after { display: inline-block; width: 100%; height: 262px; background: url(/resource/images/help_img_01.png) 50% 0 no-repeat; background-size: 448px 262px; content: ''; }

#main .howwrap .howto .help_img_wrap .unit.help_img_02::after { display: inline-block; width: 100%; height: 262px; background: url(/resource/images/help_img_02.png) 50% 0 no-repeat; background-size: 378px 262px; content: ''; }
#main .howwrap .howto .help_img_wrap .unit.help_img_03::after { display: inline-block; width: 100%; height: 262px; background: url(/resource/images/help_img_03.png) 50% 0 no-repeat; background-size:290px 262px; content: ''; }


#main .howwrap .app01 { background: #fff url(/resource/images/how_app01.svg) no-repeat 50% 75%; }
#main .howwrap .app02 { background: #fff url(/resource/images/how_app02.svg) no-repeat 50% 70%; }
#main .howwrap .app03 { background: #fff url(/resource/images/how_app03.svg) no-repeat 50% 75%; }
#main .howwrap .app04 { background: #fff url(/resource/images/how_app04_240701.svg) no-repeat 50% 75%; }
#main .howwrap .lecture{display: flex; gap: 12px; justify-content: center; align-items: center;}
#main .howwrap .lecture .half{width: 584px; height: 200px; border: 1px solid #979797; border-radius: 10px; padding: 32px 15px 21px; box-sizing: border-box; font-size: 20px; line-height: 23px; font-weight: 700;}
#main .howwrap .lecture .half .blue{color: #1053ac;}
#main .howwrap .lecture .half .red{color: #e25555;}
#main .howwrap .lecture .lec_review{background: #fff url(/resource/images/icon_lec_review.svg) no-repeat 50% 75%;}
#main .howwrap .lecture .lec_error{background: #fff url(/resource/images/icon_lec_error.svg) no-repeat 50% 75%;}



#main .faq-wrap .stit.brw{padding-bottom: 20px;}
#main .faq-wrap .gd_copy{text-align: left; font-size: 2rem; font-family: 'NotoSansKR'; line-height: 3rem; margin-bottom: 20px;}
#main .faq-wrap .gd_copy span{display: block;}
#main .faq-wrap .browser{border: 1px solid #979797; border-radius: 10px; background: #fff; font-size: 0; text-align: center; padding: 50px 0 40px; margin-bottom: 20px;}
#main .faq-wrap .browser.basic{margin-bottom: 40px;}
#main .faq-wrap .browser .b_tit{display: inline-block; font-size: 2rem; font-weight: 700; padding-bottom: 10px;}
#main .faq-wrap .browser .scopy{font-size: 1.4rem; font-family: 'NotoSansKR'; font-weight: 400; padding-bottom: 30px;}
#main .faq-wrap .browser .step{display: inline-block; font-size: 1.4rem; font-family: 'NotoSansKR'; font-weight: 400;}
#main .faq-wrap .browser .step + .step{margin-left: 40px;}
#main .faq-wrap .browser .step .screenimg{display: inline-block; min-height: 270px; margin-bottom: 20px; vertical-align: middle;}
#main .faq-wrap .browser .step .first{padding-top: 50px;}
#main .faq-wrap .browser.lecture .b_tit{padding-bottom: 30px;}
#main .faq-wrap .browser .step.mtxt{display: inline-block; font-size: 1.8rem; text-align: left;}
#main .faq-wrap .browser .step.mtxt em{font-weight: 600;}
#main .faq-wrap .browser .thumbnail .step{width: 30%;}
#main .faq-wrap .browser .thumbnail img{width: 100%;}
#main .faq-wrap .browser .thumbnail .step.mtxt{width: 60%;}
#main .faq-wrap .browser .imgarea{margin-top: 30px;}
#main .faq-wrap .browser .mobr{display: inline-block;}
#main .faq-wrap .browser .mobr + .mobr{margin-left: 20px;}
#main .faq-wrap .declaration{text-align: left;}
#main .faq-wrap .declaration .btn{display: inline-block; padding: 8px 14px 8px; font-size: 1.7rem;  color: #fff; font-weight: 500; background: #EA1821; border-radius: 8px; margin-top: 10px;}



#main .howwrap .gobox{position: relative; background: #F6F6F6; padding: 70px 70px 54px; box-sizing: border-box; text-align: left; margin-top: 120px;}
#main .howwrap .gobox .tt{font-size: 2.4rem; padding-bottom: 20px; font-weight: 700;}
#main .howwrap .gobox .scopy{font-size: 2rem; line-height: 30px; font-family: 'NotoSansKR'; font-weight: 400;}
#main .howwrap .gobox .tell{font-size: 2rem; line-height: 30px; font-family: 'NotoSansKR'; font-weight: 400; color: #979797; padding-top: 15px;}
#main .howwrap .gobox .study_btn{position: absolute; top: 50%; right: 70px; transform: translateY(-50%); width: 300px; height: 67px; line-height: 67px; text-align: center; font-size: 2.4rem; font-weight: 500; color: #fff; background: #EA1821; border-radius: 8px;}






/* ???����??? : START */
#main .sign-up{position: relative;}
#main .sign-up .title{text-align: left; padding: 65px 0 20px; border-bottom: 1px solid #1B1D1C; margin-bottom: 15px;}
#main .sign-up .title .deadline{display: inline-block; width: 100px; height: 38px; line-height: 35px; color: #EA1821; font-size: 2rem; font-weight: 500; text-align: center; border: 3px solid #EA1821; box-sizing: border-box;}
#main .sign-up .title .ing{display: inline-block; width: 100px; height: 38px; line-height: 35px; color: #505050; font-size: 2rem; font-weight: 500; text-align: center; border: 3px solid #505050; box-sizing: border-box;}
#main .sign-up .title .end{display: inline-block; width: 100px; height: 38px; line-height: 35px; color: #fff; font-size: 2rem; font-weight: 500; text-align: center; background: #505050; border: 3px solid #505050; box-sizing: border-box;}
#main .sign-up .title .name{display: inline-block; font-size: 4rem; font-weight: 700; margin-left: 15px;}

#main .sign-up .img-ar{float: left; display: inline-block; width: 660px;}
#main .sign-up .img-ar .photo{height: 660px; border-radius: 8px; overflow: hidden; background: #1B1D1C;}
#main .sign-up .img-ar .photo img{display: inline-block; width: 100%;}
/*
#main .sign-up .img-ar .snsetc{margin-top: 24px; border: 1px solid #D8D8D8; text-align: center; box-sizing: border-box;}
#main .sign-up .img-ar .snsetc a{display: inline-block; font-size: 1.6rem; font-family: 'NotoSansKR'; font-weight: 500; padding: 0 30px; margin: 20px 0; border-right: 1px solid #D8D8D8;}
#main .sign-up .img-ar .snsetc a:last-child{border-right: 0;}
#main .sign-up .img-ar .snsetc .kakao span:after{content: ''; display: inline-block; background: url(/resource/images/icon_kakao.svg) no-repeat 50%; width: 17px; height: 15px; margin: 0 0 -1px 10px; background-size: 100%;}
#main .sign-up .img-ar .snsetc .book span:after{content: ''; display: inline-block; background: url(/resource/images/icon_book.svg) no-repeat 50%; width: 19px; height: 16px; margin: 0 0 -1px 10px; background-size: 100%;}
#main .sign-up .img-ar .snsetc .youtube span:after{content: ''; display: inline-block; background: url(/resource/images/icon_youtube.svg) no-repeat 50%; width: 19px; height: 15px; margin: 0 0 -1px 10px; background-size: 100%;}
*/

#main .sign-up .division-ar{float: right; display: inline-block; width: 480px;}
#main .sign-up .division-ar .stit{font-size: 1.4rem; font-family: 'NotoSansKR'; font-weight: 400; padding-bottom: 0;}
#main .sign-up .division-ar .boxs{border-bottom: 1px solid #D8D8D8; padding-bottom: 14px; margin-bottom: 12px;}
#main .sign-up .division-ar .boxs.time{border-bottom: 0; margin-bottom: 0;}
/*flex ????????? .boxs??? display: flex; justify-content: space-around; ��??? ??? open*/
/*  
#main .sign-up .division-ar .boxs li{position: relative; margin-top: 8px; width: 100%;}
#main .sign-up .division-ar .boxs li + li{margin-left: 2.5%;}
*/
#main .sign-up .division-ar .boxs li{float: left; position: relative; margin-top: 8px;}
#main .sign-up .division-ar .boxs li.cell2{display: inline-block; width: 48.5%;}
#main .sign-up .division-ar .boxs li.cell2:nth-of-type(1){margin-right: 2.5%;}
#main .sign-up .division-ar .boxs li.cell3{display: inline-block; width: 31.5%;}
#main .sign-up .division-ar .boxs li.cell3:nth-of-type(1n){margin-right: 2.5%;}
#main .sign-up .division-ar .boxs li.cell3:last-child{margin-right: 0;}
#main .sign-up .division-ar .boxs li.cell4{display: inline-block; width: 48.5%;}
#main .sign-up .division-ar .boxs li.cell4:nth-of-type(2n){margin-left: 2.5%;}
#main .sign-up .division-ar .boxs li.cell5{display: inline-block; width: 31.5%;}
#main .sign-up .division-ar .boxs li.cell5:nth-of-type(1n){margin-right: 2.5%;}
#main .sign-up .division-ar .boxs li.cell5:nth-child(3){margin-right: 0;}
#main .sign-up .division-ar .boxs li button{display: inline-block; width: 100%; line-height: 56px; color: #B1B1B1; font-size: 1.8rem; font-weight: 500; border: 1px solid #D8D8D8; border-radius: 8px; color: #B1B1B1; text-align: left; padding: 0 10px 0 30px; box-sizing: border-box;}
#main .sign-up .division-ar .boxs li.on button{border: 1px solid #1B1D1C; color: #B1B1B1; color: #1B1D1C;}
#main .sign-up .division-ar .boxs li button:hover{border: 1px solid #1B1D1C;}
#main .sign-up .division-ar .boxs li.end button{border: 1px solid #D8D8D8; color: #D8D8D8; background: #F6F6F6;}
#main .sign-up .division-ar .boxs li.end .t-bubble{position: absolute; top: -47px; left: 50%; transform: translateX(-50%); background: #fff; border: 1px solid #EA1821; padding: 12px; color: #EA1821; font-size: 1.5rem; font-weight: 500; text-align: center;}
#main .sign-up .division-ar .boxs li.end .t-bubble .trgl:before{content: ''; width: 0; height: 0; position: absolute; bottom: -10px; left: 50%; transform: translateX(-50%); border-left: 10px solid transparent; border-right: 10px solid transparent; border-top: 10px solid #EA1821;}
#main .sign-up .division-ar .boxs li.end .t-bubble .trgl:after{content: ''; width: 0; height: 0; position: absolute; border-left: 10px solid transparent; border-right: 10px solid transparent; border-top: 10px solid #fff; bottom: -9px; left: 50%; transform: translateX(-50%);}
/*#main .sign-up .division-ar .boxs li.on button span:after{content: ''; display: inline-block; background: url(/resource/images/icon_check.svg) no-repeat 50%; width: 19px; height: 14px; margin: 0 0 -1px 10px; background-size: 100%;}*/
#main .sign-up .division-ar .time_select{position: relative; width: 100%; height: 86px; line-height: 85px; text-align: left; font-size: 1.7rem; font-weight: 500; border-radius: 8px; margin: 7px 0 18px; border: 1px solid #D8D8D8; box-sizing: border-box;}
#main .sign-up .division-ar .time_select:hover{border: 1px solid #1B1D1C;}
#main .sign-up .division-ar .time_select .default{display: block; width: 100%; height: 84px; text-align: left; padding: 0 30px; box-sizing: border-box; color: #B1B1B1; background: url(/resource/images/icon_select_down.svg) no-repeat 95% 50%; z-index: 3;}
#main .sign-up .division-ar .time_select.on .default{background: url(/resource/images/icon_select_up.svg) no-repeat 95% 50%;}
#main .sign-up .division-ar .time_select .default:hover{color: #1B1D1C;}
#main .sign-up .division-ar .time_select.on {border: 1px solid #1B1D1C;}
#main .sign-up .division-ar .time_select.on .default{color: #1B1D1C;}
#main .sign-up .division-ar .time_select .list{position: absolute; left: -1px; top: 79px; display: none; width: 100%; height: 500px; overflow-y: scroll; z-index: 1; border-top: 1px solid #D8D8D8; border-left: 1px solid #1B1D1C; border-right: 1px solid #1B1D1C; border-bottom: 1px solid #1B1D1C; border-radius: 0 0 8px 8px; line-height: 2rem; background: #fff; box-shadow:0px 8px 12px -4px rgba(0,0,0,0.2)}
#main .sign-up .division-ar .time_select .list .pd{display: block; width: 100%; height: 82px; text-align: left; color: #1B1D1C; background: #fff; border-bottom: 1px solid  #D8D8D8; padding: 0 30px; box-sizing: border-box;}
#main .sign-up .division-ar .time_select .list .pd.endclass{color: #D8D8D8;}
#main .sign-up .division-ar .time_select .list .pd.endclass:hover{color: #D8D8D8; background: #fff;}
#main .sign-up .division-ar .time_select .list .pd:hover{color: #1B1D1C; background: #eee;}
#main .sign-up .division-ar .time_select .list .pd:last-child{height: 84px; border-radius: 0 0 8px 8px; border-bottom: 0;}
#main .sign-up .division-ar .time_select .default .stime,
#main .sign-up .division-ar .time_select .list .pd .stime
{display: block; padding-bottom: 6px;}
#main .sign-up .division-ar .time_select .list .pd .day:after
{content: ' | '; display: inline-block; margin: 0 8px; font-weight: 300;}
#main .event_tag01 {margin-left:12px; padding:4px 6px 3px; font-size:12px; background-color:#327fcf; color:#fff; vertical-align:middle;}
#main .month_txt {margin-left:6px; padding:3px 6px 2px; font-size:12px; background-color:#fff; color:#ff5b01; border:1px solid #ff5b01; vertical-align:middle;}
#main .month_txt2 {margin-left:6px; padding:3px 6px 2px; font-size:12px; background-color:#fff; color:#1423d2; border:1px solid #1423d2; vertical-align:middle;}



#main .sign-up .division-ar .all-info .guidetxt{padding: 26px 0 30px 10px; font-family: 'NotoSansKR'; font-size: 1.6rem; font-weight: 500; color: #1B1D1C; border-top: 1px solid #1B1D1C;}
#main .sign-up .division-ar .start-day{position: relative;}
#main .sign-up .division-ar .start-day .infom{font-family: 'NotoSansKR'; font-size: 1.6rem; font-weight: 400; color: #1B1D1C; line-height: 24px; border-top: 1px solid #1B1D1C; padding: 24px 0 29px 10px;}
#main .sign-up .division-ar .start-day .view{position: absolute; top: 30px; right: 0; transform: translateY(-50%); font-family: 'NotoSansKR'; font-size: 1.4rem; color: #979797; text-decoration: underline; font-weight: 400;}
#main .sign-up .division-ar .st-info{font-family: 'NotoSansKR'; font-size: 1.6rem; font-weight: 400; color: #1B1D1C; padding: 26px 10px 34px; box-sizing: border-box;}
#main .sign-up .division-ar .st-info span{display: inline-block; padding-right: 1px;}
#main .sign-up .division-ar .st-info span:after{content: '/'; display: inline-block; margin-left: 5px;}
#main .sign-up .division-ar .st-info span:last-child:after{display: none;}

#main .sign-up .division-ar .tuition .dc{float: left; padding-top: 10px;}
#main .sign-up .division-ar .tuition .dc em{display: inline-block; font-size: 2.6rem; font-weight: 700; color: #EA1821; padding-right: 15px; vertical-align: baseline;}
#main .sign-up .division-ar .tuition .dc span{font-size: 2.2rem; color: #B1B1B1; font-weight: 500; text-decoration: line-through; vertical-align: baseline;}
#main .sign-up .division-ar .tuition .won{float: right; font-size: 4rem; font-weight: 500;}
#main .sign-up .division-ar .tuition .won span{font-weight: 700;}
#main .sign-up .division-ar .tuition .won.before{color: #979797;}

#main .sign-up .division-ar .pay_btn{width: 480px; height: 100px; line-height: 100px; background: #D8D8D8; color: #fff; font-size: 3.2rem; text-align: center; font-weight: 700; border-radius: 8px; margin-top: 34px;}
#main .sign-up .division-ar .cart_btn{width: 200px; height: 95px; line-height: 100px; background: #fff; color: #D8D8D8; font-size: 3.2rem; text-align: center; font-weight: 700; border-radius: 8px; border:1px solid #D8D8D8; margin-top: 34px; float:left;}
#main .sign-up .division-ar .pay_btn_v2{width: 270px; height: 95px; line-height: 100px; background: #D8D8D8; color: #fff; font-size: 3.2rem; text-align: center; font-weight: 700; border-radius: 8px; margin-top: 34px; margin-left:10px; float:left;}

#main .sign-up .division-ar .pay_btn.on{background: #EA1821;}
#main .sign-up .division-ar .cart_btn.on{background: #fff; color:#2c2c2c; border: 1px solid #2c2c2c;}
#main .sign-up .division-ar .pay_btn_v2.on{background: #EA1821;}


#main .explain{padding-top: 140px;}
#main .sns_ar{margin-bottom: 130px; font-size: 0;}
#main .sns_ar .btn_b{display: inline-block; width: 29%; height: 6.4rem; padding: 0 20px; line-height: 6.5rem; background: #3A3A3A; border-radius: .6rem; color: #fff; font-family: 'NotoSansKR'; font-size: 1.8rem; font-weight: 500; text-align: center; box-sizing: border-box;}
#main .sns_ar .btn_s{display: inline-block; width: 19%; height: 6.4rem; padding: 0 20px; line-height: 6rem; background: #fff; border: 1px solid #1B1D1C; border-radius: .6rem; color: #1B1D1C; font-family: 'NotoSansKR'; font-size: 1.8rem; font-weight: 500; text-align: center; box-sizing: border-box;}
#main .sns_ar a + a{margin-left: 15px;}
#main .sns_ar .book span:after{content: ''; display: inline-block; background: url(/resource/images/icon_book.svg) no-repeat 50%; width: 25px; height: 20px; margin: 0 0 -4px 10px;}
#main .sns_ar .offlec span:after{content: ''; display: inline-block; background: url(/resource/images/icon_offlec.svg) no-repeat 50%; width: 31px; height: 20px; margin: 0 0 -4px 10px;}
#main .sns_ar .talk-pc span:before{content: ''; display: inline-block; background: url(/resource/images/icon_kakao.svg) no-repeat 50%; width: 20px; height: 18px; margin: 0 10px -4px 0;}
#main .sns_ar .youtube span:after{content: ''; display: inline-block; background: url(/resource/images/icon_youtube.svg) no-repeat 50%; width: 26px; height: 18px; margin: 0 0 -4px 10px;}


#main .explain .mt-txt{color: #1A1A1A; font-size: 3rem; font-weight: 700; text-align: center; padding-bottom: 20px;}

#main .explain .it_view{position: relative; width: 100%; margin-bottom: 20px;}
#main .explain .it_view img{display:block;}
#main .explain .it_view .btn_sns{display: block; width: 100%; height: 6.4rem; padding: 0 20px; margin-top:40px; line-height: 6rem; background: #fff; border: 1px solid #1B1D1C; border-radius: .6rem; color: #1B1D1C; font-family: 'NotoSansKR'; font-size: 1.8rem; font-weight: 500; text-align: center; box-sizing: border-box;}
#main .explain .it_view .btn_sns span:before{content: ''; display: inline-block; background: url(/resource/images/icon_kakao.svg) no-repeat 50%; width: 20px; height: 18px; margin: 0 10px -4px 0;}

#main .explain .review{letter-spacing: -1px;}
#main .explain .review .point_box{min-height: 140px; background: #F6F6F6; border-radius: 10px; padding: 37px 80px; box-sizing: border-box; font-family: 'NotoSansKR';}

#main .explain .review .starwrap{display: inline-block; text-align: left; margin-right: 120px;}
#main .explain .review .startxt{font-size: 1.5rem; font-weight: 500; padding-bottom: 5px;}

#main .explain .review .star-rating {width:136px;}
#main .explain .review .star-rating,
#main .explain .review .star-rating span {display: inline-block; height: 27px; overflow: hidden; background: url(/resource/images/star.svg)no-repeat; text-align: left;}
#main .explain .review .star-rating span{background-position: left bottom;}
#main .explain .review .countbox{display: inline-block;}
#main .explain .review .countbox li{float: left; position: relative; margin-right: 50px;}
#main .explain .review .countbox li:last-child{margin-right: 0;}
#main .explain .review .countbox .txtbox{position: relative; font-size: 1.5rem; padding-bottom: 8px;}


#main .explain .review .countbox .tt{display: inline-block; font-weight: 500; padding-right: 5px;}
#main .explain .review .countbox .score{display: inline-block; font-weight: 600; color: #8B41F2;}
#main .explain .review .countbox .question{display: inline-block; width: 18px; height: 18px; background: url(/resource/images/icon_q.svg) no-repeat 50%; vertical-align: middle; margin-left: 10px;}
#main .explain .review .countbox .question .bubble{display: none;}
#main .explain .review .countbox .question .bubble.on{position: absolute; top: 30px; right: 0; display: block; width: 170px; font-family: 'NotoSansKR'; font-size: 1.4rem; font-weight: 400; line-height: 2rem; color: #1B1D1C; text-align: left; background: #fff; padding: 12px 14px 14px; border: 1px solid #B1B1B1; border-radius: 0.6rem; z-index: 2;}


#main .explain .review .countbox .graphwrap{width: 220px; height: 8px; border: 1px solid #CCCCCC; border-radius: 8px; background: #EEEEEE; box-sizing: border-box;}
#main .explain .review .countbox .graphwrap .bar{position: relative; width: 209px;}
#main .explain .review .countbox .graphwrap .dot{position: absolute; top: -3px; width: 12px; height: 12px; border-radius: 50%; background: #8B41F2;}
#main .explain .review .countbox .ext{position: absolute; font-size: 1.2rem; color: #949494; font-weight: 500; padding-top: 9px;}
#main .explain .review .countbox .left{left: 0;}
#main .explain .review .countbox .right{right: 0;}

#main .explain .review .wdlist{margin-top: 48px; font-family: 'NotoSansKR'; font-weight: 400; letter-spacing: -0.5px;}
#main .explain .review .wdlist .afwd_tit{font-size: 1.6rem; padding-bottom: 17px; line-height: 26px; font-weight: 500;}
#main .explain .review .wdlist .bf_lec{font-size: 1.3rem; font-weight: 400; color: #707070; padding-bottom: 21px;}
#main .explain .review .wdlist .bf_lec span{text-decoration: underline;}

#main .explain .review .wdlist .afwd{overflow:hidden; color: #707070; font-size: 1.5rem; line-height: 24px;}
#main .explain .review .wdlist .afwd .word{display: inline-block; margin-bottom: 10px;}
#main .explain .review .wdlist .afwd .word.hidden{word-wrap:normal; overflow:hidden; text-overflow: ellipsis;
display: -webkit-box; 
-webkit-line-clamp: 2; 
-webkit-box-orient: vertical;
word-wrap:break-word;
}
#main .explain .review .wdlist .afwd .btn-more{display: block; text-decoration: underline; font-family: 'NotoSansKR'; font-weight: 500; font-size: 1.5rem;}
#main .explain .review .wdlist .afwd .btn-more span:after{content: ''; display: inline-block; background: url(/resource/images/icon_more_arrow.svg) no-repeat; width: 11px; height: 6px; margin-left: 7px;}

#main .explain .review .wdlist .heart{display: inline-block; height: 30px; line-height: 26px; text-align: center; color: #707070; border: 1px solid #707070;  font-family: 'NotoSansKR'; font-size: 1.2rem; font-weight: 500; border-radius: 30px; margin: 15px 0 15px; padding: 0 14px 0 7px; box-sizing: border-box;}
#main .explain .review .wdlist .heart.on{color: #ED76A2; border: 1px solid #FCB8D1;}
#main .explain .review .wdlist .heart:before{content: ''; display: inline-block; background: url(/resource/images/icon_heart.svg) no-repeat 50%; width: 21px; height: 17px; margin: 0 4px -3px;}
#main .explain .review .wdlist .heart.on:before{content: ''; display: inline-block; background: url(/resource/images/icon_heart_on.svg) no-repeat 50%; width: 21px; height: 17px; margin: 0 4px -3px;}
#main .btn-ar{text-align: center;}
#main .go-list{display: inline-block; text-align: center; margin-top: 100px; width: 325px; height: 80px; line-height: 84px; border: 2px solid #1B1D1C; border-radius: 8px; font-size: 2.8rem; font-weight: 700;}

#main .explain .review .btn-listmore{display: block; width: 100%; height: 90px; line-height: 90px; text-align: center; border: 1px solid #D8D8D8; font-size: 2.5rem; font-weight: 500; margin-top: 50px;}
#main .explain .review .btn-listmore:after{content: ''; display: inline-block; background: url(/resource/images/icon_arrow_down.svg) no-repeat 50%; width: 24px; height: 14px; margin: 0 0 -1px 13px;}
/* ???����??? : END */


/* ���Ǹ��� : START */
#main .lecturelist{text-align: center; padding: 70px 0;}
#main .tab-menu{margin-bottom: 40px;}
#main .tab-menu button{display: inline-block; font-size: 4rem; font-weight: 500; color: #979797; padding: 22px 55px 14px; border: 2px solid #b1b1b1; border-radius: 10px;}
#main .tab-menu button:hover{color: #1B1D1C; background: #fff; border: 2px solid #1B1D1C; border-radius: 10px;}
#main .tab-menu button.on{font-weight: 700; background: #1B1D1C; color: #fff; border: 2px solid #1B1D1C; border-radius: 10px;}
#main .tab-menu button + button{margin-left: 28px;}
#main .lecturelist .s-menu{margin-bottom: 40px;}
#main .lecturelist .s-menu .tab-btn{display: inline-block; width: 90%;}
#main .lecturelist .s-menu .sub-tab{display: block; background: #F6F6F6; margin-top: 30px; border-radius: 55px;}
#main .lecturelist .s-menu .tab-btn button + button{margin: 0 0 15px 17px;}
#main .lecturelist .s-menu .tab-btn button{display: inline-block; padding: 5px 25px; font-weight: 500; color: #979797; font-size: 2.4rem; padding: 16px 20px 11px; border: 2px solid #b1b1b1; border-radius: 10px;}
#main .lecturelist .s-menu .tab-btn button:hover{background: #fff; color: #1B1D1C; border: 2px solid #1B1D1C; border-radius: 10px;}
#main .lecturelist .s-menu .tab-btn button.on{display: inline-block; padding: 16px 20px 11px; font-weight: 700; color: #fff; background: #1B1D1C; border: 2px solid #1B1D1C;}
#main .lecturelist .s-menu .sub-tab button{display: inline-block; padding: 18px 25px 14px; font-weight: 500; color: #979797; font-size: 2rem;}
#main .lecturelist .s-menu .sub-tab button:hover{color: #1B1D1C;}
#main .lecturelist .s-menu .sub-tab button.on{display: inline-block; padding: 5px 25px; font-weight: 500; color: #1B1D1C;}

#main .lecturelist .lec-blank{border:1px dashed #B1B1B1; margin: 0 0 120px; padding:0; border-radius: 14px;}
#main .lecturelist .lec-blank span{display: block; padding: 70px 0; font-size: 3rem; font-family: 'NotoSansKR'; color: #B1B1B1;}
#main .lecturelist .class-list{font-size: 0; text-align: left;}
#main .lecturelist .class-list li{display: inline-block; margin: 0 10px 15px 0; width: 228px; text-align: left; border-radius: 10px;}

#main .lecturelist .class-list li .photo{width: 228px; height: 280px; border-radius: 8px; overflow: hidden;}
#main .lecturelist .class-list li .photo .gray-screen{position: absolute; width: 228px; height: 280px; border-radius: 8px; background: rgba(0,0,0,0.3);}
#main .lecturelist .class-list li .photo .gray-screen .end-mark{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background: url(/resource/images/end_mark.png) no-repeat 50%; width: 96px; height: 58px;}
#main .lecturelist .class-list li .photo img{width: 100%;}
#main .lecturelist .class-list li:nth-child(5n){margin-right: 0;}
#main .lecturelist .class-list li .tbox{position: relative; min-height: 135px; padding: 15px 10px; box-sizing: border-box;}
#main .lecturelist .class-list li .tbox .class{font-size: 2rem; font-weight: 500; vertical-align: middle;}
#main .lecturelist .class-list li .tbox .subtxt{font-size: 1.2rem; font-weight: 500; color: #979797;display: block; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;} 
#main .lecturelist .class-list li .tbox .teachers{font-size: 1.6rem; font-family: 'NotoSansKR'; color: #1A1A1A; margin: 2px 0 8px;}
#main .lecturelist .class-list li .tbox .mark{font-family: 'NotoSansKR'; font-size: 12px; font-weight: 400; padding-bottom: 12px;}
#main .lecturelist .class-list li .tbox .mark span{display: inline-block; color: #1B1D1C; border: 1px solid #1B1D1C; padding: 1px 9px; box-sizing: border-box; margin-bottom: 2px; margin-right: 3px;}
#main .lecturelist .class-list li .tbox .mark .media_01{background: #EB018C; color: #fff; border: 1px solid #EB018C;}
#main .lecturelist .class-list li .tbox .mark .media_02{background: #EE0808; color: #fff; border: 1px solid #EE0808;}
#main .lecturelist .class-list li .tbox .mark .media_03{background: #0166EB; color: #fff; border: 1px solid #0166EB;}
#main .lecturelist .class-list li .tbox .mark .media_10{background: #ffd819; color: #000; border: 1px solid #ffd819;} /* ����??????(??????) */
#main .lecturelist .class-list li .tbox .mark .media_11{background: #5882f7; color: #fff; border: 1px solid #4a72e3;} /* ����??????(����) */
#main .lecturelist .class-list li .tbox .mark .media_12{background: #c7eb6e; color: #000; border: 1px solid #a4c948;} /* ����??????(??????) */
#main .lecturelist .class-list li .tbox .mark .media_13{background: #fbbc05; color: #000; border: 1px solid #fbbc05;} /* ����??????(??????) */

#main .lecturelist .class-list li .tbox .mark .best{position: absolute; top: -48px; left: -7px; width: 54px; height: 54px; text-align: center; border-radius: 50%; background: #4B00FC; color: #fff; font-family: 'GmarketSans'; font-size: 12px; font-weight: 500; border: 0; padding: 21px 0 17px 2px;}
#main .lecturelist .class-list li .tbox .mark .best1{position: absolute; top: -48px; left: -7px; width: 54px; height: 54px; text-align: center; border-radius: 50%; color: #fff; font-family: 'GmarketSans'; font-size: 12px; font-weight: 500; border: 0; padding: 28px 0 17px 2px; background: #DBA300 url(/resource/images/Icon_crown.png) no-repeat 50% 20%; background-size:20px 16px;}
#main .lecturelist .class-list li .tbox .mark .media_04{background: #747474; color: #fff; border: 1px solid #747474;}
#main .lecturelist .class-list li .tbox .title{font-size: 14px; font-family: 'GmarketSans'; font-weight: 500; padding-bottom: 5px;}
#main .lecturelist .class-list li .tbox .title .end{display: inline-block; color: #979797; vertical-align: middle;}
#main .lecturelist .class-list li .tbox .title .ending{display: inline-block; color: #EA1821; vertical-align: middle;}
#main .lecturelist .class-list li .tbox .title .ending:before{content: ''; display: inline-block; background: url(/resource/images/icon_timer.svg) no-repeat 50%; width: 16px; height: 19px; margin: -5px 5px 0 0; vertical-align: middle;}
/* ���Ǹ��� : END */


/* ?????? ???????????? ?????? ���� : START */
#main .other-choice{padding: 110px 0 80px; box-sizing: border-box; background: #1B1D1C; text-align: center;}
#main .other-choice .tt{font-size: 3rem; font-weight: 700; color: #fff;}
#main .other-choice .st{font-size: 2rem; font-weight: 300; font-family: 'NotoSansKR'; color: #B1B1B1; padding-bottom: 40px;}
#main .other-choice .class-list{font-size: 0; text-align: left;}
#main .other-choice .class-list li{display: inline-block; margin: 0 12px 35px 0; width: 286px; text-align: left;}
#main .other-choice .class-list li .photo{width: 100%; border-radius: 8px; overflow: hidden;}
#main .other-choice .class-list li .photo{width: 286px; height: 350px; border-radius: 8px; overflow: hidden;}
#main .other-choice .class-list li .photo .gray-screen{position: absolute; width: 286px; height: 350px; border-radius: 8px; background: rgba(0,0,0,0.3);}
#main .other-choice .class-list li .photo .gray-screen .end-mark{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background: url(/resource/images/end_mark.png) no-repeat 50%; width: 96px; height: 58px;}
#main .other-choice .class-list li .photo img{width: 100%;}


#main .other-choice .class-list li:nth-child(4n){margin-right: 0;}
#main .other-choice .class-list li .tbox{position: relative; padding: 15px 10px; box-sizing: border-box; color: #fff;}
#main .other-choice .class-list li .tbox .class{font-size: 2rem; font-weight: 500; padding-bottom: 0.5rem; vertical-align: middle;}
#main .other-choice .class-list li .tbox .subtxt{font-size: 1.2rem; font-weight: 500; color: #B1B1B1; display: block; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
#main .other-choice .class-list li .tbox .teachers{font-size: 1.6rem; font-family: 'NotoSansKR'; margin: 2px 0 8px;}
#main .other-choice .class-list li .tbox .teachers a + a{/*margin-left: 10px;*/}
/*#main .other-choice .class-list li .tbox .teachers a:before{content: ''; display: inline-block; width: 3px; height: 3px; background: #fff; margin: 0 5px 5px 0;}*/

#main .other-choice .class-list li .tbox .mark{font-family: 'NotoSansKR'; font-size: 1.2rem; font-weight: 400; padding-bottom: 12px;}
#main .other-choice .class-list li .tbox .mark span{display: inline-block; color: #aaa; border: 1px solid #aaa; padding: 1px 9px; box-sizing: border-box; margin-bottom: 2px; margin-right: 3px;}
#main .other-choice .class-list li .tbox .mark .media_01{background: #EB018C; color: #fff; border: 1px solid #EB018C;}
#main .other-choice .class-list li .tbox .mark .media_02{background: #EE0808; color: #fff; border: 1px solid #EE0808;}
#main .other-choice .class-list li .tbox .mark .media_03{background: #0166EB; color: #fff; border: 1px solid #0166EB;}
#main .other-choice .class-list li .tbox .mark .best{position: absolute; top: -48px; left: -7px; width: 54px; height: 54px; text-align: center; border-radius: 50%; background: #4B00FC; color: #fff; font-family: 'GmarketSans'; font-size: 12px; font-weight: 500; border: 0; padding: 21px 0 17px 2px;}
#main .other-choice .class-list li .tbox .mark .best1{position: absolute; top: -48px; left: -7px; width: 54px; height: 54px; text-align: center; border-radius: 50%; color: #fff; font-family: 'GmarketSans'; font-size: 12px; font-weight: 500; border: 0; padding: 28px 0 17px 2px; background: #DBA300 url(/resource/images/Icon_crown.png) no-repeat 50% 20%; background-size:20px 16px;}
#main .other-choice .class-list li .tbox .mark .media_04{background: #747474; color: #fff; border: 1px solid #747474;}
#main .other-choice .class-list li .tbox .title{font-size: 14px; font-family: 'GmarketSans'; font-weight: 500; padding-bottom: 5px;}
#main .other-choice .class-list li .tbox .title .end{display: inline-block; color: #B1B1B1; vertical-align: middle;}
#main .other-choice .class-list li .tbox .title .ending{display: inline-block; color: #EA1821; vertical-align: middle;}
#main .other-choice .class-list li .tbox .title .ending:before{content: ''; display: inline-block; background: url(/resource/images/icon_timer.svg) no-repeat 50%; width: 16px; height: 19px; margin: -5px 5px 0 0; vertical-align: middle;}


@keyframes blink {
 0% {background-color: #EB018C; color: #fff;}
 50% {background-color: #FF46B3; color: #fff;}
}
 
/* for Chrome, Safari */
@-webkit-keyframes blink {
 0% {background-color: #EB018C; color: #fff;}
 50% {background-color: #FF46B3; color: #fff;}
}
 
.media_01 {
 font-weight:bold;
 animation: blink 1s step-end infinite;
 -webkit-animation: blink 1s step-end infinite;
}

.media_01 {
    animation: blink 1s step-end infinite;
}

/* ?????? ???????????? ?????? ���� : END */


#main .faq-wrap{text-align: center; padding: 70px 0 0;}
#main .faq-wrap .faq-list{border-top: 1px solid #B1B1B1;}
#main .faq-wrap .faq-list li{text-align: left; border-bottom: 1px solid #B1B1B1;}
#main .faq-wrap .faq-list .question{position: relative; display: block; font-size: 2rem; min-height: 88px; padding: 30px 110px 30px 40px; box-sizing: border-box;}
#main .faq-wrap .faq-list .question .tt{line-height: 32px; font-weight: 500;}
#main .faq-wrap .faq-list .answer{display: none; background: #F6F6F6; padding: 30px 40px; box-sizing: border-box; line-height: 28px; border-top: 1px solid #ddd; color: #747474; font-family: 'NotoSansKR'; font-size: 1.8rem; font-weight: 400;}
#main .faq-wrap .faq-list .answer .eduappicon{font-weight: 800; color: #111;}
#main .faq-wrap .faq-list .answer .eduappicon:before{content: ""; display: inline-block; background: url(/resource/images/how_app02.svg) no-repeat 50%; width: 24px; height: 24px; background-size: cover; margin-top: -1px; vertical-align: middle;}

#main .faq-wrap .faq-list .cross{position: absolute; top: 50%; right: 50px; transform: translateY(-50%);}
#main .faq-wrap .faq-list .cross .cr_w{position: absolute; top: 0; left: 0; width: 20px; height: 2px; background: #747474; transition: all 0.3s;}
#main .faq-wrap .faq-list .cross .cr_h{position: absolute; top: -9px; left: 9px; width: 2px; height: 20px; background: #747474; transition: all 0.3s;}
#main .faq-wrap .faq-list .menu.on .cross .cr_w{transform: rotate(180deg);}
#main .faq-wrap .faq-list .menu.on .cross .cr_h{transform: rotate(90deg);}



/* #main .cs-center{position: relative; margin-top: 130px; text-align: left; font-weight: 500; font-size: 2.4rem; background: #F6F6F6; padding: 70px 70px 75px; box-sizing: border-box;}
#main .cs-center .txt{width: 750px; line-height: 32px;}
#main .cs-center .time{font-size: 2rem; font-weight: 400; font-family: 'NotoSansKR'; vertical-align: middle;}
#main .cs-center .cs-btn{position: absolute; right: 70px; top: 65px; width: 280px; height: 67px; line-height: 67px; font-size: 2.4rem; font-weight: 500; color: #fff; background: #EA1821; border-radius: 8px;}
#main .cs-center .tel_area{border-top: 1px solid #707070; border-bottom: 1px solid #707070; font-size: 1.6rem; font-weight: 500; font-family: 'NotoSansKR'; margin-top: 5rem;}
#main .cs-center .tel_area li{float: left; width: 33.3%; text-align: center; height: 4.6rem; line-height: 4.6rem; text-align: left; padding-left: 5rem; box-sizing: border-box;}
#main .cs-center .tel_area li span{display: inline-block; width: 100px;}
#main .cs-center .tel_area li span:before{content: ''; display: inline-block; width: 4px; height: 4px; background: #1B1D1C; margin: 0 1rem .5rem 0;}
#main .cs-center .tel_area li .tel_stxt{display:inline-block;}
#main .cs-center .tel_area li{border-bottom: 1px dashed #ccc;}
#main .cs-center .tel_area li:nth-child(10){border-bottom: 0;}
#main .cs-center .tel_area li:nth-child(11){ width: 66%; border-bottom: 0;}  */




#main .bula_banner .bula{display: block; background: url(/resource/images/meta_banner_pc.jpg) no-repeat 50%; width: 1180px; height: 160px; padding-top: 55px; box-sizing: border-box; margin-top: 20px; text-align: center; color: #fff;}
#main .bula_banner .career{display: block; background: url(/resource/images/career_banner_pc.jpg) no-repeat 50%; width: 1180px; height: 160px; padding-top: 65px; box-sizing: border-box; margin-top: 20px; text-align: center; color: #fff;}
#main .bula_banner .career span{display:inline-block; color:#ffea2a;}

#main .bula_banner .bula_half{display: inline-block; background: url(/resource/images/banner_bula.jpg) no-repeat 50%; width: 585px; height: 180px; padding-top: 55px; box-sizing: border-box; margin-top: 20px; text-align: center; color: #fff;}
#main .bula_banner .itcareer{display: inline-block; background: url(/resource/images/banner_career.jpg) no-repeat 50%; width: 585px; height: 180px; padding-top: 55px; box-sizing: border-box; margin-top: 20px; text-align: center; color: #fff;}
.bula_banner p span{display: block;}


.bula_banner p{font-size: 3rem; font-weight: 700;}
.bula_banner .bula .blink{color: #ea1821; animation: blink-effect 1s step-end infinite;}
.bula_banner .career .blink{color: #ffea2a; animation: blink-effect 1s step-end infinite;}
.id_area .cont-sp .blink{color: #fff; animation: blink-effect 1s step-end infinite;}
.id_area_v2 .cont-sp .blink{color: #1a1a1a; animation: blink-effect 1s step-end infinite;}
@keyframes blink-effect {
    50% { opacity: 0; } 
}
.bula_banner .go{display: inline-block; font-size: 1.5rem; font-weight: 500; padding-top: 5px;}

#main .metabula-wrap{padding: 120px 0; text-align: center; background: #fff;}
.metabula-wrap .title{font-size: 4rem; line-height: 60px; font-weight: 700;}
.metabula-wrap .title em{color: #ea1821;}
.metabula-wrap .title span{display: inline-block; font-weight: 500;}
.metabula-wrap .bulabila{margin-top: 60px;}
.metabula-wrap .bulabila li{float: left; width: 585px; margin-bottom: 10px; font-size: 4rem; font-weight: 700; text-align: center; color: #fff;}
.metabula-wrap .bulabila li:nth-of-type(odd){margin-right: 10px;}
.metabula-wrap .bulabila li.box01{width: 585px; height: 320px; background: url(/resource/images/bulabila_01.jpg) no-repeat 50%; line-height: 320px;}
.metabula-wrap .bulabila li.box02{width: 585px; height: 320px; background: url(/resource/images/bulabila_02.jpg) no-repeat 50%; padding-top: 105px; box-sizing: border-box; line-height: 60px;}
.metabula-wrap .bulabila li.box03{width: 585px; height: 320px; background: url(/resource/images/bulabila_03.jpg) no-repeat 50%; line-height: 320px;}
.metabula-wrap .bulabila li.box04{width: 585px; height: 320px; background: url(/resource/images/bulabila_04.jpg) no-repeat 50%; padding-top: 100px; box-sizing: border-box; line-height: 60px;}


#main .metastudy-wrap{padding: 120px 0; text-align: center; background: #4358dc;}
.metastudy-wrap .title{font-size: 4rem; line-height: 60px; font-weight: 700; padding-bottom: 60px; color: #fff;}

#main .metainfo-wrap{padding-top: 100px;}
.metainfo-wrap .infobox{margin-bottom: 60px; font-size: 0;}
.metainfo-wrap .infobox div{display: inline-block; width: 50%;}
.metainfo-wrap .infobox .txtbox{padding: 100px 0 0 110px; box-sizing: border-box;}
.metainfo-wrap .infobox .txtbox em{display: inline-block; font-size: 3rem; font-weight: 700; padding-bottom: 20px;}
.metainfo-wrap .infobox .txtbox p{font-size: 2rem; line-height: 30px;}
.metainfo-wrap .imgar.left{float: left;}
.metainfo-wrap .imgar.right{float: right;}


#main .inway-wrap{padding: 120px 0; text-align: center; background: #F6F6F6;}
.inway-wrap .title{font-size: 4rem; line-height: 60px; font-weight: 700; padding-bottom: 60px;}
.inway-wrap .title em{color: #ea1821;}
.inway-wrap .way_list ul{background: url(/resource/images/way_dot_bg.png) no-repeat 45% 50%; font-size: 0;}
.inway-wrap .way_list li + li{margin-top: 40px;}
.inway-wrap .way_list .box{display: inline-block; width: 50%; text-align: left;}
.inway-wrap .way_list .box em{display: block; padding-top: 135px; font-size: 3rem; line-height: 60px; font-weight: 700;}
.inway-wrap .way_list .box span{display: block; font-size: 2rem; color: #505050; line-height: 30px;}
.inway-wrap .way_list .box img{width: 585px; height: 400px;}


/* IT ????????? Ŀ��??? ????????? : START */

.dcareer .title{font-family: 'GmarketSans'; font-size: 4rem; font-weight: 700;}
.dcareer .id_area{max-height: 628px; background: url(/resource/images/dcareer/dc_identity.jpg) no-repeat 50%; background-size: cover; text-align: center; color: #fff; font-family: 'GmarketSans';}
.dcareer .id_area .logo{display: inline-block; padding-top: 70px;}
.dcareer .id_area .hcopy{font-size: 4rem; padding-top: 100px; font-weight: 700; display:block;}
.dcareer .id_area .hcopy img{width:180px;}
.dcareer .id_area .hcopy span{display:inline-block; padding:33px 0;}
.dcareer .id_area .mcopy{font-size: 3rem; padding-top: 30px; font-weight: 700;}
.dcareer .id_area .bcopy{font-size: 2rem; padding: 20px 0 43px; font-family: 'NotoSansKR';}
.dcareer .id_area .startday {font-size: 2.8rem; color: #EA1821; font-weight: 600; padding-bottom: 122px;}

.dcareer .id_area_v2{max-height: 628px; background: url(/resource/images/dcareer/dc_identity_220422.jpg) no-repeat 50%; background-size: cover; text-align: left; color: #1a1a1a; font-family: 'GmarketSans';}
.dcareer .id_area_v2 .hcopy{font-size: 5rem; padding-top: 130px; font-weight: 700; display:block;}
.dcareer .id_area_v2 .mcopy{font-size: 2.4rem; padding-top: 20px; font-weight: 400;}
.dcareer .id_area_v2 .bcopy{font-size: 1.8rem; padding: 20px 0 43px; font-family: 'NotoSansKR';}
.dcareer .id_area_v2 .startday {font-size: 2.8rem; color: #EA1821; font-weight: 600; padding-bottom: 122px;}

.dcareer .lineup{text-align: center; padding: 120px 0 160px;}
.dcareer .lineup .stit{font-size: 2.4rem; font-family: 'GmarketSans'; font-weight: 600; padding: 80px 0 20px;}
.dcareer .lineup .stit.data{color: #3F69FD;}
.dcareer .lineup .list .box{display: inline-block; width: 240px; font-family: 'NotoSansKR'; font-size: 2rem; font-weight: 400; line-height: 3rem;}
.dcareer .lineup .list .box + .box{margin-left: 180px;}
.dcareer .lineup .list .box .enter{display: block;}
.dcareer .lineup .stit.digital{color: #A041FF;}

.dcareer .recommend{background: #F6F6F6; text-align: center; padding: 120px 0 160px;}
.dcareer .recommend .list{display: inline-block; width: 800px; padding-top: 95px;}
.dcareer .recommend .list li{float: left;}
.dcareer .recommend .list .box{width: 390px; font-family: 'NotoSansKR'; font-weight: 400;}
.dcareer .recommend .list .box:nth-child(3),
.dcareer .recommend .list .box:nth-child(4){padding-top: 80px;}

.dcareer .recommend .list .box .txt{padding-top: 20px; font-size: 2rem;}


.dcareer .detail{padding: 160px 0 80px;}
.dcareer .detail .view_area{position: relative; font-family: 'GmarketSans'; padding-bottom: 120px;}
.dcareer .detail .view_area.right{text-align: right;}
.dcareer .detail .view_area .stt{display: inline-block; font-size: 2rem; font-weight: 700; padding-bottom: 35px;}
.dcareer .detail .view_area.data .stt{color: #3F69FD;}
.dcareer .detail .view_area.digital .stt{color: #A041FF;}
.dcareer .detail .view_area .smtitle{font-size: 4rem; font-weight: 700; padding-bottom: 35px;}
.dcareer .detail .view_area .right_image{position: absolute; top: 50px; right: 0;}
.dcareer .detail .view_area .left_image{position: absolute; top: 50px; left: 0;}
.dcareer .detail .view_area .tag{display: inline-block; font-size: 2rem; font-weight: 700; color: #B1B1B1; padding-bottom: 35px;}
.dcareer .detail .view_area .bdcopy{font-family: 'NotoSansKR'; font-weight: 400; font-size: 2rem; padding-bottom: 45px;}
.dcareer .detail .view_area .btn{display: inline-block; width: 300px; height: 70px; text-align: center; line-height: 73px; font-size: 2.4rem; font-weight: 700; color: #fff; border-radius: 8px;}
.dcareer .detail .view_area.data .btn{background: #3F69FD;}
.dcareer .detail .view_area.digital .btn{background: #A041FF;}
.dcareer .detail .view_area.digital .btn2{display:block; background: #3F69FD; width: 300px; height: 70px; text-align: center; line-height: 73px; font-size: 2.4rem; font-weight: 700; color: #fff; border-radius: 8px; margin-bottom:20px;}


.dcareer .cr_merit{padding: 120px 0; text-align: center;}
.dcareer .cr_merit .exarea{padding-top: 120px;}
.dcareer .cr_merit .exarea.fl .image{float: left;}
.dcareer .cr_merit .exarea.fl .tbox{float: left; padding-left: 70px; text-align: left;}
.dcareer .cr_merit .exarea .tbox .hcopy{display: block; font-size: 3rem; font-weight: 700; padding: 50px 0 20px; text-align: left;}
.dcareer .cr_merit .exarea.ap .image{float: right;}
.dcareer .cr_merit .exarea .tbox .bcopy{display: block; font-family: 'NotoSansKR'; font-weight: 400; font-size: 2rem; text-align: left;}
.dcareer .cr_merit .exarea .tbox .bcopy span{display: block;}
.dcareer .cr_merit .exarea .tbox .bcopy em{font-weight: 700;}



/* IT ????????? Ŀ��??? ????????? : END */



/* FOOTER : START */
#footer_2018 { margin-top:60px; font-size:13px; color:#5f6467; font-family: 'NotoSansKR';}
#footer_2018 .con_inner { padding:10px 0 30px 0; border-top:1px solid #d6dae1; box-sizing:border-box; }
.foot_inner:after { display:block; clear:both; content:''; }	
#footer_2018 .terms { clear:both; padding:10px 0 10px 0;  }
#footer_2018 .terms ul:after { display:block; clear:both; content:''; *zoom:1; }
#footer_2018 .terms li:last-child { background:none }
#footer_2018 .terms li { float:left; margin-right:15px; padding-right:15px; background:url(/resource/images/footer_span_bar.gif) no-repeat 100% 2px; }
#footer_2018 .terms ul:after { display:block; clear:both; content:''; *zoom:1; }
#footer_2018 .terms li:last-child { background:none }
#footer_2018 .terms li strong { font-weight:700; }
#footer_2018 .terms li em { }
.foot_col_wrap { position:relative; padding:0 0 14px 0; }
.foot_col_wrap .box_left { float:left; width:720px; padding:0 20px 0 0; text-align:left; }
.foot_col_wrap .box_right { float:right; width:440px; text-align:left; }
.foot_col_wrap:after { display:block; clear:both; content:''; }
#footer_2018 p { margin-top:10px; line-height:19px; }
#footer_2018 p span { display:inline-block; margin-right:15px; padding-right:15px; background:url(/resource/images/footer_span_bar.gif) no-repeat 100% 4px; word-break:keep-all; }
#footer_2018 .foot_phone ul { float:left; width:230px; margin-top:10px; }
#footer_2018 .foot_phone li { margin:0; padding:3px 0 0 0; }
#footer_2018 .foot_phone ul:after { display:block; clear:both; content:''; }
#footer_2018 .foot_phone span { }
#footer_2018 .foot_award { display:block; margin:13px 0 0 0;  }
#footer_2018 .foot_award li { float:left; width:210px; padding:125px 0 0 0; text-align:center; color:#333; }
/*#footer_2018 .foot_award li:nth-child(1) { background:url(../images/common/foot_award_01.png) no-repeat 34% 10px #fff; padding-top:95px;}*/
#footer_2018 .foot_award li.chosun { background:url(/resource/images/foot_award_chosunEdu.png) no-repeat 50% 15px #fff; background-size: 100px 100px;}
#footer_2018 .foot_award li.kmac { background:url(/resource/images/foot_award_K-BPI.png) no-repeat 50% 15px #fff; background-size: 100px 100px;}
#footer_2018 .foot_award li em {font-weight:bold; font-size:13px; line-height:10px;}
#footer_2018 .foot_award li:nth-child(1):after {content:''; width:1px; height:130px; background-color:#d5d9e2; position:absolute; top:35px; right:230px;}
/*
#footer_2018 .foot_award li { float:left; width:33%; padding:95px 0 0 0; text-align:left; }
#footer_2018 .foot_award li:nth-child(1) { background:url(../images/common/foot_award_01.png) no-repeat 34% 10px #fff; }
#footer_2018 .foot_award li:nth-child(2) { background:url(../images/common/foot_award_02_v2.png) no-repeat 34% 8px #fff; }
#footer_2018 .foot_award li:nth-child(3) { background:url(../images/common/foot_award_03_v2.png) no-repeat 34% 10px #fff; }
*/
#footer_2018 .foot_award ul:after { display:block; clear:both; content:''; }
#footer_2018 .foot_award span { font-size:12px; line-height:16px !important; }
.foot_col_wrap .btn_wrap { padding:10px 0 0 0; text-align:left; }

#footer_2018 .foot_social_wrap { display:inline-block; padding:8px 0 0 10px; }
#footer_2018 .foot_social_wrap .icon_box { display:block; float:left; width:24px; height:24px; margin:0 0 0 8px; background:url(/resource/images/icon_foot_social_v2.png) no-repeat; overflow:hidden; }
#footer_2018 .foot_social_wrap:after { display:block; clear:both; content:''; }
#footer_2018 .foot_social_wrap .i_facebook { background-position:0 0; }
#footer_2018 .foot_social_wrap .i_instar { background-position:-30px 0; }
#footer_2018 .foot_social_wrap .i_navertv { background-position:-60px 0; }
#footer_2018 .foot_social_wrap .i_naverpost { background-position:-90px 0; }
#footer_2018 .foot_social_wrap .i_youtube { background-position:-120px 0; }
#footer_2018 .foot_social_wrap .i_blog { background-position:-150px 0; }
#footer_2018 .foot_social_wrap .i_facebook:hover { background-position:0 -30px; }
#footer_2018 .foot_social_wrap .i_instar:hover { background-position:-30px -30px; }
#footer_2018 .foot_social_wrap .i_navertv:hover { background-position:-60px -30px; }
#footer_2018 .foot_social_wrap .i_naverpost:hover { background-position:-90px -30px; }
#footer_2018 .foot_social_wrap .i_youtube:hover { background-position:-120px -30px; }
#footer_2018 .foot_social_wrap .i_blog:hover { background-position:-150px -30px; }
.btn_s_border {display: inline-block; padding: 3px 10px 5px; border: 1px solid #c0c0c3; border-radius: 2px; background: #fff;}

/* footer ?????????�ž�?????? */
.foot_phone:after { display: block; clear: both; content: ''; }
.foot_phone h4 { margin: 0 0 -10px 0; padding: 20px 0 0 0; font-size: 13px; font-weight: 500; }
.online_sev { padding-top: 30px; }
.online_sev h4 { margin: 0; padding: 0; font-size: 13px; font-weight: 500; }
.online_sev ul { display: inline-block; width: 32.5%; margin: 0; padding: 0; box-sizing: border-box; }
.online_sev li { margin: 0; padding: 3px 0 0 0; box-sizing: border-box; }
.online_sev li span { display: inline-block; width: 60px; }

/* FOOTER : END */


.color_purple{color: #8B41F2;}

/* ����?????? */
.cont-sp{width: 1180px; margin: 0 auto;}
.btnTop{position: fixed; right: 7rem; bottom: 4rem; width: 5rem; height: 5rem; background: rgba(45, 45, 45, .9) url(/resource/images/icon_top.svg) no-repeat 50%; border-radius: 5px;}








.best_lec_wrap { position: relative; /*height: 515px;*/ overflow: hidden; border: 1px solid #525C6B; border-radius: 40px; padding: 24px 80px 8px 80px; margin-bottom: 16px; }
.best_lec_wrap > .title { font-size: 24px; line-height: 30px; padding: 0 0 4px 12px; font-weight: 500;}
/* .language .best_lec_wrap > .title span:before{content: ''; display: inline-block; background: url(/resource/images/icon_best_40_40.svg) no-repeat 50%; width: 40px; height: 40px; margin: 0 8px -12px 10px;} */
main.contents .best_lec_wrap .lec_list_wrap {display: flex;	flex-direction: column;	margin: 0 auto;	width: 100%;}
.best_lec_wrap .lec_list_wrap { display: flex; flex-direction: column; margin: 0 auto; width: 100%; overflow: hidden; }
.best_lec_wrap .lec_list_wrap .listwrap { margin-bottom: 0; display: flex; flex-wrap: nowrap; flex-direction: row;justify-content: center; }
/* .language .best_lec_wrap .lec_list_wrap .row_4rd .st { display: inline-flex; font-size: 18px; line-height: 120%; color: #767676; padding: 0 4px 8px; } 원래 */
.best_lec_wrap .f .row_4rd .st { display: inline-flex;height: 32px; text-align: center; font-size: 15px; font-weight: 600; line-height: 20px; color: #7D899B;  margin: 0 0 8px 0; padding: 4px 10px 4px 4px; border-radius: 99px; background: #f2f6f8; }
.best_lec_wrap .lec_list_wrap .row_4rd .st:before { content: ''; display: inline-block; background: url(/resource/images/icon_medalStar_80_80.png) no-repeat 50%; width: 28px; height: 24px; margin: -4px 0; background-size: 24px 24px; font-weight: 500; }

.best_lec_wrap .lec_list_wrap .row_4rd .infobox .brand {font-size: 17px;}
.best_lec_wrap .lec_list_wrap .row_4rd .lecture {width: 243.5px; margin-bottom: 12px;}
.best_lec_wrap .lec_list_wrap .row_4rd .lecture:hover{background: transparent; border-radius: 30px; transition: 0;}
.best_lec_wrap .left{position: absolute; top: 50%; left: 20px; transform: translateY(-50%); width: 50px; height: 50px; background: url(/resource/images/icon_arrow_lec_left_on.svg) no-repeat 50%;}
.best_lec_wrap .left.end { display: none; background: url(/resource/images/icon_arrow_lec_left_off.svg) no-repeat 50%;}
.best_lec_wrap .right{position: absolute; top: 50%; right: 20px; transform: translateY(-50%); width: 50px; height: 50px; background: url(/resource/images/icon_arrow_lec_right_on.svg) no-repeat 50%;}
ㄹ.best_lec_wrap .right.end { display: none; background: url(/resource/images/icon_arrow_lec_right_off.svg) no-repeat 50%;}

.main.contents .lec_list_wrap{display: flex; flex-direction: column; margin: 0 auto; width: 1134px;}
.lec_list_wrap .title{text-align: center; font-size: 28px; font-weight: 700;}
.lec_list_wrap .title span{color: #0473EA;}
.lec_list_wrap .title span:after{content: ''; display: inline-block; background: url(/images/icon_title_trophy.svg) no-repeat 50%; width: 40px; height: 40px; vertical-align: middle; margin: -6px 0 0 7px;}
.institute_pg .titwrap{display: flex; justify-content: space-between; padding: 11.5px 24px;}
.institute_pg .lec_list_wrap .titwrap .stit{font-size: 24px; font-weight: 600;}
.institute_pg .titwrap .view_all{font-size: 14px; font-weight: 500; color: #737373;}
.institute_pg .titwrap .view_all span:after{content: ''; display: inline-block; background: url(/images/icon_viewall_arrow.svg) no-repeat 50%; width: 16px; height: 16px; vertical-align: middle; margin: -2px 0 0 7px;}

.lec_list_wrap .listwrap{display: flex; flex-direction: row; flex-wrap: wrap; margin-bottom: 40px; font-family: 'Pretendard';}
.lec_list_wrap .lecture .infobox  { text-align: left; }
.lec_list_wrap .row_3rd{display: grid; grid-template-columns: repeat(3, 1fr);}
.lec_list_wrap .row_3rd .lecture{padding: 16px;}
.lec_list_wrap .row_3rd .lecture .thumbnail{border-radius: 32px; overflow: hidden; margin-bottom: 16px; transition: all 0.2s;}
.lec_list_wrap .row_3rd .lecture:hover{background: #F5F5F5; border-radius: 40px; transition: all 0.2s;}
.lec_list_wrap .row_3rd .lecture:hover .thumbnail{transform: translateY(-8px); transition: all 0.2s; -webkit-box-shadow: 0px 6px 12px 0px rgba(0,0,0,0.15); box-shadow: 0px 6px 12px 0px rgba(0,0,0,0.15);}

.lec_list_wrap .row_3rd .lecture .infobox .brand{margin-bottom: 6px; font-size: 24px;}
.lec_list_wrap .row_3rd .lecture .infobox .exp{margin-bottom: 12px; font-size: 15px;}
.lec_list_wrap .row_3rd .lecture .infobox .names{font-size: 13px;}

.lec_list_wrap .row_4rd{display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px 0;}
.lec_list_wrap .row_4rd .lecture { position: relative; padding: 10px 10px 15px 10px;}
.lec_list_wrap .row_4rd .lecture .thumbnail { position: relative; border-radius: 28px; overflow: hidden; margin-bottom: 16px; transition: all 0.2s;}
.lec_list_wrap .row_4rd .lecture:hover{background: #F5F5F5; border-radius: 30px; transition: all 0.2s;}
.lec_list_wrap .row_4rd .lecture:hover .thumbnail{transform: translateY(-4px); transition: all 0.2s; -webkit-box-shadow: 0px 6px 12px 0px rgba(0,0,0,0.15); box-shadow: 0px 6px 12px 0px rgba(0,0,0,0.15);}
.lec_list_wrap .row_4rd .infobox .brand{margin-bottom: 4px; font-size: 20px;}
.lec_list_wrap .row_4rd .infobox .exp{margin-bottom: 10px; font-size: 14px; font-weight: 300;}
.lec_list_wrap .row_4rd .infobox .names{font-size: 13px;}
/* .lec_list_wrap .row_4rd .lecture:first-child .thumbnail::before { position: absolute; top: 0; left: 0; display: inline-block; background: url(/resource/images/icon_medalStar_80_80.png) no-repeat 10px 3px #990FB8; background-size: 24px 24px; width: 94px; height: 32px; padding: 2px 0 0 37px; box-sizing: border-box; border-radius: 0 0 32px 0; content:'BEST'; font-size: 15px;  line-height: 32px; color: #FFEB3B; font-weight: 700; text-align: left; vertical-align: middle; z-index: 2 }
.lec_list_wrap .row_4rd .lecture:nth-child(1)::before { position: absolute; top: -4px; left: 0; display: inline-block; background: url(/resource/images/1st_place_medal_3d.png) no-repeat 50% 40% #353535; background-size: 46px auto; width: 56px; height: 56px; box-sizing: border-box; border-radius: 4px 4px 99px 99px; content:''; font-size: 15px;  line-height: 32px; color: #FFEB3B; font-weight: 700; text-align: left; vertical-align: middle; z-index: 2; box-shadow: 0px 4px 4px 0px rgba(4,111,191,0.25); }
.lec_list_wrap .row_4rd .lecture:nth-child(2)::before { position: absolute; top: -4px; left: 0; display: inline-block; background: url(/resource/images/2nd_place_medal_3d.png) no-repeat 50% 40% #353535; background-size: 46px auto; width: 56px; height: 56px; box-sizing: border-box; border-radius: 4px 4px 99px 99px; content:''; font-size: 15px;  line-height: 32px; color: #FFEB3B; font-weight: 700; text-align: left; vertical-align: middle; z-index: 2; box-shadow: 0px 4px 4px 0px rgba(4,111,191,0.25); }
.lec_list_wrap .row_4rd .lecture:nth-child(3)::before { position: absolute; top: -4px; left: 0; display: inline-block; background: url(/resource/images/3rd_place_medal_3d.png) no-repeat 50% 40% #353535; background-size: 46px auto; width: 56px; height: 56px; box-sizing: border-box; border-radius: 4px 4px 99px 99px; content:''; font-size: 15px;  line-height: 32px; color: #FFEB3B; font-weight: 700; text-align: left; vertical-align: middle; z-index: 2; box-shadow: 0px 4px 4px 0px rgba(4,111,191,0.25); } */
.best_lec_wrap .lec_list_wrap .row_4rd .lecture:first-child .thumbnail::before { display: none; }

/* 공통 베스트 start */
.ranking-wrap { position: relative; overflow: hidden; border: 1px solid #525C6B; border-radius: 40px; padding: 24px 80px 16px 80px; margin-bottom: 16px; }
.ranking-wrap .title { padding: 0 0 12px 0; text-align: center; }
.ranking-wrap .title span { font-size: 24px; font-weight: 600; }
.ranking-wrap .inner { width: 100%; }
.ranking-wrap .inner .rank-list { position: relative; display: flex; flex-wrap: nowrap; align-items: flex-start; justify-content: flex-start; width: 100%; gap: 16px; }

.ranking-wrap .inner .rank-list .unit { position: relative; display: flex; flex-direction: column; width: 100%; gap: 8px; background: #FFF; border-radius: 24px; transition: all 0.2s; align-self: stretch; text-align: left; }
.ranking-wrap .inner .rank-list .unit:nth-child(1):before { background: url(/resource/images/icon_medal_1.png) no-repeat 2px 0; background-size: 60px auto; }
.ranking-wrap .inner .rank-list .unit:nth-child(2):before { background: url(/resource/images/icon_medal_2.png) no-repeat 2px 0; background-size: 60px auto; }
.ranking-wrap .inner .rank-list .unit:nth-child(3):before { background: url(/resource/images/icon_medal_3.png) no-repeat 2px 0; background-size: 60px auto; }
.ranking-wrap .inner .rank-list .unit:nth-child(4):before { position: absolute; top: 0; left: 0; width: 10px; height: 10px; background: url(/resource/images/icon_medal_2.png) #ddd; content: ''; }
.ranking-wrap .inner .rank-list .unit:nth-child(5):before { position: absolute; top: 0; left: 0; width: 10px; height: 10px; background: url(/resource/images/icon_medal_2.png) #ddd; content: ''; }
.ranking-wrap .inner .rank-list .unit .st { display: none; }
.ranking-wrap .inner .rank-list .unit:before {position: absolute; top: 14px; left: -10px; width: 64px; height: 94px; content: ''; z-index: 2; }
.ranking-wrap .inner .rank-list .unit:hover { background: #F5F5F5; border-radius: 28px; transition: all 0.2s; }

.ranking-wrap .inner .rank-list.best3{ gap: 16px; }
.ranking-wrap .inner .rank-list.best4{ gap: 12px; }
.ranking-wrap .inner .rank-list.best5{ gap: 8px; }
.ranking-wrap .inner .rank-list.best3 .unit { display: flex; width: calc((100% - 32px) / 3); padding: 16px; }
.ranking-wrap .inner .rank-list.best4 .unit { display: flex; width: calc((100% - 32px) / 4); padding: 12px; }
.ranking-wrap .inner .rank-list.best5 .unit { display: flex; width: calc((100% - 32px) / 5); padding: 8px; }

.ranking-wrap .inner .rank-list .unit .thumbnail { display: flex; position: relative; width: 100%; border-radius: 20px;  }
.ranking-wrap .inner .rank-list .unit .thumbnail img { width: 100%; max-width: 100%; border-radius: 20px; }
.ranking-wrap .inner .rank-list .unit .thumbnail:after { position: absolute; top: 0; right: 0; bottom: 0; left: 0; border: 1px solid rgba(0,0,0,0.05); content: ''; border-radius: 20px; }
.ranking-wrap .inner .rank-list .unit .flag { flex-direction: row; flex-wrap: wrap; gap: 2px; }
.ranking-wrap .inner .rank-list .unit .flag .icon { display: inline-block; padding: 2px 11px; color: #fff; border-radius: 26px; font-size: 12px; line-height: 22px; margin-bottom: 6px; }
/* .lec_list_wrap .lecture .infobox .icon + .icon { margin-left: 2px; } */
.ranking-wrap .inner .rank-list .unit .flag .icon.end { background: rgb(150,150,150); background: linear-gradient(90deg, rgba(150,150,150,1) 0%, rgba(84,84,84,1) 100%);}
.ranking-wrap .inner .rank-list .unit .flag .icon.soon{background: rgb(255,145,145); background: linear-gradient(90deg, rgba(255,107,139,1) 0%, rgba(160,21,21,1) 80%);}
.ranking-wrap .inner .rank-list .unit .flag .icon.soon span:before{content: ''; display: inline-block; background: url(/resource/images/icon_timer_w.svg) no-repeat 50%; width: 12px; height: 15px; vertical-align: middle; margin: -2px 4px 0 0;}
.ranking-wrap .inner .rank-list .unit .flag .icon.lgu { background: rgb(255,145,145); background: linear-gradient(90deg, #FF89CF 0%, #EE1796 80%); }
.ranking-wrap .inner .rank-list .unit .flag .icon.zoom { background: rgb(255,145,145); background: linear-gradient(90deg, #5C99EB 0%, #0166EB 80%); }
.ranking-wrap .inner .rank-list .unit .flag .icon.youtube { background: rgb(255,145,145); background: linear-gradient(90deg, #FF9898 0%, #EE0808 80%); }
.ranking-wrap .inner .rank-list .unit .flag .icon.other { background: rgb(255,145,145); background: linear-gradient(90deg, #BEACA2 0%, #9A8072 80%); }

.ranking-wrap .inner .rank-list .unit .infobox { display: flex; flex-direction: column; gap: 6px; padding: 0 0 8px 3px; font-family: 'Pretendard'; font-size: 16px; }
.ranking-wrap .inner .rank-list .unit .infobox .brand { font-size: 20px; font-weight: 600; line-height: 1.1; color: #1D1D1D; }
.ranking-wrap .inner .rank-list .unit .infobox .exp { font-size: 14px; font-weight: 400; line-height: 1.2; color: #737373; }
.ranking-wrap .inner .rank-list .unit .infobox .names { padding: 4px 0 0 0; font-size: 14px; font-weight: 400; line-height: 1.2; color: #404040 }
/* 공통 베스트 end */


.lec_list_wrap .row_5rd{display: grid; grid-template-columns: repeat(5, 1fr); gap: 24px 0;}
.lec_list_wrap .row_5rd .lecture{padding: 10px 10px 15px 10px;}
.lec_list_wrap .row_5rd .lecture .thumbnail{border-radius: 28px; overflow: hidden; margin-bottom: 16px; transition: all 0.2s;}
.lec_list_wrap .row_5rd .lecture:hover{background: #F5F5F5; border-radius: 30px; transition: all 0.2s;}
.lec_list_wrap .row_5rd .lecture:hover .thumbnail{transform: translateY(-4px); transition: all 0.2s; -webkit-box-shadow: 0px 6px 12px 0px rgba(0,0,0,0.15); box-shadow: 0px 6px 12px 0px rgba(0,0,0,0.15);}
.lec_list_wrap .row_5rd .infobox .brand{margin-bottom: 4px; font-size: 18px;}
.lec_list_wrap .row_5rd .infobox .exp{margin-bottom: 10px; font-size: 14px; font-weight: 300;}
.lec_list_wrap .row_5rd .infobox .names{display: flex; font-size: 13px;}
.lec_list_wrap .lecture .thumbnail .best { position: absolute; bottom: 10px; left: 10px; width: 4rem; height: 4rem; text-align: center; border-radius: 50%; background: #4B00FC; color: #fff; font-size: 12px; font-weight: 500; border: 0; padding: 13px 0 15px 2px; box-sizing: border-box; z-index: 2; }
.lec_list_wrap .lecture .thumbnail .best1 { position: absolute; bottom: 10px; left: 10px; width: 4rem; height: 4rem; text-align: center; border-radius: 50%; color: #fff; font-size: 12px; font-weight: 500; border: 0; padding: 19px 0 17px 2px; box-sizing: border-box; background: #DBA300 url(/resource/images/icon_best1.svg) no-repeat 50% 20%; background-size:20px 16px;z-index: 2; }

.lec_list_wrap .lecture .thumbnail img{width: 100%;}
.lec_list_wrap .lecture .infobox .icon{display: inline-block; padding: 2px 11px; color: #fff; border-radius: 26px; font-size: 12px; line-height: 22px; margin-bottom: 6px;}
.lec_list_wrap .lecture .infobox .icon + .icon { margin-left: 2px; }
.lec_list_wrap .lecture .infobox .icon.end{background: rgb(150,150,150); background: linear-gradient(90deg, rgba(150,150,150,1) 0%, rgba(84,84,84,1) 100%);}
.lec_list_wrap .lecture .infobox .icon.soon{background: rgb(255,145,145); background: linear-gradient(90deg, rgba(255,107,139,1) 0%, rgba(160,21,21,1) 80%);}
.lec_list_wrap .lecture .infobox .icon.soon span:before{content: ''; display: inline-block; background: url(/resource/images/icon_timer_w.svg) no-repeat 50%; width: 12px; height: 15px; vertical-align: middle; margin: -2px 4px 0 0;}
.lec_list_wrap .lecture .infobox .icon.live_lgu { background: rgb(255,145,145); background: linear-gradient(90deg, #FF89CF 0%, #EE1796 80%); }
.lec_list_wrap .lecture .infobox .icon.live_zoom { background: rgb(255,145,145); background: linear-gradient(90deg, #5C99EB 0%, #0166EB 80%); }
.lec_list_wrap .lecture .infobox .icon.live_youtube { background: rgb(255,145,145); background: linear-gradient(90deg, #FF9898 0%, #EE0808 80%); }
.lec_list_wrap .lecture .infobox .icon.live_other { background: rgb(255,145,145); background: linear-gradient(90deg, #BEACA2 0%, #9A8072 80%); }
.lec_list_wrap .lecture .infobox .brand{display: block; font-weight: 500; line-height: 120%;}
.lec_list_wrap .lecture .infobox .exp{color: #737373;}
.lec_list_wrap .lecture .infobox .names{display: inline-flex; color: #404040; padding-bottom: 10px;}
.institute_pg .titwrap{display: flex; justify-content: space-between; align-items: center;}
.institute_pg .titwrap .title{font-size: 24px; font-weight: 600;}
.institute_pg .titwrap .title span{color: #0473EA;}
.institute_pg .ing_event .titwrap .title span:after{content: ''; display: inline-block; background: url(../images/icon_ing_event_40_40.svg) no-repeat 50%; width: 40px; height: 40px; margin: 0 0 -6px 10px;}
.institute_pg .theme_lec .titwrap .title span:after{content: ''; display: inline-block; background: url(../images/icon_theme_lec_40_40.svg) no-repeat 50%; width: 40px; height: 40px; margin: 0 0 -6px 10px;}
.institute_pg .special_lec .titwrap .title span:after{content: ''; display: inline-block; background: url(../images/icon_special_lec_40_40.svg) no-repeat 50%; width: 40px; height: 40px; margin: 0 0 -6px 10px;}

.institute_pg .ing_event .wrap{display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-bottom: 40px;}
.institute_pg .ing_event .wrap a{display: inline-flex; flex-wrap: wrap; flex-direction: column; width: 270px; height: 158px; padding: 24px 28px; border-radius: 16px; color: #fff;}
.institute_pg .ing_event .wrap .tit{font-size: 18px; line-height: 23px; margin-bottom: 4px;display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; -webkit-line-clamp: 2;}
.institute_pg .ing_event .wrap .date{font-size: 14px; font-weight: 300; opacity: 0.6; line-height: 20px; margin-bottom: 8px;}
.institute_pg .ing_event .wrap .view{display: inline-flex; width: 90px; font-size: 13px; line-height: 32px; padding: 0 16px; border-radius: 32px; background: rgba(0,0,0,0.3); color: rgba(255,255,255,0.6);}
.institute_pg .ing_event .wrap .event01{background: #A564FF;}
.institute_pg .ing_event .wrap .event02{background: #58B78A;}
.institute_pg .ing_event .wrap .event03{background: #1A477D;}
.institute_pg .ing_event .wrap .event04{background: #FFA05C;}

.institute_pg .theme_lec .wrap{display: flex; flex-wrap: wrap; gap: 8px; width: 1104px; margin: 0 auto 40px;}
.institute_pg .theme_lec .wrap a{display: inline-flex; font-size: 18px; line-height: 23px; padding: 11px 12px 11px 24px; border-radius: 48px; font-weight: 500;}
.institute_pg .theme_lec .wrap a .arrow{display: inline-flex; width: 24px; height: 24px; border-radius: 50%; background-image: url(../images/icon_arrow_right_8_13.svg); background-position: 60% 50%; background-repeat: no-repeat; margin-left: 10px;}

.themecolor_01{background-color:#CF30300A; border: 1px solid #CF303066; color:#CF3030;}
.themecolor_01 .arrow{background-color: #CF3030;}
.themecolor_02{background-color:#F671710A; border: 1px solid #F6717166; color:#F67171;}
.themecolor_02 .arrow{background-color: #F67171;}
.themecolor_03{background-color:#F5683D0A; border: 1px solid #F5683D66; color:#F5683D;}
.themecolor_03 .arrow{background-color: #F5683D;}
.themecolor_04{background-color:#FE894A0A; border: 1px solid #FE894A66; color:#FE894A;}
.themecolor_04 .arrow{background-color: #FE894A;}
.themecolor_05{background-color:#FFAA0C0A; border: 1px solid #FFAA0C66; color:#FFAA0C;}
.themecolor_05 .arrow{background-color: #FFAA0C;}
.themecolor_06{background-color:#C881430A; border: 1px solid #C8814366; color:#C88143;}
.themecolor_06 .arrow{background-color: #C88143;}
.themecolor_07{background-color: #9C602A0A; border: 1px solid #9C602A66; color:#9C602A;}
.themecolor_07 .arrow{background-color: #9C602A;}
.themecolor_08{background-color:#9FCB260A; border: 1px solid #9FCB2666; color:#9FCB26;}
.themecolor_08 .arrow{background-color: #9FCB26;}
.themecolor_09{background-color:#8FB5290A; border: 1px solid #8FB52966; color:#8FB529;}
.themecolor_09 .arrow{background-color: #8FB529;}
.themecolor_10{background-color:#2EC3600A; border: 1px solid #2EC36066; color:#2EC360;}
.themecolor_10 .arrow{background-color: #2EC360;}
.themecolor_11{background-color:#18BDAA0A; border: 1px solid #18BDAA66; color:#18BDAA;}
.themecolor_11 .arrow{background-color: #18BDAA;}
.themecolor_12{background-color:#3AAF3F0A; border: 1px solid #3AAF3F66; color:#3AAF3F;}
.themecolor_12 .arrow{background-color: #3AAF3F;}
.themecolor_13{background-color:#7CB87E0A; border: 1px solid #7CB87E66; color:#7CB87E;}
.themecolor_13 .arrow{background-color: #7CB87E;}
.themecolor_14{background-color:#458CA60A; border: 1px solid #458CA666; color:#458CA6;}
.themecolor_14 .arrow{background-color: #458CA6;}
.themecolor_15{background-color:#46CAD90A; border: 1px solid #46CAD966; color:#46CAD9;}
.themecolor_15 .arrow{background-color: #46CAD9;}
.themecolor_16{background-color:#62ADF30A; border: 1px solid #62ADF366; color:#62ADF3;}
.themecolor_16 .arrow{background-color: #62ADF3;}
.themecolor_17{background-color:#4F57D00A; border: 1px solid #4F57D066; color:#4F57D0;}
.themecolor_17 .arrow{background-color: #4F57D0;}
.themecolor_18{background-color:#989EFA0A; border: 1px solid #989EFA66; color:#989EFA;}
.themecolor_18 .arrow{background-color: #989EFA;}
.themecolor_19{background-color:#7D81C60A; border: 1px solid #7D81C666; color:#7D81C6;}
.themecolor_19 .arrow{background-color: #7D81C6;}
.themecolor_20{background-color:#A668FD0A; border: 1px solid #A668FD66; color:#A668FD;}
.themecolor_20 .arrow{background-color: #A668FD;}
.themecolor_21{background-color:#E369DB0A; border: 1px solid #E369DB66; color:#E369DB;}
.themecolor_21 .arrow{background-color: #E369DB;}
.themecolor_22{background-color:#ED32610A; border: 1px solid #ED326166; color:#ED3261;}
.themecolor_22 .arrow{background-color: #ED3261;}
.themecolor_23{background-color:#EC71710A; border: 1px solid #EC717166; color:#EC7171;}
.themecolor_23 .arrow{background-color: #EC7171;}
.themecolor_24{background-color:#C293930A; border: 1px solid #C2939366; color:#C29393;}
.themecolor_24 .arrow{background-color: #C29393;}
.themecolor_25{background-color:#DC387F0A; border: 1px solid #DC387F66; color:#DC387F;}
.themecolor_25 .arrow{background-color: #DC387F;}


.institute_pg .special_lec .wrap{display: flex; flex-wrap: wrap; gap: 12px; width: 1104px; margin: 0 auto 40px;}
.institute_pg .special_lec .wrap .none{display: flex; width: 100%; justify-content: center; align-items: center; padding: 50px 0; border-radius: 32px; background: #F1F2F4; font-size: 20px; line-height: 26px; color: #7D899B;}
.institute_pg .special_lec .wrap a{display: inline-flex; flex-direction: column; gap: 4px; width: 360px; padding: 24px 32px 20px 32px; border-radius: 16px; border: 1px solid #E5E7EB; color: #7D899B;}
.institute_pg .special_lec .wrap a .class{font-size: 14px; color: #1673E3; line-height: 20px;}
.institute_pg .special_lec .wrap a .tit{font-size: 18px; line-height: 23px; font-weight: 500;}
.institute_pg .special_lec .wrap a .date{font-size: 14px; color: #525C6B; line-height: 20px;}
.institute_pg .special_lec .wrap a .name{font-size: 12px; color: #7D899B; line-height: 20px;}