@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Nanum+Gothic:wght@400;700;800&display=swap');
/* CSS Document */


/*공통css*/

*{-webkit-overflow-scrolling: touch;}

html, body  {  margin: 0px; padding: 0px;font-family: "NotoSansKR-Light", "NotoSansKR-Medium" "NanumGothicOTF", "Nanum Gothic", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif; font-size:13px; line-height:150%; letter-spacing:-0.2px; word-break:keep-all; word-wrap:break-word;	-webkit-word-break:keep-all; -webkit-word-wrap:break-word;-moz-word-break:keep-all; -moz-word-wrap:break-word;}
body{max-width: 940px; margin: 0 auto; min-width: 320px;}
a { text-decoration:none; color:inherit; font-size:inherit;}
a, img { border:none;}
img { max-width:100%; height:auto; vertical-align: top;}
ul, li { margin:0; padding:0; list-style:none;}
p {font-size: 13px; margin:0; padding:0; }
h1 {margin: 0 auto;  font-size:23px;; font-family:"NotoSansKR-Medium", "NanumGothic", "Dotum"; text-align: left;}


/*공통css*/
@font-face { font-family:'NanumGothic'; 
	font-style:normal;
	src:url('NanumGothic.eot'), /*IE9 호환성 보기*/
		url('NanumGothic.eot?iefix') format('embedded-opentype'), /*IE 6-8*/
		url('NanumGothic.woff') format('woff'),  /*표준 브라우저*/
		url('NanumGothic.otf') format('opentype'); 
}
@font-face { font-family:'NotoSansKR-Medium'; 
	font-style:normal;
	src:url('NotoSansKR-Medium.eot'), /*IE9 호환성 보기*/
		url('NotoSansKR-Medium.eot?iefix') format('embedded-opentype'), /*IE 6-8*/
		url('NotoSansKR-Medium.woff') format('woff'),  /*표준 브라우저*/
		url('NotoSansKR-Mediumc.otf') format('opentype')
		  /*표준 브라우저*/
}
@font-face { font-family:'NotoSansKR-Light'; 
	font-style:normal;
	src:url('NotoSansKR-Light.eot'), /*IE9 호환성 보기*/
		url('NotoSansKR-Light.eot?iefix') format('embedded-opentype'), /*IE 6-8*/
		url('NotoSansKR-Light.woff') format('woff'),  /*표준 브라우저*/
		url('NotoSansKR-Light.otf') format('opentype')  /*표준 브라우저*/
}



.clear::after{content: ""; display: block; clear: both;}


