/* Written By MJS */

*{-webkit-text-size-adjust:none}
body,form,div,p,h1,h2,h3,h4,h5,h6,dl,dt,dd,ul,ol,li,fieldset,th,td,input,textarea,button,select{margin:0;padding:0;font-family:'Malgun Gothic','맑은 고딕',dotum,'돋움',sans-serif;font-weight:normal}
body{-webkit-user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:rgba(0,0,0,0)}
li{list-style:none}
a{border:0;padding:0;margin:0;text-decoration:none;color:#333}
ol,ul,dl{list-style:none}
img{float:left;border:0;padding:0;margin:0;}
legend,caption{display:none}
table{border-collapse:collapse;border-spacing:0}
input{vertical-align:middle;padding:0;border:0;margin:0;}
select{padding:0;border:0;margin:0;}

body{min-width:320px;max-width:1000px;height:100%;margin:0 auto;}





/*================================== 상단 ==================================*/
#main-navbar{position:relative;float:left;z-index:10;width:94%;padding:3%;background:#fff;}
#toggle-sidebar{float:left;width:12%;cursor:pointer;}
a.call{float:left;width:12%;}
/* 로고 */
.logo{position:relative;float:left;width:52%;margin:0 11%;}
.logo a{float:left;width:100%;}
.logo a img{float:left;width:100%;}


#main-sidebar{position:fixed;top:0;bottom:0;background:#e5e5e5;}
#main-sidebar .close-sb{height:48px;line-height:48px;background:#333;padding:0 0 0 3%;border-bottom:1px solid #000;font-size:18px;color:#fff;cursor:pointer;}
#main-sidebar ul li > a{display:block;height:18px;line-height:18px;padding:12px 0 12px 5%;border-bottom:1px solid #ccc;font-size:16px;font-weight:600;color:#555;}
#main-sidebar ul li > a:hover{background:#333;border-bottom:1px solid #010101;color:#fff;}
#main-sidebar ul li li > a{display:block;padding:8px 0 8px 5%;background:#f7f7f7;border-bottom:1px solid #dedee0;font-size:13px;color:#555;}
#main-sidebar ul li li > a .class_point1{width:30px;display:inline-block;line-height:18px;font-size:10px;font-weight:600;color:white;background:red;text-align:center;padding:0;margin:0;margin-right:4px;}
#main-sidebar ul li li > a .class_point2{width:30px;display:inline-block;line-height:18px;font-size:10px;font-weight:600;color:white;background:green;text-align:center;padding:0;margin:0;margin-right:4px;}






/*================================== 메인 ==================================*/
/* 메인 슬라이드 */
.promotion{position:relative;float:left;margin:0;padding:0;min-width:320px;max-width:1080px;width:100%;overflow-x:hidden;}
.slidings{margin:0;padding:0;}
#promotionBanner{margin:0;padding:0;}
.wrap{margin:0;padding:0;}
figure{margin:0;padding:0;}
#promotionBannerPagination{margin:0;padding:0;}
.pagination{margin:0;padding:0;}


/* 교육상담 */
.main_call{position:relative;float:left;width:92%;padding:4%;background:#8133b2;}
.main_cs{position:relative;float:left;width:100%;}
.cs_num{float:left;width:100%;}
.cs_num b{float:left;width:26px;height:36px;line-height:36px;font-size:22px;color:#8133b2;font-weight:bold;font-weight:1000;text-align:center;margin:0 1px;background:#fff;}
.cs_num span{float:left;height:36px;line-height:36px;font-size:30px;color:#fff;padding:0 2%;}
.cs_text{float:left;width:100%;font-size:13px;line-height:18px;color:#fff;margin-top:4%;}


/* 메인타이틀, 더보기 */
.m_title{float:left;width:100%;line-height:100%;font-size:26px;font-weight:600;letter-spacing:-1px;text-align:center;color:#000;margin-bottom:5%;}
.m_title2{float:left;width:100%;line-height:100%;font-size:20px;font-weight:600;color:#000;margin-bottom:5%;}


/* 강의안내 */
.subject{position:relative;float:left;width:92%;padding:8% 4%;}
.subject ul{float:left;width:101%;margin:-0.5% 0 0 -0.5%;}
.subject ul li{float:left;width:48%;margin:0.5%; background:#fff;border:1px solid #aaa;box-shadow:2px 2px 2px #ccc;;border-radius:10px;}
.subject ul li a{float:left;width:100%; height:120px; display:flex; flex-direction: column; justify-content: center; align-items: center; text-align:center;}
.subject .sj_icon{display:inline-block;width:40px;height:40px;padding:10px;border-radius:100%;text-align:center;}
.subject .sj_icon img{width:100%;}
.subject ul li a p{float:left;width:90%;line-height:15px;font-size:12px;font-weight:600;text-align:center;color:#000;margin:10px 5% 0 5%;}
.c1{background:#bdcaf1;}
.c2{background:#d9b2f4;}
.c3{background:#eeb289;}
.c4{background:#f6b3c6;}
.c5{background:#efcc6d;}
.c6{background:#a6d88b;}
.c7{background:#8bd8d2;}


/* 국비교육 */
#nal_edu{position:relative;float:left;width:83.8%;padding:22px 4%;margin:8% 4% 0 4%;border:1px solid #ccc;background:url(../img/m_bg_icon3.png) no-repeat 94% 70%;background-size:22%;}
.bn_title2{float:left;width:100%;line-height:100%;font-size:22px;font-weight:600;margin-bottom:4%;}
#nal_edu p{float:left;width:70%;line-height:15px;font-size:11px;font-family:'dotum' !important;letter-spacing:-0.04em;color:#888;margin:0 30% 4% 0;}
a.view{float:left;width:80px;line-height:22px;font-size:12px;font-family:'gulim' !important;font-weight:400;text-align:center;color:#fff;background:#999;}


/* 내일배움카드,시설안내 */
#bn_box{position:relative;float:left;width:92%;margin:0 4%;background:#fff;margin-top:-1px;}
.bn_title{float:left;width:100%;line-height:100%;font-size:22px;font-weight:600;margin-bottom:4%;}
.tm_card{position:relative;float:left;width:91.8%;padding:22px 4%;border:1px solid #ccc;background:url(../img/m_bg_icon1.png) no-repeat 94% 60%;background-size:22%;}
.tm_card a{float:left;width:100px;line-height:32px;font-size:14px;font-weight:600;text-align:center;color:#fff;margin-right:1px;}

.fc_bn{position:relative;float:left;width:91.8%;padding:22px 4%;border:1px solid #ccc;background:url(../img/m_bg_icon2.png) no-repeat 94% 60%;background-size:22%;margin-top:-1px;}
.fc_bn p{float:left;width:100%;line-height:15px;font-size:11px;font-family:'dotum' !important;letter-spacing:-0.04em;color:#888;margin-top:-2px;}
a.view2{position:absolute;right:5%;top:22px;width:24px;height:24px;line-height:24px;font-size:22px;font-family:'gulim' !important;font-weight:400;text-align:center;color:#fff;background:#999;}


/* 공지사항, 판매시설공지 */
#notice{position:relative;float:left;width:92%;margin:8% 4%;border:1px solid #ccc;;}
ul.tabs{float:left;width:100%;height:42px;}
ul.tabs li{float:left;width:50%;height:42px;line-height:42px;background:#ccc;overflow:hidden;position:relative;}
ul.tabs li a{float:left;width:100%;height:42px;line-height:42px;text-align:center;font-size:16px;font-weight:600;color:#666;}
ul.tabs li a:hover{background:#ccc;}
ul.tabs li.active a, ul.tabs li.active a:hover{font-size:18px;color:#fff;background:#707070;}
.tab_container{float:left;width:100%;}
.tab_content{float:left;width:92%;padding:4%;}
ul.board{float:left;width:100%;}/* 게시판 */
ul.board li{float:left;width:100%;}
ul.board li a{float:left;width:74%;font-size:12px;line-height:24px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#333;}
ul.board li a:hover{text-decoration:underline;}
ul.board li span.date{float:left;width:26%;line-height:24px;font-size:11px;text-align:right;color:#898989;}


/* 포토갤러리 */
.gallery{position:relative;float:left;width:92%;padding:8% 4% 4% 4%;background:#f2f2f2;margin-top:8%;}
.gallery ul{position:relative;float:left;width:102%;margin-left:-1%;}
.gallery ul li{float:left;width:48%;margin:0 1%;height:140px;}
.gallery ul li a{float:left;width:100%;}
.gallery ul li a img{float:left;width:100%;height:100px;}
.gallery ul li a p{float:left;width:100%;line-height:100%;font-size:14px;text-align:center;color:#000;margin-top:10px;}


/* 혜율 오시는길 */
#address{position:relative;float:left;width:92%;padding:8% 4%;background:url(../img/pattern.gif) repeat;}
#address ul{position:relative;float:left;width:100%;margin-top:3%;border-top:1px solid #5c5c5c;}
#address ul li{float:left;width:96%;line-height:16px;padding:2%;border-bottom:1px solid #5c5c5c;}
#address ul li b{float:left;width:26%;font-size:14px;font-weight:600;color:#fff;}
#address ul li p{float:left;width:74%;font-size:12px;font-weight:400;color:#fff;}







/*================================== 하단 ==================================*/
/* 제품소개 */
.f_roll_w{position:relative;float:left;width:92%;margin:30px 4%;background:#fff;overflow:hidden;}
#f_roll{position:absolute;left:0;top:0;width:400%;height:104px;}
#f_roll ul{position:relative;float:left;width:100%;border-top:1px solid #ccc;}
#f_roll ul li{position:relative;float:left;width:206px;border:1px solid #ccc;background:#fafafa;margin:-1px -1px 0 0;}
#f_roll ul li a{position:relative;float:left;width:186px;height:82px;text-align:center;padding:10px;}
#f_roll ul li a img{float:left;width:184px;height:52px;margin:0 0 6px 0;border:1px solid #e0e0e0;}
#f_roll ul li a b{float:left;width:90%;line-height:20px;font-size:14px;padding:0 5%;color:#000;}
#f_roll ul li a p{float:left;width:90%;line-height:17px;font-size:12px;padding:0 5%;color:#888;margin:6px 0 0 0;white-space:normal;}
#f_roll ul li a span{position:absolute;left:0;bottom:10px;width:100%;line-height:100%;font-size:11px;font-family:'dotum' !important;color:#000;}


#footer{position:relative;float:left;width:100%;background:#fafafa;border-top:1px solid #aaa;}
.copy{position:relative;float:left;width:100%;padding-top:4%;color:#999;font-size:11px;}
.copy p{text-align:center;}


/* 버튼 style */
#button{position:relative;float:left;width:100%;background:#fafafa;padding:4% 0 6% 0;text-align:center;color:#fff;}
.btn{margin:1%;padding:2% 4%;font-size:14px;color:#fff;border:none;background:#aaa;
-moz-border-radius:3px;
-webkit-border-radius:3px;
border-radius:3px;
behavior:url(ie-css3.htc);}





/*================================== 서브 ==================================*/
#sub_content{position:relative;float:left;width:100%;height:auto;min-width:320px;}

/* 서브 메뉴 */
.sub_menu{position:relative;float:left;width:94%;padding:0 3%;background:#f4f4f4;border-top:1px solid #aaa;border-bottom:1px solid #aaa;}
.sub_menu h3{float:left;width:100%;font-size:20px;line-height:28px;letter-spacing:-1px;font-weight:600;color:#333;margin:15px 0;}
.sub_menu ul{float:left;width:100%;margin:0 0 15px 0;}
.sub_menu ul li{float:left;padding:0 3%;line-height:13px;border-left:1px solid #999;}
.sub_menu ul li:first-child{padding-left:0;border-left:none}
.sub_menu ul li a{float:left;font-size:13px;font-weight:bold;color:#aaa;}
.sub_menu ul li a.on{font-weight:bold;color:#fff;}

.page_content{position:relative;float:left;width:94%;padding:3%;margin:4% 0;}


/* 서브 페이지 탭 */
.sub_tab{position:relative;float:left;width:100%;overflow:hidden;}
.sub_tab ul{float:left;width:100.2%;margin-left:-1px;}
.sub_tab ul li{float:left;width:50%;text-align:center;}
.sub_tab ul li a{float:left;width:99.8%;height:32px;display:flex; align-items: center; justify-content: center; font-size:12px;font-weight:600;letter-spacing:-0.03em;padding:5px 0;color:#777;background:#fff;border:1px solid #555;margin:-1px -1px 0 0;}
.sub_tab ul li a:hover{background:#f9f9f9;}
.sub_tab ul li a.on{color:#fff;background:#555;border:1px solid #555;}




/*=================================== 공통 style =================================== */
.stitle1{float:left;width:100%;line-height:26px;font-size:20px;font-weight:600;letter-spacing:-1px;color:#000;margin:8% 0 4% 0;}
.stitle1 b{display:inline-block;vertical-align:top;line-height:24px;font-size:26px;margin-right:5px;color:#34aee6;}


.tbl{position:relative;float:left;width:100%;overflow:hidden;}
.tbl table{float:left;width:100.5%;margin-left:-1px;}
.tbl table th{line-height:20px;font-size:14px;font-weight:600;color:#000;background:#f7f7f7;}
.tbl table td{line-height:18px;font-size:13px;color:#666;}
.tbl table th,.tbl table td{text-align:left;padding:5px;border:1px solid #ccc; word-break:keep-all;}
.tbl table th.diagonal {background-image: linear-gradient(to left bottom, transparent calc(50% - 1px), #ccc, transparent calc(50% + 1px)); background-size: 120% 120%; background-position: center;}
.tbl .sp-box{display:flex; justify-content: space-between;align-items:center; font-size:12px;}
.tbl .sp-left{margin-top:20px;}
.tbl .sp-right{margin-bottom:20px;}
.tbl table td a{display:inline-block;line-height:17px;font-size:11px;font-weight:400;font-family:'dotum' !important;vertical-align:top;text-align:right;padding:0 7px;color:#000;border:1px solid #aaa;border-radius:3px;background:#fafafa;margin-top:7px;}
.tbl table td b{font-size:13px;font-weight:600;color:#000;}
.tbl table td strong{float:left;width:100%;font-size:13px;font-weight:600;color:#000;margin-bottom:10px;}
.tbl table th.tb-center,.tbl table td.tb-center,
.tbl table.tb-center td{text-align:center;}

.tb-link-box{float:left; width:100%; font-size:14px !important; margin-top:20px; gap:20px;}
.tb-link-box p{font-size:14px; font-weight:600; color:#666;}
.tb-link-box a{display: inline-block; line-height: 21px; font-size: 14px; font-weight: 400; font-family: 'dotum' !important; vertical-align: top; text-align: right; padding: 0 12px;  color: #000; border: 1px solid #aaa; border-radius: 3px; background: #fafafa;}
.tb-link-box a.file{margin-top:10px; width:130px; display:flex; justify-content: space-between; align-items: center; line-height:34px; background:#255fd5; border-width:0; color:#fff; font-size:13px;}
.tb-link-box a.file img{width:15px;}
.tb-color1{color:#b11;}

.tbl ul{float:left;width:100%;margin-top:-5px;}
.tbl ul li{float:left;width:96.7%;line-height:18px;font-size:13px;color:#666;margin-top:5px;padding-left:16px;background:url(../img/bullet.png) no-repeat 0 5px;background-size:10px;}

.sTxt{float:left;width:94%;line-height:18px;font-size:13px;color:#333;padding:2.7%;border:2px solid #eee;background:#fafafa; word-break: keep-all;}
.sTxt ul{float:left;width:100%;margin-top:-7px;}
.sTxt ul li{float:left;width:100%l;ine-height:18px;font-size:13px;margin-top:7px;padding-left:16px;background:url(../img/bullet.png) no-repeat 0 3px;}

.sTxt2{float:left;width:92%;padding:3.3%;border:1px solid #eee;background:#f9f9f9;margin:8px 0 12px 0;}
.sTxt2 b{float:left;width:100%;line-height:18px;font-size:13px;font-weight:600;color:#000;}
.sTxt2 b span{line-height:18px;font-size:13px;font-weight:400;color:#555;}

.sPoint{float:left;width:100%;line-height:17px;font-size:12px;color:#d64f4f;margin-top:10px;}
.sPoint2{float:left;width:100%;line-height:17px;font-size:12px;color:#777;margin-top:10px;}

.ul01{display:flex; flex-wrap:wrap; box-sizing: border-box; border:2px #eee solid; background:#fafafa;}
.ul01 li{width:50%; box-sizing: border-box; border:0.5px #ddd solid;}
.ul01 p{width:100%; height:50px; text-align:center; display:flex; justify-content: center; align-items: center; font-size:15px; font-weight:600; color:#444;}
.ul02{display:flex; gap:15px; flex-direction: column; margin-top:30px;}
.ul02 li{position:relative; box-sizing: border-box; padding-left:12px; font-size:14px; color:#000;}
.ul02 li:before{content:""; display:block; width:4px; height:4px; background:#222; position:absolute; left:0; top:7px; border-radius:999px;}
.ul02 li span{color:#d64f4f;}




/*=================================== 내용 ===================================*/
/* 인사말 */
.greeting{position:relative;float:left;width:100%;}
.gree_title{float:left;width:100%;line-height:24px;font-size:18px;font-weight:600;letter-spacing:-1px;color:#0496da;}
.greeting p{float:left;width:100%;line-height:18px;font-size:13px;color:#5d5d5d;margin:5% 0;}
.greeting p b{color:#000;}
.greeting ul{float:left;width:100%;margin-bottom:5%;}
.greeting ul li{float:left;width:94%;height:36px;padding:3%;background:#e9effb;margin-bottom:2%;}
.greeting ul li b{float:left;width:16%;line-height:36px;font-size:20px;letter-spacing:-1px;text-align:right;color:#255fd5;margin-right:4%;}
.greeting ul li span{float:left;width:80%;line-height:18px;font-size:14px;font-weight:600;color:#555;}


/* 시설안내 */
.facility{position:relative;float:left;width:100%;}
.facility ul{float:left;width:102%;margin:-1.5% 0 0 -1.5%;}
.facility ul li{float:left;width:30.333%;height:200px;margin:1.5%;}
.facility ul li a{float:left;width:100%;}
.facility ul li img{float:left;width:100%;}
.facility ul li p{float:left;width:100%;line-height:26px;font-size:13px;text-align:center;margin-top:3%;}


/* MOU 리스트 */
#mou_w{position:relative;float:left;width:100%;overflow:hidden;}
.mou_list{position:relative;float:left;width:100%;margin-top:30px;overflow:hidden;}
.mou_list ul{float:left;width:100%;border-top:1px solid #ccc;}
.mou_list ul li{float:left;width:49.5%;text-align:center;border:1px solid #ccc;background:#fafafa;margin:-1px -1px 0 0;}
.mou_list ul li a{position:relative;float:left;width:100%;height:80px;padding:10px 0;}
.mou_list ul li a img{float:left;width:89.5%;height:54px;margin:0 5% 6px 5%;border:1px solid #e0e0e0;}
.mou_list ul li a b{float:left;width:90%;line-height:18px;font-size:14px;padding:0 5%;color:#000;}
.mou_list ul li a p{float:left;width:90%;line-height:15px;font-size:11px;padding:0 5%;color:#555;margin:8px 0 10px 0;}
.mou_list ul li a span{position:absolute;left:0;bottom:10px;width:100%;line-height:100%;font-size:11px;font-family:'dotum' !important;color:#999;}


/* 찾아오시는길 */
.root_daum_roughmap{width:100% !important;border:none !important;padding:0 !important;height:230px !important;}
.wrap_map{height:260px !important;}
.map-video{width:100%; position:relative; padding-top:56.25%; z-index:66; margin-bottom:50px;}
.map-video iframe{position:absolute; left:0; top:0; width:100%; height:100%; border:0;}


/*대관문의*/
.ul03{display:flex; flex-direction: column; gap:50px;}
.ul03 li{ display:flex; gap:15px; flex-direction: column;}
.ul03-img{width:100%; flex-shrink: 0;}
.ul03-img img{width:100%;}
.ul03-txt{flex-grow: 1;}
.ul03-txt dt{font-weight:700; font-size:20px; margin-bottom:0px; color:#111; margin-top:10px;}
.ul03-txt table{width:100%; table-layout: fixed;}
.ul03-txt table td, .ul03-txt table th{text-align:left; padding:15px 0; border-bottom:1px #eee solid; font-size:14px; color:#444;}
.ul03-txt table th{width:30%; font-weight:600;}
.ul03-txt table td p{position:relative; padding-left:10px; font-size:15px; margin:7px 0;}
.ul03-txt table td p:before{content:""; display:block; position:absolute; width:4px; height:4px; background:#ccc; left:0; top:7px; border-radius:999px;}


/*조직도*/
.organization{width:360px; margin:0 auto;}
.orga-box p{width:160px; height:35px; background:#255fd5; color:#fff; font-weight:600; display:flex; justify-content: center; align-items: center; font-size:16px; border-radius:10px;}
.orga-box p span{font-weight:400; font-size:13px;}
.orga-box{display:flex; justify-content: center; position:relative;}
.orga-box:before{content:""; display:block; width:1px; background:#b4bcc5; position:absolute; height:20px; bottom:-20px; left:50%; margin-left:-1px;}
.orga1{margin-bottom:20px;}
.orga2{margin-bottom:20px;}
.orga2:before{height:20px; bottom:-20px;}

.orga1 p, .orga2 p{flex-direction: column; gap:5px; height:50px;}
.orga2 p{background:#258cd5;}

.orga3:after{content:""; display:block; width:190px; height:1px; left:50%; margin-left:calc(-95px + 1px); top:0; background:#b4bcc5; position:absolute; }
.orga3:before{display:none;}
.orga3{padding-top:15px; justify-content: space-between;}
.orga3 > div{width:170px;}
.orga3 p{width:80px; margin:0 auto; position:relative; font-size:14px; background:#083261;}
.orga3 p:before{content:""; display:block; width:1px; background:#b4bcc5; position:absolute; height:15px; top:-15px; left:50%; margin-left:1px;}
.orga3 p:after{content:""; display:block; width:1px; height:15px; background:#b4bcc5; position:absolute;left:50%; margin-left:-1px; bottom:-15px;}
.orga3 ul{display:flex; justify-content: space-between; margin-top:30px; position:relative;}
.orga3 ul:after{content:""; display:block; width:calc(100% - 55px); height:1px; left:27px; position:absolute;background:#b4bcc5; top:-15px;}
.orga3 ul li{width:55px; background:#d1dae5; color:#404d5a; font-size:12px; word-break: keep-all; text-align:center; height:35px; border-radius:5px; display:flex; justify-content: center;align-items: center; position:relative;}
.orga3 ul li:before{content:""; display:block; width:1px; background:#b4bcc5; position:absolute; height:15px; top:-15px; left:50%; margin-left:-1px;}







/* 이미지크기 제멋대로일때 조정해주는 style */
@media screen and (min-width:0) and (max-width:420px) {
.gallery ul li{height:140px;}
.gallery ul li a img{height:100px;}

.facility ul li{width:47%;height:150px;}
.facility ul li img{height:100px;}

.mou_list ul li a img{height:38px;}
}

@media screen and (min-width:421px) and (max-width:767px) {
.gallery ul li{height:220px;}
.gallery ul li a img{height:170px;}

.facility ul li{width:47%;height:210px;}
.facility ul li img{height:160px;}

.mou_list ul li a img{height:49px;}
}

@media screen and (min-width:768px) and (max-width:1023px) {
.gallery ul li{height:280px;}
.gallery ul li a img{height:220px;}

.facility ul li{height:170px;}
.facility ul li img{height:130px;}

.mou_list ul li{width:33.15%;}
.mou_list ul li a img{height:61px;}
}

@media screen and (min-width:1024px) and (max-width:1920px) {
.gallery ul li{height:320px;}
.gallery ul li a img{height:240px;}

.facility ul li{height:180px;}
.facility ul li img{height:140px;}

.mou_list ul li{width:24.87%;}
.mou_list ul li a img{height:59px;}
}