@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR&display=swap');
@import url('https://cdn.jsdelivr.net/npm/font-kopub@1.0/kopubdotum.min.css');
@import url('/html/fonts/KoPub.css'); 
@import url('/html_hd3/css/tooltip.css');

.gnb {position:absolute; top:-1px;width:auto;left:50%; transform:translateX(-50%);z-index:11;overflow:hidden;height:50px;letter-spacing:0}
.gnb ul {display:inline-block;width:100%; margin:0px auto;text-align:center;}
.gnb ul li {position:relative;float:left; width:220px; display:inline-block; margin:0px 0px;text-align:center;}
.gnb .depth1 {font-family:'KoPubWorld Dotum', sans-serif;position:relative; display:block; color:#000; font-size:18px; font-weight:bold;border-top:1px #dedede solid;height:50px;line-height:50px;letter-spacing:-0.05em;}
.gnb .depth1:hover {color:#719d2f !important;border-top:1px #719d2f solid; }
.gnb ul li ul {display:block;padding:10px 0 30px 0;height:auto !important;  min-height:150px !important; opacity:0;transform:translateY(20px)}
.gnb ul li ul li {float:none; display:block;height:35px; width:100%;padding:10px 0px;margin:0px;text-align:center;box-sizing:border-box;}
.gnb ul li ul li a {font-family:"KoPubWorld Dotum", sans-serif;display:inline-block;width:auto;padding:0px;font-size:15px; font-weight:normal;height:auto;line-height:100%;color:#555;border-bottom:1px #fff solid;text-align:center; box-sizing:border-box;}
.gnb ul li ul li a:hover {color:#000;border-bottom:1px #000 solid;}

.navi-bg.open { height:330px;}
.gnb.open { height:330px;}

.main_banner {width:100%;padding:0px;text-align:center; margin:0px 0px;display:flex;text-align:center;z-index:101; vertical-align:top;}
.main_banner li { position:relative;width:220px;height:220px;margin:0px 12px;display:inline-block;text-align:center;transition: all 0.2s ease;border-radius:5px;}
.main_banner li:first-child { margin-left:0px;}
.main_banner li:last-child { margin-right:0px;}
.main_banner li a {position:relative;display:inline-block;margin:15px;padding:130px 10px 0px 10px;text-align:center; transition: all 0.2s ease;}
.main_banner li a h2 {width:100%;font-family:"KoPubWorld Dotum", sans-serif;color:#fff;font-size:19px;line-height:25px;font-weight:bold;padding-bottom:5px;letter-spacing:-0.05em;}
.main_banner li.main_ban1 {background:#178ea0 url('/html_hd3/images/common/main_banner1.png') 50% 30px no-repeat; border:1px #0e8091 solid;}
.main_banner li.main_ban2 {background:#4b45ac url('/html_hd3/images/common/main_banner2.png') 50% 30px no-repeat; border:1px #433da7 solid;}
.main_banner li.main_ban3 {background:#525252 url('/html_hd3/images/common/main_banner3.png') 50% 30px no-repeat; border:1px #444 solid;}
.main_banner li.main_ban4 {background:#df4834 url('/html_hd3/images/common/main_banner4.png') 50% 30px no-repeat; border:1px #d53f2b solid;}
.main_banner li.main_ban5 {background:#1767a0 url('/html_hd3/images/common/main_banner5.png') 50% 30px no-repeat; border:1px #1767a0 solid;}
.main_banner li.main_ban6 {background:#df4834 url('/html_hd3/images/common/main_banner6.png') 50% 30px no-repeat; border:1px #d53f2b solid;}
.main_banner li.main_ban2 a,
.main_banner li.main_ban4 a{padding-top:125px;}

.main_banner li.main_ban4 .tooltip,
.main_banner li.main_ban5 .tooltip {
	position:absolute; left:50%; margin-left:-75px; top:-55px; width:150px; height:40px; line-height:40px; font-size:17px;font-weight:bold; border-radius:4px; color:#fff; text-align:center;
	animation: animationFrames linear 2.5s;
    animation-iteration-count: infinite;
    transform-origin: 50% 50%;
    -webkit-animation: animationFrames linear 2.5s;
    -webkit-animation-iteration-count: infinite;
    -webkit-transform-origin: 50% 50%;
}
.main_banner li.main_ban4 .tooltip {background:#d53f2b; }
.main_banner li.main_ban4 .tooltip::before {content:'교육 당일'; }
.main_banner li.main_ban4 .tooltip::after {content:''; position:absolute; left:50%; transform:translateX(-50%) rotate(45deg); top:35px; width:10px; height:10px; border-radius:2px; background:#d53f2b;}

.main_banner li.main_ban5 .tooltip {background:#1767a0; }
.main_banner li.main_ban5 .tooltip::before {content:'교육 전'; }
.main_banner li.main_ban5 .tooltip::after {content:''; position:absolute; left:50%; transform:translateX(-50%) rotate(45deg); top:35px; width:10px; height:10px; border-radius:2px; background:#1767a0;}

.main_bcs {width:100%;text-align:center; padding:30px;font-size:18px;}
.main_bcs b {font-weight:bold;color:#000;}
.main_bcs span {font-weight:bold;color:#c63f20;}