#wrap{ width:940px; margin:0 auto; text-align:center; position: relative;overflow: hidden;}
/*header css*/
.header {text-align:center;	width:100%; background-color:#fff; z-index:999; position: relative; position: relative;}
.header h1{ width:100%; text-align:center;  position: relative;  height: 62px;}
.header h1::after{display: block; content: ""; clear: both;}
.header h1.logo img{ vertical-align:middle}
.header h1 .btn_logo{display: block;position: absolute;left: 50%; top: 50%; transform: translate(-50%,-50%); width: 220px;}
.header h1 .btn_live{line-height: 1em; position: absolute;display: block;font-weight: bold;font-size: .75em; padding: 21.5px 20px;font-family: "NotoSansKR-Medium", "NanumGothic", "Dotum";right: 0;top: 2px;}
.header_fix {position:fixed; top:0px;}
.header .a_home {position:absolute; top:8px; left:8px;}
.login_icon{ width: 22px!important; padding-right: 7px !important; margin-top: -4px !important;}
.gotop {position:fixed; position:absolute; right:6%; bottom:5%; width:55px; height:30px; z-index:3; background:url(../image/top_bottom.png) center 13px no-repeat #303338; background-size:12px; -moz-border-radius:100px; -webkit-border-radius:100px; border-radius:100px; color:#fff; padding:23px 0 0px 0; text-align:center;}
.btn_menu{display: none;}
.side_tab_wrap{display: none;}
.btn_menu img{display: none;}




/* container css */
.container_main {padding:0;}
.level_test {width:100%;background: #fff8f3;}
.level_test_inner{padding: 4%;}
.cam_new_wrap{width: 100%;}
.level_tit {width: 97%; margin: 0 auto; font-size:35px; color:#3a3a3a; font-family:"NotoSansKR-Medium", "NanumGothic", "Dotum";  text-align:left}
.level_tit span { color:#3a3a3a; font-size:18px; display:inline-block; margin:10px 0}
.level_btn {margin:20px 0 0 0; padding:0; text-align: left;}
.level_btn::after{clear: both; content: ""; display: block;}
.level_btn li { display:block; width:35%; text-align:center; vertical-align:top; float: left; padding: 0 1%;box-sizing: border-box;-webkit-box-sizing: border-box;-ms-box-sizing:border-box;-o-box-sizing:border-box;}
.level_btn li.lvonline a{background:#f77012; border:1px solid #f77012;}
.level_btn li.lvcam a{background:#ffad25; border:1px solid #ffad25;}
.level_btn li.cam_search{ width:29%;}
.level_btn li.cam_search a{ color:#7b5416;border:1px solid #f3dbca;}

.level_btn li a { color:#fff; padding:20px 0; display:inline-block; font-size:20px; width:100%; line-height:1.3}


.brand_wrap ul{padding: 4% 3% 0 3%;background: #f2f2f2;}
.brand_wrap ul::after{clear: both; display: block; content: "";}
.brand_wrap ul li{ width:31.3333%; float: left; padding: 0 1%;}
.con_langcon { background:#f78912; display:block;border-radius: 8px;-webkit-box-shadow: 3px 3px 3px 0px rgb(0 0 0 / 10%);box-shadow: 3px 3px 3px 0px rgb(0 0 0 / 10%);}
.con_ele { background:#a3db35; display:block;border-radius: 8px;-webkit-box-shadow: 3px 3px 3px 0px rgb(0 0 0 / 10%);box-shadow: 3px 3px 3px 0px rgb(0 0 0 / 10%);}
.con_mid { background:#3e95e7; display:block;border-radius: 8px;-webkit-box-shadow: 3px 3px 3px 0px rgb(0 0 0 / 10%);box-shadow: 3px 3px 3px 0px rgb(0 0 0 / 10%);}
.brand_img{padding: 24px 0 19px 0;}
.con_text { text-align:center; font-size:16px; color:#fff; line-height:25px;}
.con_tit { text-align:center; font-size:24px; color:#fff; font-family:"NotoSansKR-Medium", "NanumGothic", "Dotum"; padding-bottom: 30px;}
.con_etc .etc_tit.t04{ font-size: 32px;}

.con_etc {position: relative; display:block; text-align:left; width:100%; padding: 4% 4% 4% 4%; box-sizing: border-box;-webkit-box-sizing: border-box;-ms-box-sizing:border-box;-o-box-sizing:border-box;}

.con_etc .con_etc_inner{z-index: 10; position: relative; background: #fff; border-radius: 8px; padding: 4%; box-sizing: border-box;-webkit-box-sizing: border-box;-ms-box-sizing:border-box;-o-box-sizing:border-box;
	-webkit-box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.10); box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.10);}

.con_etc ul{width: 100%;}
.con_etc ul::after{clear: both; display: block; content: "";}
.con_etc ul li{width: 50%; float: left; box-sizing:border-box;-webkit-box-sizing: border-box;-ms-box-sizing:border-box;-o-box-sizing:border-box; position:relative}
.con_etc .ic-new{position: absolute;top: 0;right: 0;background: #ff5852;color: #fff;border-radius:0 0 10px 10px;padding:6px 16px;letter-spacing: 0;font-weight: bold; font-size:18px}

.con_etc ul li a{position: relative; width: 100%; display: block; box-sizing:border-box;-webkit-box-sizing: border-box;-ms-box-sizing:border-box;-o-box-sizing:border-box;}
.con_etc ul li:nth-child(1){border-bottom: 1px solid #e9e9e9;border-right: 1px solid #e9e9e9;padding: 0 4% 4% 0;}
.con_etc ul li:nth-child(2){border-bottom: 1px solid #e9e9e9;padding: 0 0 4% 4%;}
.con_etc ul li:nth-child(3){border-right: 1px solid #e9e9e9;padding: 4% 4% 0 0;}
.con_etc ul li:nth-child(4){padding: 4% 0 0% 4%;}

.con_etc .text_text {line-height: 1em;  color:#464646; font-size:20px; font-family:"NotoSansKR-Medium", "NanumGothic", "Dotum"}

.m_arrow{position: absolute; right: 0; width: 18px; top: 50%; transform: translatey(-50%);}

.etc_tit {font-weight: 600; position: relative; font-size:35px; line-height: 1em; font-family:"NotoSansKR-Medium", "NanumGothic", "Dotum"; margin-top: 10px;}
.etc_tit.t01{color: #965e2d;}
.etc_tit.t02{color: #6db02d;}
.etc_tit.t03{color: #f77112;}
.etc_tit.t04{color: #2d89e0;}
   
.program {display:block; width:100%;}
.program ul { padding:0; margin:0 auto; width:100%; }
.program ul::after{clear: both; display: block; content: "";}
.program li { display:block; background-color:#fff; width:33.3333%; text-align:center; margin-bottom:10px; float: left;
box-sizing: border-box; -webkit-box-sizing: border-box;-ms-box-sizing:border-box;-o-box-sizing:border-box;}
.program li img { height:50px;}
.program li span { display:block;}
.program li a {display: block; color:#48565f; font-size:16px; font-family:"NotoSansKR-Medium", "NanumGothic", "Dotum";background-color: #e9ecf2;}
.program li a.pro_h {background:#e9ecf2 url(../image/main/hakuna.png) center 11px no-repeat; background-size:53px; padding:32px 0 10px; width: 98%; margin:0 auto 0 0;}
.program li a.pro_m {background:#e9ecf2 url(../image/main/matata.png) center 11px no-repeat; background-size:82px; padding:32px 0 10px;}
.program li a.pro_skill {background:#e9ecf2 url(../image/main/skill_builder.png) center 11px no-repeat; background-size:80px; padding:32px 0 10px;width: 98%;margin: 0 0 0 auto;}
.program li a.pro_s {background:#e9ecf2 url(../image/main/creal.png) center 11px no-repeat; background-size:50px; padding:32px 0 10px; width: 98%; margin:0 0 0 auto;}
.program li a.pro_c {background:#e9ecf2 url(../image/main/creal.png) center 11px no-repeat; background-size:50px; padding:32px 0 10px; width: 98%; margin:0 auto 0 0;}
.program li a.pro_b {background:#e9ecf2 url(../image/main/boombook.png) center 11px no-repeat; background-size:80px; padding:32px 0 10px; width: 98%; margin: 0 auto;}
.program li a.pro_d {background:#e9ecf2 url(../image/main/dotori.png) center 11px no-repeat; background-size:80px; padding:32px 0 10px; width: 98%; margin: 0 auto;}

/* App down 영역 */
/*.application {margin-bottom:20px; display:inline-block; width:100%; border-top:1px #e9ecf2 solid; text-align:center; margin:0 auto}*/
.application {margin-bottom:10px; display:inline-block; width:100%;  text-align:center; }
.application h5{ font-size:2em; color:#000; text-align:center; padding:24px 0 10px 0;letter-spacing:-1px}
.application ul{width:85%;margin-left:0;margin-right:0; text-align:left;box-sizing:border-box;-webkit-box-sizing:border-box;-ms-box-sizing:border-box;-o-box-sizing:border-box; display:inline-block}
.application li {float:left;width:33.333%;margin:1vw auto;}
.application li:first-child { margin-left:0; border-left:none; padding-left:0}
.application li img { height:48px;}
.application li a {display: inline-table; color:#5e6778; font-size:15px; font-family:"NotoSansKR-Medium", "NanumGothic", "Dotum"; text-align:left; height:48px}
.application li a.app_langconisland{background:url(../image/main/ic_app_langconisland.png) left 0 no-repeat; background-size:48px}
.application li a.app_yuhak{background:url(../image/main/ic_app_yuhak.png) left 0 no-repeat; background-size:48px}
.application li a.app_alma {background:url(../image/main/ic_app_alma.png) left 0 no-repeat; background-size:48px}
.application li a.app_elmt {background:url(../image/main/ic_app_elmt.png) left 0 no-repeat; background-size:48px}
.application li a.app_midd {background:url(../image/main/ic_app_midd.png) left 0 no-repeat; background-size:48px}
.application li a.app_albus {background:url(../image/main/ic_app_albus.png) left 0 no-repeat; background-size:48px}
.application li a .right_txt{ text-align:left;  padding-left:60px; height:48px; display:inline-table; float:left}
.application li a p{text-align:left; display:table-cell;letter-spacing:-1px; font-size:1em; vertical-align:middle}
.application li a .apptitle{color:#41444e; font-size:16px;letter-spacing:-1px}
.application li a .right_txt .elmt{color:#f26451; display:inline-block; margin-left:3px }
.application li a .right_txt .midd{color:#1e9dff; display:inline-block; margin-left:3px}
.application li a .right_txt .langi{color:#ff7800;}


/* footer */
.footer {width:100%; max-width: 940px; background-color:#3d424c; text-align:center; margin: 0 auto;}
.footerin{width: 92%; margin: 0 auto; position: relative; text-align:left}
.footer a{color: #fff !important;}
.company_menu {text-align: center; width:100%; margin:15px 0 10px; display:inline-block;  *margin-bottom:0;}
.company_menu_m{text-align: left; width:100%; margin:15px 0 10px; display:inline-block;  *margin-bottom:0;}
.company_info{display:inline-block}
.company_info li {display:inline; color:#d5dce1; margin-right:10px; padding-right:10px; background:url(../image/company_list.gif) right center no-repeat; font-size:11px}
.company_info li a { color:#d5dce1;}
.company_info li.personal { background-image:none; margin-right:0; padding-right:0; font-weight:bold;}
.pc_box_m {margin:10px 0 0 0;}
.pc_box_m li{max-width: 106px; text-align: center; display:inline-block; border:#79828a 1px solid;width: 30%;margin: 0 3px; padding: 3px 0;}
.pc_box_m li:first-child{margin: 0 3px 0 0;}
.pc_box_m a { color:#d5dce1 !important; font-size:11px; width: 100%;}
.pc_box_m a img {width:13px; vertical-align:sub; margin-right:4px;}

.company_menu .pc_box {margin:10px 0 0 0;}
.company_menu .pc_box a { color:#d5dce1; font-size:11px; border:#79828a 1px solid; padding:3px 7px; display:inline-block; margin:0 5px;}
.company_menu .pc_box a img {width:13px; vertical-align:sub; margin-right:4px;}



.aw_sns_box{width: 100%;margin-top: 7px;}
.aw_sns_box::after{clear: both; content: ""; display: block;}

.aw_box{float: left; }
.aw_box::after{clear: both; content: ""; display: block;}
.aw_box li{float: left;margin-left: 5px;}
.aw_box li:first-child{margin-left:0}
.aw_box li a{display: block;}


.sns_box {float: right; }
.sns_box::after{clear: both; content: ""; display: block;}
.sns_box li{margin-left: 10px; float: left;}
.sns_box li a{display: block;}

.adress a{color:#9296a0; font-size:11px; font-weight: normal;}
.adress_m p {text-align:left; color:#9296a0; font-size:11px; line-height:15px;}
.adress_m p span.call_center {font-weight:bold; color:#9296a0;}
.adress p {text-align:center; color:#9296a0; font-size:11px; line-height:15px;}
.adress p span.call_center {font-weight:bold; color:#9296a0;}
.copy {margin-top:5px;text-align:left; color:#9296a0; font-size:11px; line-height:15px; padding-bottom: 25px;}
.adress .adress_info {color:#d5dce1;}

/* footer 동아일보 중앙일보 배너 */
.newspaper {display:block; width:150px;}


.fix {position: absolute !important; bottom: 0; left: 50%; transform: translateX(-50%);}

.swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction{ margin: 0px !important; position:absolute !important; bottom:5px !important;}
.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {width:7px; height:7px;}


/*footer-cs*/
.csbox{color: #101010;font-family: 'Noto Sans KR', sans-serif;border:1px #252930 solid; padding:10px 4%; background: #fff; display:inline-block; margin-top: 10px}
.csbox_left{float: left; margin-right:36px;text-align:left}
.csbox_right{float: left; font-size: 12px;text-align: center;line-height: 2.5; margin-top:15px}
.csbox .cs01{display: inline-block; font-size: 1.5em; line-height: 20px; font-weight: bold;color: #101010; margin-bottom:5px}
.csbox .cs02{font-size: 2.3em;font-weight: 700;line-height: 27px;color: #101010;font-family: 'Noto Sans KR', sans-serif;}
.csbox .cs02 a{color: #101010 !important}
.csbox .cs03 {color: #939393; font-size: 1.1em; font-family: 'Noto Sans KR', sans-serif;}
.csbox_left ul{margin-left: 20px;}
.csbox_left li{color: #6a6a6a;line-height:1.5;font-size:1em;list-style: outside;text-indent:-5px; font-family: 'Noto Sans KR', sans-serif;}
.csbox_left li .point{background: #e2ffff; font-size: 1.1em; font-weight: bold; color: #217ff0;}



/* layerpop */
.popup {overflow:hidden; position:fixed; width:850px; height:640px; top:60%; margin:-320px 0 0 -425px; left:50%}
.popup span.closeBtn_pop {position:absolute; right:12px; top:12px; cursor:pointer}
.popup span.today_hide{position:absolute; color:#512404; font-size:21px; bottom:20px; left:20px; text-align:right; display:block; z-index:110}
.popup span.goBtn {position:absolute; width:270px; right:30px; top:197px; z-index:2002; cursor:pointer}


/*Live Class 영역*/
.livecon{text-align:center; border-bottom:none; position:relative; font-family: "NotoSansKR-Medium", sans-serif; width:100%; background:#fff;}
.liveClassBanner::after{clear: both; display: block; content: "";}
.livecon .liveClassBanner .liveclassbgTxt{width: 55%; margin:5% 0 0 5%; transition: all 0.3s; float:left}
.livecon .liveClassBanner .liveclassbgImg{width: 25%; position: absolute; right: 3%; top:7%;transition: all 0.3s;}
.livecon .liveClassBanner .liveText .t_unt{color:#365d96;display: inline-block;box-sizing: border-box;}
.liveText{white-space: nowrap;}
.livecon .video{ display:inline-block}
.livecon .video .t_en{margin:3% 0 5% 0; color:#58586a; font-family:"NotoSansKR-Medium", sans-serif; text-align:left; display:inline-block;line-height:1.7; width:94%}
.livecon .video .t_en p{font-size:1.8em; word-break:keep-all}
.livecon .video .t_en p .b{ font-size:1.15em; color:#171948;}
.livecon .liveadarea{width:96%; display:inline-block; margin:1% 0 1% 0; text-align:center}
.livecon ul{width:100%; letter-spacing:-.065em;}
.livecon li{color:#3a3a3a; padding:1.5% 0; width:50%; display:inline-block; float:left; position:relative}
.livecon li .bd_l{border-left:1px #e9e9e9 solid; position:absolute; left:0; top:0; width:1px; height:100%}
.livecon li .bd_t{border-top:1px #e9e9e9 solid;; position:absolute; left:0; top:0; width:100%; height:1px}
.livecon li:nth-child(1){border-left:none; border-top:none}
.livecon li:nth-child(2){border-top:none}
.livecon li:nth-child(3){border-left:none}
.livecon li .txtcon{width:100%; word-break:keep-all}
.livecon li .adimg{ text-align:center; margin:0 auto}
.livecon li .adimg img{vertical-align:middle;}
.livecon li p{text-align:center; font-size:1.55em; line-height:2; vertical-align: middle}
.livecon li .txt_l{ font-size:1.7em; font-weight:700; color:#3a3a3a}
.livecon li .subp_txt{ font-size:1.2em; line-height:2em}
.livecon .livecs{font-size:1.8em; color:#5b5b5b; width:95%; text-align:right; font-weight: bold; margin:2% 0; letter-spacing:-.05em }
.livecon .livecs a{font-size:1.6em; color:#3a3a3a; display: inline-block; margin-left: 10px; font-weight: bold; line-height:1.2}


/* .writingBanner a{width: 100%; height: auto;} */
.writingBanner{margin: 2% auto 2% auto;}
.writingBanner .swiper-slide img{width: 100%; border-top:1px solid #eef2f6; border-bottom: 1px solid #eef2f6;}
.writingBanner .swiper-container-horizontal>.swiper-pagination-bullets,
.writingBanner .swiper-pagination-custom, .swiper-pagination-fraction{bottom:1em !important;}
.writingBanner .swiper-pagination-bullet{background: rgb(95, 95, 95); opacity: 0.5;}
.writingBanner .swiper-pagination-bullet-active{background:#3ca8df; opacity: 0.8; }
.writingBanner .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{width: 5px; height: 5px;}

.writingBanner .swiper-slide.no_wr img{width: auto !important; border-top: 0 !important; border-bottom: 0 !important;}


/*이러닝프로그램*/
.online_con{background:#eef2f6; width:100%; text-align:center; position:relative; padding:1.5rem 0;}
.online_con .onlinearea{}
.online_con .onlinearea h3{ width:100%; margin:1.5em auto; font-family: 'NotoSansKR-Medium", sans-serif';}
.online_con .onlinearea h3 .cltit{font-size:1.4em; color:#252525;  word-break:keep-all; font-weight:600;letter-spacing: -.02em;}
.online_con .onlinearea h3 .point{color:#3e55b5; font-size:1.5em}
.online_con .onlinearea ul{ display:inline-block}
.online_con .onlinearea li{display:inline-block; width:44%; background:#f0f0f0; outline:1px #d9d9d9 solid; position:relative; text-align:center; margin:1%; /*-webkit-box-shadow: 3px 3px 5px -1px rgba(0,0,0,0.20); -moz-box-shadow: 3px 3px 5px -1px rgba(0,0,0,0.20); box-shadow: 3px 3px 5px -1px rgba(0,0,0,0.20);*/ height:29vh; vertical-align:top}
.online_con .onlinearea li a{cursor:pointer; font-size:0}
.online_con .onlinearea li a:hover{ text-decoration:none; color:inherit}

.online_con .onlinearea li:nth-child(1){background:#fffce9}
.online_con .onlinearea li:nth-child(2){background:#fff9ec}
.online_con .onlinearea li:nth-child(2) .appcon2{left:50%}
.online_con .onlinearea li:nth-child(3){background:#f9fff3}
.online_con .onlinearea li:nth-child(4){background:#faf5f0}
.online_con .onlinearea li:nth-child(5){background:#ecf7fb}
.online_con .onlinearea .icnew{position:absolute; right:.5em; top:.5em; z-index:1; width:14%}
.online_con .onlinearea .icnew{position:absolute; right:.5em; top:.5em; z-index:1; width:14%}
.online_con .onlinearea .icup{position:absolute; right:.5em; top:0; z-index:1; }
.online_con .appimgarea{ position:relative;height:24vh; width:100%}
.online_con .appimgarea .imgin{ display:table; margin:0 auto;height:24vh}
.online_con .otherbox .appimgarea .imgin{ height:9vh}
.online_con .otherbox .appimgarea .imgin .ic{vertical-align:middle; display:table-cell}

.online_con .appimgarea .apptit{margin:0 auto; display:block; padding:6% 0; width:50%}
.online_con .appimgarea .appcon{ width:50%}
.online_con .appimgarea .appcon2{ position:absolute; left:0; bottom:0}
/* .online_con .onlinearea li:nth-child(3) .apptit{ width:45%; padding: 6% 0 0 0;} */
.online_con .onlinearea li:nth-child(3) .apptit{ width:57%; padding: 6% 0 0 0;}
.online_con .onlinearea li:nth-child(3) .appcon{ width:78%; position: absolute; bottom: 0; right:0; margin-right:11%;}

.online_con .onlinearea .apptitarea{ background:#fff; width:100%; border-top:1px #eaeaea solid; display:inline-block; position:absolute; left:0; bottom:0; height:5vh; display:table}
.online_con .onlinearea .apptitarea .apptitcon{ display:table-cell; vertical-align:middle}
.online_con .onlinearea .apptitarea .more{ display:none}
.online_con .onlinearea .apptitarea p{font-size:1.3rem; font-weight:bold; width:52%; text-align:center; margin:0 auto;font-family:'NotoSansKR-Medium", sans-serif'; color:#222; display: inline-block; vertical-align:middle;letter-spacing: -0.1em}
.online_con .onlinearea .apptitarea p.target{font-size:1.2rem; width:43%; text-align:left}
.online_con .onlinearea .apptitarea p.target span{ color:#fff; font-size:1rem; font-family:'NotoSansKR-Medium", sans-serif'; font-weight:bold; background:#6a6a6a; border-radius:5px; margin-right:.5em; padding:.2em .5em; line-height:inherit;}
.online_con .onlinearea .apptitarea p img{ vertical-align:middle; float:right}

.online_con .onlinearea li.otherbox{outline:0; background: none; vertical-align:top; position:relative; box-shadow:none}
.online_con .otherbox .otherapp{width:100%; background:#f0f0f0; outline:1px #d9d9d9 solid;vertical-align:middle; display:inline-block; height:14vh; /* -webkit-box-shadow: 3px 3px 5px -1px rgba(0,0,0,0.20); -moz-box-shadow: 3px 3px 5px -1px rgba(0,0,0,0.20); box-shadow: 3px 3px 5px -1px rgba(0,0,0,0.20);*/}
.online_con .otherbox .otherapp:nth-child(1){position:absolute; left:0; top:0}
.online_con .otherbox .otherapp:nth-child(2){position:absolute; right:0; bottom:0}
.online_con .otherapp .appimgarea{ display:table;height:auto;width: 54%;  margin:0 auto;}
.online_con .otherapp .appimgarea .apptxt{font-size:1.3rem; font-weight:bold; width:90%; text-align:left; margin:0 auto;font-family:'NotoSansKR-Medium", sans-serif'; color:#222; display:table-cell;  vertical-align:middle}
.online_con .otherapp .appimgarea img{ margin-right:1.5rem; max-width: initial;    display: table-cell; vertical-align: middle; width:4vw}

	
/* 입학 절차 안내 버튼 */
.step_btn a{ width: 97%; margin: 10px auto 0 auto; display: block; height: 60px; line-height: 60px; font-weight: 500; color: #fff; background: #fe9a00; border: 1px solid #fe9a00;font-family: "NotoSansKR-Medium", "NanumGothic", "Dotum";}
.step_btn span{display: inline-block;line-height: 60px;font-size: 23px;}
.step_btn img{width: 23px; margin:1px 0 0 5px; display: inline-block;}

/* 교실수업*/
.livecon .liveClassBanner .liveText{float: left;line-height: 1;font-size: 2.5em;color: #3180df; font-weight: 900;margin: 4% 0;font-family: "NotoSansKR-Medium", "NanumGothic", "Dotum";letter-spacing: -0.03em;transition: all 0.3s;display: inline-block;text-align: left;}
.livecon .liveClassBanner .liveText .memberCountCon{font-size: 1.7em; font-weight: 900; color:#365d96; margin-left:.2em; display: inline-block;    box-sizing: border-box;}
.livecon .liveClassBanner {background: #fff; width:90%; position: relative; margin:0 auto; display:block;}
.offline_class a{cursor: pointer;display: block;  padding: 4% 4% 0 4%;}
.offline_class a img{border-radius: 8px;-webkit-box-shadow: 3px 3px 3px 0px rgb(0 0 0 / 10%);box-shadow: 3px 3px 3px 0px rgb(0 0 0 / 10%);}
.online_class a{cursor: pointer;display: block; padding: 4%;}
.online_class a img{border-top-left-radius: 8px; border-top-right-radius: 8px;-webkit-box-shadow: 3px 3px 3px 0px rgb(0 0 0 / 10%);box-shadow: 3px 3px 3px 0px rgb(0 0 0 / 10%);}
.livecon{cursor: pointer;border-bottom-left-radius: 8px; border-bottom-right-radius: 8px; -webkit-box-shadow: 3px 3px 3px 0px rgb(0 0 0 / 10%);box-shadow: 3px 3px 3px 0px rgb(0 0 0 / 10%);}
.liveText span{display: inline-block;}
.livetext_btn{float: right;width: 35px;position: absolute; top: 50%;right: 0;transform: translateY(-50%);}
.classCount_wrap {font-size: 26px;display: inline-block;color: #3a3a3a;display: inline-block;font-weight: 900; box-shadow: inset 0 -11px 0 #ffc960;}
.classCount{display: inline-block;}
.livetext_btn{box-shadow:none !important} 
.con_etc::after{content: ""; background: #f2f2f2; width: 100%;height:100%; display: block;position: absolute; top: 0;left: 0; right: 0;z-index: 5;}
/* //교실수업*/


/* .side_tab_wrap{display: none;}
.btn_menu{display: none;} */

/* 라이브 클래스 전환 시*/
/* 
.livecon .liveClassBanner .liveText{float: left; line-height: 1; font-size:2.5em; color: #3180df; font-weight: 900;  font-family: "NotoSansKR-Medium", "NanumGothic", "Dotum"; letter-spacing: -0.03em; transition: all 0.3s; display:inline-block;text-align:left}
.livecon .liveClassBanner .liveText .memberCountCon{font-size: 1.7em; font-weight: 900; color:#365d96; margin-left:.2em}
.livecon .liveClassBanner {background: #fff; width:90%; position: relative; margin: 4% auto; display:block;}
.header h1{border-bottom: 1px solid #e9e9e9;}
.online_class_Live a{cursor: pointer;display: block; padding: 0 4% 2% 4%;}
.livecon .liveClassBanner .liveText.Live{color:#545454 !important;}
.livecon .liveClassBanner .liveText.Live .memberCountCon{color:#965e41 !important;}
.livecon .liveClassBanner .liveText.Live .t_unt{color:#965e41 !important;}
.liveText span{display: inline-block;}
.livetext_btn{float: right;width: 35px; position: absolute; top: 50%;right: 0;transform: translateY(-30%);box-shadow:none !important}
.classCount_wrap {font-size: 26px;display: inline-block;color: #3a3a3a;display: inline-block;font-weight: 900; box-shadow: inset 0 -11px 0 #ffc960;}
.classCount{display: inline-block;}

.con_etc{padding: 3% 4% 5% 4%; background: #f2f2f2;} */
/* //라이브 클래스 전환 시 */



/* 드림레터, 라이팅스타 */
.dream_box{cursor: pointer; position: absolute;top: 16%; width: 35%;left: 0; height: 26%;}
.writing_box{cursor: pointer;  position: absolute;top: 16%;width: 35%; left: 35%;height: 26%;}
.dream_sub_box{cursor: pointer;position: absolute;top: 11%; width: 54%;left: 0;height: 26%;}
.writing_sub_box{cursor: pointer;position: absolute; top: 11%;width: 46%;right: 0;height: 26%;}

/* 교실수업, 라이브클래스 축소*/
.class_liveclass_wrap{width: 92%;margin: 3% auto;}
.class_liveclass_wrap::after{display: block; clear: both; content: "";}
.offline_class_small{position: relative; width: 48.5%; float: left;}
.offline_class_small img{-webkit-box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.10); box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.10);border-radius: 8px;}
.live_class_small{position: relative; width: 48.5%; float: right;}
.live_class_small img{-webkit-box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.10); box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.10);border-radius: 8px;}
.live_class_small .liveText{position: absolute; bottom: 8%;left: 7%;text-align: left;  line-height: 1; font-size: 1.7em;color: #3180df; font-weight: 900; font-family: "NotoSansKR-Medium", "NanumGothic", "Dotum"; letter-spacing: -0.03em; transition: all 0.3s;}
.live_class_small .liveText .memberCountCon{font-size: 2em;font-weight: 900; color: #365d96;display: inline-block;box-sizing: border-box;}
.live_class_small .liveText .t_unt{color: #365d96;}
.liveText .top_txt{display: block;margin-bottom: 5px;}
.liveText .bottom_txt{display: block;}

/* 1:1매치 */
.match_wrap{ position: relative; display: BLOCK;}
.match_avatar01{ position: absolute; top: 1%; right: 34.5%; width: 13.5% !important; border: none !important;}
.match_avatar02{position: absolute; bottom: 10%; right: 13%; border: none !important; width: 9.2% !important;}
.match_avatar03{transform: rotate(90deg);
    -moz-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
    filter: FlipH;
    -ms-filter: "FlipH";
    position: absolute;
    top: 20.5%;
    right: 5%;
    width: 24.5% !important;
    border: none !important;}


.no_wr a{display: block; position: relative;}
.aL_txt01{position: absolute; top: 36%;left: 8%;}
.aL_txt02{ position: absolute; top: 45.5%;left: 52.5%;  animation-delay: .2s; }
.aL_btn{  position: absolute; top: 45.5%;left: 75.5%; animation-delay: .8s;}
.aL_btnimg{-webkit-animation: albee03 1.5s infinite; animation: albee03 1.5s infinite; animation-delay: 1s;}
.aL_beewrap{ position: absolute; top: 28%; left: 50%; animation-delay: 1.3s;}
.aL_bee{  animation: updownbee 1s infinite; animation-delay: 1s;}

@keyframes albee03 {
	0% {transform: scale(1); }
	50%   {transform: scale(.9);}
	100% {transform: scale(1);}
  }
  
  @keyframes updownbee {
	0% {margin-top: 0; }
	50%   {margin-top: -7%;}
	100% {margin-top: 0; }
  }



.game{position: absolute; z-index: 999; font-size: 28px; font-weight: bold; color: #fdd8be; text-indent: -1px; top: 62%; left: 4.5%; padding: 20px 20px;background: #4b2178;}
.CountCon{display: inline-block;color: #f77012;  font-size: 41px; font-weight: 900; width: 250px;}
.step_btn::after{display: block; content: ""; clear: both;}
.cam_txt{float: left;}
.step_btn img.location_btn{float: left; width: 20px; display: inline-block;  margin: 17px 10px 0 20px;}
.step_btn img.arrow_btn{float: right; width: 16px; display: inline-block; margin: 18px 20px 0 0; }






/* 221116 홈페이지 메인 변경 */
.cam_new_wrap{width: 100%;}
.cam_new_wrap::after{display: block; content: ""; clear: both;}
.cam_l_btn a{float: left; width: 70%;display: block;  height: 156px; line-height: 156px;font-weight: 800; color: #fff;background: #fe9a00;font-size: 30px;border-radius: 12px;font-family: "NotoSansKR-Medium", "NanumGothic", "Dotum";}
.cam_r_btn{float: right; width: 28%;}
.cam_r_btn li a{width: 100%; height: 72px;border: 1px solid #886339;display: block; border-radius: 12px; line-height: 72px; font-size: 20px; color: #886339;font-weight: bold;}
.cam_r_btn .mb7{margin: 0 0 7px }	
.level_sub_wrap{text-align: left;letter-spacing: -1px; margin: 0 0 2% 0;}
.level_sub{display: inline-block; font-size: 25px; color: #333; font-weight: 700;}
.level_sub_tit{display: inline-block; font-size: 38px; color: #f77012;font-weight: 900; line-height: 1;margin: 0 0 0 10px;}
.cam_new_wrap img{vertical-align: initial;}
.location_btn_new{width: 26px; display: inline-block;  margin: 0 2px -2px 0;}
.arrow_btn_new{width: 21px; display: inline-block; margin: 0 0 -7px 2px; }


/*
##Device = Desktops
##Screen = 1281px to higher resolution desktops
##Device = 데스크탑
##Screen = 1281px 이상 해상도 데스크탑
*/

  
@media (min-width: 1281px) {
}

/*
##Device = Laptops, Desktops
##Screen = B/w 1025px to 1280px
##Device = 랩탑, 데스크탑
##Screen = 1025px에서 1280px 사이
*/

@media (min-width: 1025px) and (max-width: 1280px) {

}

/*
##Device = Tablets, Ipads (landscape)
##Screen = B/w 768px to 1024px
##Device = 태블릿, 아이패드(가로)
##Screen = 768px에서 1024px 사이
*/

@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
	#wrap{ width:100%}	
	.header a{display:inline-block}

	/* 이러닝 프로그램 */
	.online_con .onlinearea h3 .point{font-size: 1.3em;}
	.online_con .appimgarea{height:23vh}
	.online_con .appimgarea .imgin{height:23vh}
	.online_con .appimgarea .apptit{width:60%; padding:5% 0 3%}
	.online_con .onlinearea li{height:28vh; width:47%; margin:.5%}
	.online_con .onlinearea li:nth-child(3) .apptit{width:55%}
	.online_con .appimgarea .appcon{width:54%}
	.online_con .onlinearea .apptitarea p {font-size: 1.1rem;}
	.online_con .onlinearea .apptitarea p.target{font-size: 1.1rem;}
	.online_con .onlinearea .apptitarea p.target span{font-size: 1rem; padding:.1em .4em}
	.online_con .onlinearea .apptitarea p.target{ width:48%}
	.online_con .otherbox .otherapp{height:13vh}
	.online_con .otherapp .appimgarea{ width:68%}
	.online_con .otherapp .appimgarea img{width: 6vw;}
	.online_con .otherbox .appimgarea .imgin{height:8vh}
	.online_con .otherapp .appimgarea .apptxt{ font-size:1.5rem}

}




/*
##Device = Tablets, Ipads (portrait),
##Screen = B/w 768px to 1024px
##Device = 태블릿, 아이패드(세로),
##Screen = 768px에서 1024px 사이
*/

@media (min-width: 768px) and (max-width: 1024px) {	
	#wrap{ width:100%}
	.header h1 .btn_live{font-size: 18px;line-height: 18px;}
	.level_test { height:auto;}
	.level_tit { font-size:25px; }
	.level_tit span { font-size:17px; margin:0 5px;}
	.level_btn {margin:15px 0 0 0;}
	.level_btn li a { padding:13px 0; font-size:16px; }

	.con_text { letter-spacing:-1px; line-height:20px;}

	.con_etc .con_etc_textbook{margin: 0 1% 0 2%; width: 47%;}
	.con_etc .con_etc_elearn{margin: 0 2% 0 1%; width: 47%;}
	.con_etc .con_etc_test{margin: 0 1% 0 2%; width: 47%;}
	.con_etc .con_etc_globe{margin: 0 2% 0 1%; width: 47%;}

	.con_etc .text_text {font-size:16px;}
	.con_etc .etc_tit { font-size:28px; }
	.con_etc .etc_tit.t04{ font-size: 26px;}
	.m_arrow{width: 15px;}
	
	.program { height:auto;}
	.program ul{width: 96%;}
	.program li img { height:25px;}
	.program li a {font-size:13px; padding:15px 0 15px;}

	.application { height:auto;}
	.application h5{ font-size:16px; line-height:1.4; padding:5px 0 2px 0;}
	.application ul{margin-left:0;margin-right:0; text-align:left;box-sizing:border-box;-webkit-box-sizing:border-box;-ms-box-sizing:border-box;-o-box-sizing:border-box;}
	.application li {float:left;width:33.333%;margin:1vw auto;}
	.application li a {font-size:14px; height:60px; background-size:70px}

	/* layerpop */
	.popup {overflow:hidden; position:fixed; width:700px; height:527px; top:60%; margin:-263px 0 0 -350px; left:50%}
	.popup span.closeBtn_pop {position:absolute; right:20px; top:20px; width:4%; cursor:pointer; height:10%;}
	.popup span.today_hide{position:absolute; color:#512404; font-size:21px; bottom:20px; left:20px; text-align:right; display:block; z-index:110}
	.popup span.goBtn {position:absolute; width:240px; right:30px; top:169px; z-index:2002; cursor:pointer}

	/*Live Class 영역*/
	.livecon li .adimg{ width:30%}
	.livecon li .adimg img{ width:72px}
	.livecon li p{font-size:1.3em}
	.livecon li .txt_l{font-size:1.5em}
	.livecon li .subp_txt{font-size:1.1em}
	

	.livecon .livecs{font-size:1.4em; bottom:7px}
	.livecon .livecs a{font-size:1.5em}	
	
	.livecon .liveClassBanner .liveText{ font-size:2em}
	.livecon .liveClassBanner .liveText .memberCountCon{font-size: 1.5em;}
	.livecon .liveClassBanner .liveclassbgImg{ width:23%; top:12%}	
	.livecon .video .t_en p{word-break:keep-all; font-size:1.5em}
	.livecon .video .t_en p .b{ font-size:1.18em}

	/* 이러닝 프로그램 */
	.online_con .appimgarea{height:23vh}
	.online_con .appimgarea .imgin{height:23vh}
	.online_con .appimgarea .apptit{width:60%; padding:5% 0 3%}
	.online_con .onlinearea li{height:28vh; width:47%; margin:.5%}
	.online_con .onlinearea li:nth-child(3) .apptit{width:55%}
	.online_con .appimgarea .appcon{width:54%}
	.online_con .onlinearea .apptitarea p {font-size: 1.1rem;}
	.online_con .onlinearea .apptitarea p.target{font-size: 1.1rem;}
	.online_con .onlinearea .apptitarea p.target span{font-size: 1rem; padding:.1em .4em}
	.online_con .onlinearea .apptitarea p.target{ width:48%}
	.online_con .otherbox .otherapp{height:13vh}
	.online_con .otherapp .appimgarea{ width:68%}
	.online_con .otherapp .appimgarea img{width: 6vw;}
	.online_con .otherbox .appimgarea .imgin{height:8vh}
	.online_con .otherapp .appimgarea .apptxt{ font-size:1.5rem}

}
/*
##Device = Low Resolution Tablets, Mobiles (Landscape)
##Screen = B/w 481px to 767px
##Device = 저해상도 태블릿, 모바일(가로)
##Screen = 481px에서 767px 사이
*/



@media (min-width: 0px) and (max-width: 940px) {
	.btn_menu{display: block;}
	.side_tab_wrap{display: block;}
	.btn_menu img{display: block;}
	
}

@media (min-width: 481px) and (max-width: 767px) {
	#wrap{ width:100%}
	.csbox{width:90%}
	.level_test { height:auto;}
	.level_tit { font-size:25px;}
	.level_tit span { font-size:17px;margin:0 5px;}
	.level_btn {margin:15px 0 0 0;}
	.level_btn li a { padding:10px 0; font-size:16px;}
	.con_text {font-size:14px; letter-spacing:-1px; line-height:20px;}
	.con_tit {font-size:16px;}
	.con_etc .text_text {font-size:13px;}
	.con_etc .etc_tit { font-size:20px;}
	.con_etc .etc_tit.t04{font-size:18.5px;}
	.con_etc .ic-new{padding:6px 12px; font-size:12px;border-radius: 0 0 8px 8px;}
	
	
	.m_arrow{width: 12px;}
	.program { height:auto;}
	.program ul{width: 96%;}
	.program li{ margin-bottom:5px;}
	.program li img { height:25px;}
	.program li a {font-size:13px; padding:15px 0 15px;}

	.application { height:auto;}
	.application h5{ font-size:16px; line-height:1.2; padding:5px 0 10px 0;}
	.application ul{margin-left:0;margin-right:0; text-align:left;box-sizing:border-box;-webkit-box-sizing:border-box;-ms-box-sizing:border-box;-o-box-sizing:border-box;}
	.application li {float:left;width:33.333%;margin:1vw auto;}
	.application li a {font-size:14px; background-size:60px}
	.application li a .apptitle{font-size:14px}
	.application li a p{font-size:13px; text-align:left;}
	
	/* layerpop */
	.popup {overflow:hidden; position:fixed; width:627px; height:472px; top:60%; margin:-236px 0 0 -313px; left:50%}
	.popup span.closeBtn_pop {position:absolute; right:15px; top:15px; width:4%; cursor:pointer; height:10%;}
	.popup span.today_hide{position:absolute; color:#512404; font-size:19px; bottom:20px; left:20px; text-align:right; display:block; z-index:110}
	.popup span.goBtn {position:absolute; width:220px; right:21px; top:144px; z-index:2002; cursor:pointer}

	/*Live Class 영역*/
	.livecon .livecs{font-size:1.3em; bottom:7px}
	.livecon .livecs a{font-size:1.5em}	
	.livecon li .adimg img{ height:35px}
	.livecon li p{font-size: 1.3em;}
	.livecon li .txt_l{font-size: 1.5em;}
	.livecon li .subp_txt{font-size: 1.1em;}
	.livecon .liveClassBanner .liveclassbgTxt{margin: 5% 0 0 4%; width:62%}
	.livecon .liveClassBanner .liveText{font-size: 1.6em;margin:3% 0 4% 0}
	.livecon .video .t_en p {font-size: 1.2em;}	

	/* 이러닝 프로그램 */	
	.online_con .onlinearea li{width: 48%; margin: .4em .2em; height:33vh}
	/* .online_con .onlinearea li:nth-child(3) .apptit{ width:55%; padding:6% 0 4% 0}
	.online_con .onlinearea li:nth-child(3) .appcon{ width:76%} */
	.online_con .onlinearea li:nth-child(3) .apptit{ width:80%; padding:6% 0 4% 0}
	.online_con .onlinearea li:nth-child(3) .appcon{ width:76%}
	.online_con .onlinearea .icnew{ width:14%}
	.online_con .onlinearea .icup{ width:14%}
	.online_con .onlinearea .apptitarea{ height:6vh}
	.online_con .onlinearea .apptitarea p{font-size:.98rem; letter-spacing: -.03em; width:50%}
	.online_con .onlinearea .apptitarea p.target{font-size:.98rem; width:50%; letter-spacing:-.07em}
	.online_con .onlinearea .apptitarea p.target span{font-size:.95em; padding: .25em .3em; line-height:1.2em}
	.online_con .onlinearea h3 .cltit{font-size: 1.2em;}
	.online_con .onlinearea h3 .point{font-size: 1.2em;}

	.online_con .otherapp .appimgarea{ width:75%; margin:.5rem auto}
	.online_con .appimgarea{height:27vh}
	.online_con .appimgarea .imgin{height:27vh}
	.online_con .appimgarea .apptit{width:67%}
	.online_con .appimgarea .appcon{ width:56%}
	.online_con .appimgarea .appcon2{width:18vw;}
	.online_con .otherbox .otherapp{ height:16vh;}
	.online_con .otherapp .appimgarea img{width:7vw;}
	.online_con .otherapp .appimgarea .apptxt{font-size: 1.1rem;}
	.online_con .otherbox .apptitarea p{width:57%}
	.online_con .otherbox .apptitarea p.target{width:43%} 		
	.livetext_btn{width: 25px; 	transform: translateY(-40%);}

	/* 221116 홈페이지 메인 수정 */
	.level_sub{font-size: 14px;}
	.level_sub_tit{font-size: 17px; margin: 0 0 0 5px;}
	.cam_l_btn a{height: 70px;width: 67%;line-height: 70px;font-size: 14px;border-radius: 8px;}
	.cam_r_btn li a{height: 29px;border-radius: 8px;line-height: 29px;font-size: 12px;}
	.location_btn_new{width: 10.5px; display: inline-block;  margin:0 3px -1px 3px;}
	.arrow_btn_new{width: 8px; display: inline-block; margin:0 0 -2px 5px; }	
	.cam_r_btn{width: 31%;}

	.brand_wrap ul li a {height: 270px;} /*230724 버튼 높이 수정*/
}

@media (min-width: 541px) and (max-width:767px) {
	
}


/*
##Device = Most of the Smartphones Mobiles (Portrait)
##Screen = B/w 320px to 479px
##Device = 대부분의 스마트폰 모바일 기기(세로)
##Screen = 320px에서 479px 사이
*/
@media (min-width: 481px) and (max-width:540px) {
	.header h1 .btn_live{font-size: 14px; padding: 15.5px 20px; line-height: 18px;}
	
}

@media (min-width: 320px) and (max-width: 480px) {
	#wrap{ width:100%}	
	.header h1 .btn_logo{ padding:0}

	.level_test { height:auto;}
	.level_tit { font-size:1.4em;}
	.level_tit span { font-size:.75em; margin:0 5px;}
	.level_btn {margin:10px 0 0 0}
	.level_btn li a { padding:6px 0; font-size:13px;  font-family:"NotoSansKR-Medium", "NanumGothic", "Dotum";}
	
	.brand_wrap ul li a {height: 120px;} /*230724 버튼 높이 수정*/

	/* 교실수업 */
	.con_etc{padding: 3% 3% 3% 3%;}

	/* 라이브 클래스 전환 시 */
	/* .con_etc{padding: 3% 4% 5% 4%;} */

	.con_etc .ic-new{padding:3px 9px; font-size:9px;border-radius: 0 0 6px 6px;}
	
	.con_text {font-size:14px; letter-spacing:-1px; line-height:18px;}
	.con_tit {font-size:16px;}

	.offline_class a {padding: 3% 3% 0 3%;}
	.online_class a {padding: 3%;}
	.level_test_inner{padding: 4%}
		
	.program ul{width: 96%;}
	.program li{ margin-bottom:5px;}
	.program li img { height:20px;}
	.program li a {font-size:11px; padding:12px 0 10px;}

	.application h5{ font-size:1.25em; line-height:1.2; padding:15px 0 10px 0;}
	.application ul{ width:90%; margin-left:0;margin-right:0; text-align:left;box-sizing:border-box;-webkit-box-sizing:border-box;-ms-box-sizing:border-box;-o-box-sizing:border-box;}
	.application li {float:left;width:50%;margin:1vw auto;}
	.application li a {font-size:14px; line-height:1.4; height:37px; text-align:center; width:100%;}
	.application li a.app_langconisland{background-size:46px}
	.application li a p{font-size:1.1em}
	.application li a .right_txt{font-size:12px}
	
	/* layerpop */
	.popup {overflow:hidden; position:fixed; width:354px; height:267px; top:60%;  margin:-133px 0 0 -177px; left:50%}
	.popup span.closeBtn_pop {position:absolute; right:7px; top:7px; width:4%; cursor:pointer; height:10%;}
	.popup span.today_hide{position:absolute; color:#512404; font-size:11px; bottom:14px; left:10px; text-align:right; display:block; z-index:110}
	.popup span.goBtn {position:absolute; width:116px; right:17px; top:83px; z-index:2002; cursor:pointer}

	/*Live Class 영역*/
	.livecon .liveadarea{ width:98%}
	.livecon .livecs{font-size:.85em; bottom:7px}
	.livecon .livecs a{font-size:1.45em}
	.livecon li .txtcon{ display:block}
	.livecon li p{ font-size:.85em; width:auto}
	.livecon li .txt_l{font-size:1.1em}
	.livecon li .subp_txt{ font-size:.8em}
	.livecon li .adimg{ width:20%}
	.livecon li .adimg img{ height:35px; margin:2% 0 1% 0}

	.livecon .liveClassBanner .liveclassbgTxt{width: 63%; margin: 5% 0 0 4%;}
	.livecon .liveClassBanner .liveText .memberCountCon{font-size: 1.5em;}
	.livecon .liveClassBanner .liveclassbgImg{ width:23%; top:12%}
	.livecon .video .t_en{ line-height:1.4}
	.livecon .video .t_en p{font-size:.82em}	
	.livecon .video .t_en p .b{font-size:1.28em}	


	/* 이러닝 프로그램 */	
	.online_con{ padding:.5em 0}
	.online_con .onlinearea h3{ margin:.8em auto}
	.online_con .onlinearea li{width: 90%; margin: .4em .05em; height:18vh}
	.online_con .onlinearea li:nth-child(2) .appcon2{width: 21%; left: 47%; bottom: -13%;}

	
	.online_con .onlinearea .icnew{ width:10%}
	.online_con .onlinearea .icup{ width:14%}
	.online_con .onlinearea .apptitarea{height:5vh}
	.online_con .onlinearea .apptitarea p{font-size: .97rem;}
	.online_con .onlinearea .apptitarea p.target{font-size: .97rem}
	.online_con .onlinearea .apptitarea p.target span{font-size: .88rem; padding:.1em .5em; line-height:1.6em}
	.online_con .onlinearea .apptitarea p img{ display:none}
	.online_con .onlinearea h3 .cltit{font-size: 1em; line-height: 1.4;}
	.online_con .onlinearea h3 .point{font-size: 1.2em; display:inline-block; width:100%}
	.online_con .appimgarea{height: 13vh;display:table}
	.online_con .appimgarea .imgin{display:table-cell; vertical-align: middle; height:13vh}
	.online_con .appimgarea .imgin img{ vertical-align:middle}
	.online_con .appimgarea .apptit{width:44%; padding:0; display:table-cell; vertical-align:middle }
	.online_con .appimgarea .apptit img{ margin-left:20%}
	.online_con .appimgarea .appimg{padding:0; display:table-cell; vertical-align:middle }
	.online_con .appimgarea .appimg img{ width:60%; margin-left:10%}
	.online_con .appimgarea .appcon2{display:none}
	.online_con .otherapp .appimgarea{ width:86%; margin:0 auto; height:6vh}
	.online_con .otherapp .appimgarea img{margin-right: .9rem; width:7vw; float:left }
	.online_con .otherbox .appimgarea .imgin{ height:6vh}
	.online_con .otherapp .appimgarea .apptxt{font-size: .98rem; width:74%; line-height:2}
	.online_con .onlinearea li.otherbox{ width:90%; height:14vh}
	.online_con .otherbox .otherapp{vertical-align: top; width:48.5%; height:14vh}
	.online_con .otherbox .otherapp .apptitarea{height:8vh}
	.online_con .otherbox .otherapp .apptitarea p{font-size: .95rem; width:94%; text-align:center}
	.online_con .otherbox .otherapp:nth-child(2){top:0}

	/* 입학 절차 안내 버튼 */
	.step_btn a{ height: 40px;line-height: 40px;}
	.step_btn span{line-height: 40px;font-size: 15px;}
	.step_btn img.location_btn{width: 12px; margin: 12px 8px 0 10px;}
	.step_btn img.arrow_btn {width: 11px;margin: 12px 10px 0 0;}
	.step_btn img{width: 15px;margin:2px 0 0 5px}

	.livetext_btn{width: 20px;	transform: translateY(-50%);}
	.hip-item{width: 100%;}
	
}


@media (min-width: 381px) and (max-width: 480px) {
	.login_icon{ width: 10px!important; padding-right: 5px !important; margin-top: -3px !important;}
	.con_etc .con_etc_inner{padding: 3.5%;-webkit-box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.15); box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.15);}
	.con_etc .text_text {font-size:11px;}
	.con_etc .etc_tit { font-size: 1.2em; margin-top: 5px;}
	.con_etc .etc_tit.t04{ font-size: 1.1em;  margin-top: 5px;}
	
	.m_arrow{width: 7px;}
	.hip-item{width: 100%;}

	
	.online_con .onlinearea li:nth-child(3) .apptit{width: 54%;padding:0}
	.online_con .onlinearea li:nth-child(3) .apptit img{margin-left:9%}
	.online_con .onlinearea li:nth-child(3) .appcon{width:38%;margin: 0 5% 0 0;} 

	
	/* 221116 홈페이지 메인 수정 */
	.level_sub{font-size: 14px;}
	.level_sub_tit{font-size: 17px; margin: 0 0 0 5px;}
	.cam_l_btn a{height: 70px;width: 67%;line-height: 70px;font-size: 14px;border-radius: 8px;}
	.cam_r_btn li a{height: 29px;border-radius: 8px;line-height: 29px;font-size: 12px;}
	.location_btn_new{width: 10.5px; display: inline-block;  margin:0 3px -1px 3px;}
	.arrow_btn_new{width: 8px; display: inline-block; margin:0 0 -2px 5px; }	
	.cam_r_btn{width: 31%;}
}


@media (min-width: 375px) and (max-width:480px) {
	.header h1 .btn_live{font-size: 13px; padding: 15.5px 20px; line-height: 18px;}
	.brand_img{width: 45%; padding: 7px 0 5px 0;}
	.con_text{font-size: 11px; letter-spacing:-1px; line-height:1.1em;}
	.con_tit{font-size: 12px; letter-spacing: -1px; padding-bottom: 9px;} /* 230724 폰트 사이즈 수정 13px -> 12px, letter-spacing: -1px;추가 */
	.tit_mg {margin-top: 12px;}
	.livecon .liveClassBanner .liveText{ font-size:0.95em;}
	.newspaper{width: 105px;}


/*footer-cs*/
.csbox{width:90%}
.csbox .cs01{font-size: 1.3em}
.csbox .cs02{font-size: 2.1em}
.csbox .cs03 {font-size: .9em}
.csbox_left li{font-size:.8em}
.csbox_left li .point{font-size:.9em}


}
@media (min-width: 375px) and (max-width:380px) {
	.con_etc .con_etc_inner{padding: 3.5%;-webkit-box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.15); box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.15);}
	.con_etc .text_text {font-size:10px;}
	.con_etc .etc_tit { font-size: 1em; margin-top: 5px;}
	.con_etc .etc_tit.t04{ font-size: .9em; margin-top: 5px;}
	.m_arrow{width: 7px;}

	.online_con .onlinearea li:nth-child(3) .apptit{width: 54%;padding:0}
	.online_con .onlinearea li:nth-child(3) .apptit img{margin-left:9%}
	.online_con .onlinearea li:nth-child(3) .appcon{width:34%;margin: 0 8% 0 0;} 

	
	/* 221116 홈페이지 메인 수정 */
	.level_sub{font-size: 14px;}
	.level_sub_tit{font-size: 17px; margin: 0 0 0 5px;}
	.cam_l_btn a{height: 70px;width: 67%;line-height: 70px;font-size: 14px;border-radius: 8px;}
	.cam_r_btn li a{height: 29px;border-radius: 8px;line-height: 29px;font-size: 12px;}
	.location_btn_new{width: 10.5px; display: inline-block;  margin:0 3px -1px 3px;}
	.arrow_btn_new{width: 8px; display: inline-block; margin:0 0 -2px 5px; }	
	.cam_r_btn{width: 31%;}


}


@media (min-width: 321px) and (max-width:374px) {
	.login_icon{ width: 9px!important; padding-right: 5px !important; margin-top: -2.5px !important;}
	.con_etc .con_etc_inner{padding: 3.5%;-webkit-box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.15); box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.15);}
	.con_etc .text_text {font-size:10px;}
	.con_etc .etc_tit { font-size: 1em; margin-top: 5px;}
	.con_etc .etc_tit.t04{ font-size: .9em; margin-top: 5px;}
	.con_etc .ic-new{padding:4px 9px; font-size:10px}
	
		
	.m_arrow{width: 7px;}
	.hip-item{width: 100%;}

	.header h1 .btn_live{font-size: 13px;padding: 15.5px 15px;line-height: 18px;}
	.brand_img{width: 40%; padding: 6px 0 4px 0;}
	.con_text{font-size: 10px;letter-spacing:-1px; line-height:1.1em;}
	.con_tit{font-size: 12px;padding-bottom: 8px;}
	.livecon .liveClassBanner .liveText{ font-size:0.8em; margin:2% 0 3% 0}
	.newspaper{width:95px;}

	.online_con .onlinearea li:nth-child(3) .appcon{width: 40%; margin: 0 4% 0 0;}
	.online_con .onlinearea li:nth-child(3) .apptit{width: 54%;padding: 0;}
	.online_con .onlinearea li:nth-child(3) .apptit img{ margin-left: 9%;}
	

	
	/* 221116 홈페이지 메인 수정 */
	.level_sub{font-size: 11px;}
	.level_sub_tit{font-size: 14px; margin: 0 0 0 5px;}
	.cam_l_btn a{height: 70px;width: 67%;line-height: 70px;font-size: 12px;border-radius: 8px;}
	.cam_r_btn li a{height: 29px;border-radius: 8px;line-height: 29px;font-size: 10px;}
	.location_btn_new{width: 10.5px; display: inline-block;  margin:0 3px -1px 3px;}
	.arrow_btn_new{width: 8px; display: inline-block; margin:0 0 -2px 5px; }	
	.cam_r_btn{width: 31%;}

}


@media screen and (max-width:320px) {
	#wrap{ width:100%}	
	.header h1 .btn_live{font-size: 12px;padding: 15.5px 15px; line-height: 18px;}
	.login_icon{ width: 10px!important; padding-right: 5px !important; margin-top: -3px !important;}

	.brand_img{width: 40%; padding: 6px 0 4px 0;}
	.con_text{font-size: 10px;letter-spacing:-1px; line-height:1.1em;}
	.con_tit{font-size: 12px;padding-bottom: 8px;}

	
	.level_test {height:auto;}
	.level_tit { font-size:1.35em;}
	.level_tit span { font-size:.65em; margin-right: 5px;}
	.level_btn {margin:10px 0 0 0}
	.level_btn li a { padding:5px 0; font-size:.85em;  font-family:"NotoSansKR-Medium", "NanumGothic", "Dotum";}
	.level_test_inner{padding: 4%}

/*footer-cs*/
.csbox{width:90%}
.csbox .cs01{font-size: 1.2em}
.csbox .cs02{font-size: 2em}
.csbox .cs03 {font-size: .8em}
.csbox_left {margin-right: 26px;}
.csbox_left li{font-size:.7em}
.csbox_left li .point{font-size:.8em}
		
	
	/* 교실수업 */
	.con_etc{padding: 3% 3% 3% 3%;}

	/* 라이브 클래스 전환 시 */
	/* .con_etc{padding: 3% 4% 5% 4%;} */

	.con_etc .con_etc_inner{padding: 3.5%; -webkit-box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.15); box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.15);}


	.con_etc .text_text {font-size:10px;}
	.con_etc .etc_tit { font-size: 1em; margin-top: 5px;}
	.con_etc .etc_tit.t04{ font-size: .9em; margin-top: 5px;}
	
	
	.con_etc .ic-new{padding:2px 8px; font-size:8px;border-radius: 0 0 4px 4px;}
	
		
	.m_arrow{width: 7px;}


	.offline_class a {padding: 3% 3% 0 3%;}
	.online_class a {padding: 3%;}
	

	.con_etc ul li:nth-child(1){padding: 0 3.5% 3.5% 0;}
	.con_etc ul li:nth-child(2){padding: 0 0 3.5% 3.5%;}
	.con_etc ul li:nth-child(3){padding:3.5% 3.5% 0 0;}
	.con_etc ul li:nth-child(4){padding: 3.5% 0 0% 3.5%;}
	

	.program ul{width: 96%;}
	.program li{ margin-bottom:5px;}
	.program li img { height:20px;}
	.program li a {font-size:11px; padding:12px 0 10px;}

	.application h5{ font-size:1.02em; line-height:1.2; padding:10px 0;}
	.application ul{ margin-left:0;margin-right:0; text-align:left;box-sizing:border-box;-webkit-box-sizing:border-box;-ms-box-sizing:border-box;-o-box-sizing:border-box;}
	.application li {float:left;width:50%;margin:1vw auto;}
	.application li a {font-size:14px; line-height:1.3; height:29px; width:100%; text-align:center; background-size:50px}
	.application li a .right_txt{ padding-left:55px}
	.application li a .right_txt p{font-size:1.05em}

	
	/* .fix {position: relative;} */
	.adress p {color:#9296a0; font-size:9px;}

	.popup {overflow:hidden; position:fixed; width:298px; height:224px; top:60%; margin:-112px 0 0 -149px; left:50%}
	.popup span.closeBtn_pop {position:absolute; right:7px; top:7px; width:4%; cursor:pointer; height:10%;}
	.popup span.today_hide{position:absolute; color:#547490; font-size:10px; bottom:12px; left:10px; text-align:right; display:block; z-index:110}
	.popup span.goBtn {position:absolute; width:109px; right:20px; top:69px; z-index:2002; cursor:pointer}
	
	/*Live Class 영역*/
	.livecon .livecs{font-size:.85em; bottom:7px}
	.livecon .livecs a{font-size:1.35em}
	.livecon li .txtcon{ display:block}
	.livecon li p{ width:100%; font-size:.7em; text-align:center; margin-left:0; display:inline-block}
	.livecon li .txt_l{font-size:.95em}
	.livecon li .txtcon .subp_txt{font-size:.5em;letter-spacing: -.25em;}
	.livecon li .adimg{ width:100%; display:inline-block}
	.livecon li .adimg img{ height:35px}
	.livecon .liveClassBanner .liveText{ font-size:0.8em; margin:2% 0 3% 0}
	.livecon .liveClassBanner .liveclassbgTxt{width: 60%; margin:5% 0 0 3%;}
	.livecon .liveClassBanner .liveclassbgImg{ width:23%; top:12%}
	.livecon .video .t_en{ line-height:1.6}
	.livecon .video .t_en p{font-size: .8em;}
	.livecon .video .t_en p .b{ font-size:.75em}	
	
			
	/* 이러닝 프로그램 */	
	.online_con{ padding:.5rem 0}
	.online_con .onlinearea li{width: 96%; margin: .4em .05em; height:19vh}
	.online_con .onlinearea li:nth-child(2) .appcon2{width: 21%; left: 47%; bottom: -13%;}
	/* .online_con .onlinearea li:nth-child(3) .apptit{width: 35%;padding:0}
	.online_con .onlinearea li:nth-child(3) .apptit img{margin-left:35%} */
	.online_con .onlinearea li:nth-child(3) .appcon{width: 40%; margin: 0 4% 0 0;}
	.online_con .onlinearea li:nth-child(3) .apptit{width: 54%;padding: 0;}
	.online_con .onlinearea li:nth-child(3) .apptit img{ margin-left: 9%;}
	
	.online_con .onlinearea .icnew{ width:9%}
	.online_con .onlinearea .icup{ width:9%}
	.online_con .onlinearea .apptitarea p{font-size: .95rem;}
	.online_con .onlinearea .apptitarea p.target{font-size: .9rem;margin-top: .1em;}
	.online_con .onlinearea .apptitarea p.target span{font-size: .8rem; padding:0 .4em;margin-right: .2em; line-height: 1.5em;}
	.online_con .onlinearea .apptitarea p img{ display:none}
	.online_con .onlinearea h3 .cltit{font-size: .9em; line-height: 1.3;}
	.online_con .onlinearea h3 .point{font-size: 1.1em; display:inline-block; width:100%}
	.online_con .appimgarea{height:14vh}
	.online_con .appimgarea .imgin{display:table-cell; vertical-align: middle; height:14vh}
	.online_con .appimgarea .imgin img{ vertical-align:middle}
	.online_con .appimgarea .apptit{width:44%; padding:0; display:table-cell; vertical-align:middle }
	.online_con .appimgarea .apptit img{ margin-left:17%}	
	.online_con .appimgarea .appimg{padding:0; display:table-cell; vertical-align:middle }
	.online_con .appimgarea .appimg img{width: 64%; margin-left: 10%;}
	.online_con .appimgarea .appcon2{display:none}
	.online_con .otherapp .appimgarea{ width:84%; height:6vh}
	.online_con .otherbox .appimgarea .imgin{height:6vh}
	.online_con .otherapp .appimgarea img{margin-right:.5rem; width:8vw}
	.online_con .otherapp .appimgarea .apptxt{font-size: .8rem; width:100%}
	.online_con .onlinearea li.otherbox{ width:96%; height:13vh}
	.online_con .otherbox .otherapp{vertical-align: top; width:48.5%; height:13vh}
	.online_con .otherbox .otherapp .apptitarea{ height:7vh}
	.online_con .otherbox .otherapp .apptitarea p{font-size: .7rem; width:98%; text-align:center; line-height:1.3}
	.online_con .otherbox .otherapp:nth-child(2){top:0}	
	.online_con .otherbox .otherapp .apptitarea p.target{letter-spacing: -.12em;}

	/* 입학 절차 안내 버튼 */
	.step_btn a{ height: 40px;line-height: 40px;}
	.step_btn span{line-height: 40px;font-size: 15px;}
	.step_btn img.location_btn{width: 12px; margin: 12px 8px 0 10px;}
	.step_btn img.arrow_btn {width: 11px;margin: 12px 10px 0 0;}
	.step_btn img{width: 15px;margin:2px 0 0 5px}

	.livetext_btn{width: 16px; transform: translateY(-50%);}

	/* footer */
	.company_menu .pc_box a { margin: 0 5px;}
	.newspaper{width:95px;}
	.hip-item{width: 100%;}

		/* 221116 홈페이지 메인 수정 */
		.level_sub{font-size: 11px;}
		.level_sub_tit{font-size: 14px; margin: 0 0 0 5px;}
		.cam_l_btn a{height: 70px;width: 67%;line-height: 70px;font-size: 12px;border-radius: 8px;}
		.cam_r_btn li a{height: 29px;border-radius: 8px;line-height: 29px;font-size: 10px;}
		.location_btn_new{width: 10.5px; display: inline-block;  margin:0 3px -1px 3px;}
		.arrow_btn_new{width: 8px; display: inline-block; margin:0 0 -2px 5px; }		
		.cam_r_btn{width: 31%;}

}


@media (min-width: 850px) and (max-width: 900px) {
	.game{ font-size: 1.6em;  padding:18px 16px;}
	.CountCon{font-size: 1.9em; width:230px;}
}

@media (min-width: 786px) and (max-width:849px) {
	.game{ font-size: 1.4em;  padding:16px 17px;}
	.CountCon{font-size: 1.9em; width:200px;}
}





@media (min-width: 730px) and (max-width: 785px) {
	/* 교실수업, 라이브클래스 축소*/
	.live_class_small .liveText{font-size: 1.3em;}

	.game{ font-size: 1.3em;  padding:12px 13px;}
	.CountCon{font-size: 1.9em; width:190px;}
	}
	
	@media (min-width: 600px) and (max-width: 729px) {
		/* 교실수업, 라이브클래스 축소*/
		.live_class_small .liveText{font-size: 1.1em;}

		.game{ font-size: 1.1em;  padding:10px 10px;}
		.CountCon{font-size: 1.9em; width:165px;}
	}
	
	@media (min-width: 450px) and (max-width: 599px) {
		/* 교실수업, 라이브클래스 축소*/
		.live_class_small .liveText{font-size: 0.8em;}
		.game{ font-size: 0.85em;  padding:5px 10px;}
		.CountCon{font-size: 1.9em; width:125px;}
	}
	@media (min-width: 376px) and (max-width: 449px) {
		/* 교실수업, 라이브클래스 축소*/
		.live_class_small .liveText{font-size: 0.75em;}

		.game{ font-size: 0.7em;  padding:2px 10px;}
		.CountCon{font-size: 1.9em; width: 105px;}

	}
	@media (min-width: 350px) and (max-width: 375px) {
		/* 교실수업, 라이브클래스 축소*/
		.live_class_small .liveText{font-size: 0.65em;}

		.game{ font-size: 0.6em;  padding:2px 7px;}
		.CountCon{font-size: 1.9em; width: 95px;}
	}
	@media (min-width: 320px) and (max-width: 349px) {
	/* 교실수업, 라이브클래스 축소*/
	.live_class_small .liveText{font-size: 0.5em;}
	.liveText .top_txt{margin-bottom: 3px;}

	.game{ font-size: 0.6em;  padding: 0 5px;}
	.CountCon{font-size: 1.7em; width: 90px;}

	}
	
	@media(min-width: 0px) and (max-width: 319px) {
		.game{ font-size: 0.6em;  padding: 0 5px;}
		.CountCon{font-size: 1.7em; width: 90px;}
	}