html{font-family:'NotoKr', '맑은 고딕', 'Dotum', '돋움', 'Gulim', '굴림', sans-serif !important;}
body {transform-origin:left top; }

#header .wrap {padding-top:25px; padding-bottom:25px; font-size:0;}

@media screen and (max-width:1000px) {
	#header {background-color:#fff;}
	#header .wrap {padding-top:51px; padding-bottom:20px;}
}

@media screen and (max-width:640px) {
	#header .wrap {padding-top:46px; padding-bottom:15px;}
}

#header .logo {width:260px; margin-right:auto; text-align:left; line-height:0; }
#header .logo a {display:block;}

@media screen and (max-width:1000px) {
	#header .logo {position:static; margin-left:auto; text-align:center;}
	#header .logo a {display:inline-block;}
}

@media screen and (max-width:640px) {
	/*#header .logo a img {width:160px;}*/
	#header .logo a img {width:100%;}
}

#header .search {position:absolute; top:20px; right:165px; width:320px;}
#header .search .search_open {display:none;}
#header .search .search_close {display:none;}
#header .search .search_form form fieldset {position:relative;}
#header .search .search_form form fieldset .keyword {display:block; width:100%; height:48px; padding:5px 53px 5px 20px; border-radius:25px; border:1px solid #cfcfcf; font-size:14px;}
#header .search .search_form form fieldset .submit {position:absolute; top:0; right:0; width:48px; height:48px; border-radius:50%; text-align:center;}
#header .search .search_form form fieldset .submit:after {display:inline-block; width:0; height:100%; vertical-align:middle;}
#header .search .search_form form fieldset .submit input[type='submit'] {width:20px; height:20px; background:url('/resource/edu2021/images/common/btn_header_search.png') no-repeat; font-size:0;border:none;}

@media screen and (max-width:1200px) {
	#header .search {right:165px; width:193px;}
}

@media screen and (max-width:1000px) {
	#wrapper:before {display:block; visibility:hidden; opacity:0; position:fixed; top:0; left:0; z-index:25; width:100%; height:100%; background-color:rgba(0, 0, 0, 0.5); transition-property:visibility, opacity; transition-duration:0.25s; transition-timing-function:linear;}
	.search_active #wrapper:before {visibility:visible; opacity:1;}
	#header .search {position:static; width:auto; margin-right:0; margin-left:0;}
	#header .search .search_open {display:block; position:absolute; top:45px; right:2%;}
	#header .search .search_open button {display:block; width:58px; height:58px; line-height:0;/*margin-top: 15px;*/}
	#header .search .search_open button:before {display:inline-block; width:27px; height:28px; background:url('/resource/edu2021/images/common/common_sprite.png') no-repeat left top;}
	#header .search .search_close {display:block; visibility:hidden; opacity:0; position:absolute; top:45px; right:2%; transition-property:visibility, opacity; transition-duration:0.25s; transition-timing-function:linear;}
	.search_active #header .search .search_close {visibility:visible; opacity:1;}
	#header .search .search_close button {display:block; width:58px; height:58px; border-radius:50%; background-color:#fff;}
	#header .search .search_close button:before {display:inline-block; position:absolute; top:0; right:0; bottom:0; left:0; width:25px; height:26px; margin:auto; background:url('/resource/edu2021/images/common/common_sprite.png') no-repeat left -98px;}
	#header .search .search_form {visibility:hidden; opacity:0; position:absolute; top:100%; left:0; width:100%; background-color:#727982; transition-property:visibility, opacity; transition-duration:0.25s; transition-timing-function:linear;}
	.search_active #header .search .search_form {visibility:visible; opacity:1;}
	#header .search .search_form form {padding:20px 2%;}
}

@media screen and (max-width:640px) {
	#header .search .search_open {top:50px;}
	#header .search .search_open button {width:42px; height:42px;}
	#header .search .search_open button:before {width:19px; height:20px; background-size:103.7% 942.85%;}
	#header .search .search_close {top:50px;}
	#header .search .search_close button {width:42px; height:42px;}
	#header .search .search_close button:before {width:18px; height:19px; background-position:left 41.17%; background-size:112% 1015.38%;}
}

/* gnb */
#header .gnb {position:absolute; top:38px; right:0;}
#header .gnb ul li {float:left; position:relative; margin-left:12px; padding-left:13px;}
#header .gnb ul li:first-child {margin-left:0; padding-left:0;}
#header .gnb ul li:before {display:block; position:absolute; top:4px; left:0; width:1px; height:10px; background-color:#b2b2b2;}
#header .gnb ul li:first-child:before {display:none;}
#header .gnb ul li a {display:block; color:#000; font-size:15px; line-height:17px;}
#header .gnb ul li.admin {float:none; position:absolute; top:0; right:-85px;}
#header .gnb ul li.admin a {font-weight:600;}

@media screen and (max-width:1000px) {
	#header .gnb {top:0; width:100%; border-bottom:1px solid #b2b2b2;}
	#header .gnb ul li {width:50%; height:30px; margin-left:0; padding-left:0; text-align:center;}
	#header .gnb ul li:before {top:10px;}
	#header .gnb ul li:after {display:inline-block; width:0; height:100%; vertical-align:middle;}
	#header .gnb ul li a {display:inline-block; overflow:hidden; position:relative; max-width:100%; font-size:13px; line-height:15px; white-space:nowrap; text-overflow:ellipsis; vertical-align:middle;}
	#header .gnb ul li.admin {display:none;}
}


/* lnb */
#header .lnb {position:relative; height:50px; border-top:1px solid #dcdcdc; border-bottom:1px solid #dcdcdc;}
#header .lnb .nav {position:absolute; top:0; left:0; width:100%; height:100%; background-color:#fff;}
#header .lnb .nav .nav_title {display:none;}

/* 1차메뉴 */
#header .lnb .nav .depth1_item {width:16.666%; transition-property:z-index;}
#header .lnb .nav .depth1_text {padding:14px 5px 15px; color:#363636; font-size:19px; font-weight:600; line-height:21px; text-align:center; transition-property:color;}
#header .lnb .nav .depth1_item:first-child .depth1_text:after {left:0;}

/* 1차메뉴 활성화 */
#header .lnb .nav .depth1_item.active {z-index:10;}
#header .lnb .nav .depth1_item.active .depth1_text {color:#3660e2; font-weight:bold;}

/* 2차메뉴 */
#header .lnb .nav .depth2 {background-color:#f0f7fd; transition-property:visibility, opacity, transform; padding:10px 0}
#header .lnb .nav .depth2_item {margin-top:13px;}
#header .lnb .nav .depth2_item:first-child {margin-top:0;}
#header .lnb .nav .depth2_text {padding:5px 20px;color:#2a2a2a; font-size:15px; line-height:17px; transition-property:color; text-align:center;}

/* 2차메뉴 활성화 */
#header .lnb .nav .depth1_item.active .depth2 {visibility:visible; opacity:1; transform:scaleY(1);}
#header .lnb .nav .depth2_item.active .depth2_text {padding:10px 20px;background-color:#1c7ed6;color:#fff;font-weight: bold;}

/* 중앙정렬 넓이 */
#header .lnb .nav .depth1 {width:1200px;}

#header .lnb .nav .depth2 {width:100%;}


@media screen and (max-width:1200px) {
	#header .lnb .nav .depth1 {width:100%;}
}

@media screen and (max-width:1000px) {
	#header .lnb {height:auto; border-top-width:0;}
	#header .lnb:before {display:block; visibility:hidden; opacity:0; position:fixed; top:0; left:0; z-index:20; width:100%; height:100%; background-color:rgba(0, 0, 0, 0.5); transition-property:visibility, opacity; transition-duration:0.25s; transition-timing-function:linear;}
	#header .lnb .nav {visibility:hidden; overflow-x:hidden; overflow-y:auto; position:fixed; top:0; left:-70%; z-index:30; width:70%; height:100%; background-color:#337cc8; transition-property:visibility, left;}

	/* 버튼 */
	#header .lnb .nav_open {visibility:visible; top:-69px; left:2%; z-index:10;}
	#header .lnb .nav_open .nav_button {width:58px; height:58px;}
	#header .lnb .nav_open .nav_button:before {display:inline-block; width:28px; height:28px; background:url('/resource/edu2021/images/common/common_sprite.png') no-repeat left -60px;}
	#header .lnb .nav_close {position:fixed; top:16px; left:-78px; z-index:40; transition-property:visibility, left, margin-left;}
	#header .lnb .nav_close .nav_button {width:58px; height:58px;}
	#header .lnb .nav_close .nav_button:before {display:inline-block; width:25px; height:26px; background:url('/resource/edu2021/images/common/common_sprite.png') no-repeat left -98px;}

	/* 메뉴를 열었을때 */
	.lnb_open, .lnb_open body {overflow:hidden;}
	.lnb_open #header .lnb:before, .lnb_open #header .lnb .nav, .lnb_open #header .lnb .nav_close {visibility:visible;}
	.lnb_open #header .lnb:before {opacity:1;}
	.lnb_open #header .lnb .nav {left:0;}
	.lnb_open #header .lnb .nav_close {left:70%; margin-left:-78px;}

	/* 제목상자 */
	#header .lnb .nav .nav_title {display:block; overflow:hidden; position:fixed; top:0; left:-70%; z-index:20; width:70%; height:90px; padding-right:78px; padding-left:30px; box-sizing:border-box; background-color:#fff; transition:left 0.25s linear;}
	#header .lnb .nav .nav_title img {vertical-align:middle;}
	#header .lnb .nav .nav_title:after {display:inline-block; width:0; height:100%; vertical-align:middle;}

	/* 제목상자 활성화 */
	.lnb_open #header .lnb .nav .nav_title {left:0;}

	/* 1차메뉴 */
	#header .lnb .nav .depth1 {z-index:10; width:auto; height:auto; margin-right:0; margin-left:0; padding-top:90px; transition-property:padding-right, z-index;}
	#header .lnb .nav .depth1_list {height:auto;}
	#header .lnb .nav .depth1_item {float:none; position:relative; width:auto; height:auto;}
	.login #header .lnb .nav .depth1_item.mypage {display:block;}
	#header .lnb .nav .depth1_text {padding:24px 10px 25px 31px; color:#fff; text-align:left; transition-property:background-color, color;}
	#header .lnb .nav .depth1_text:hover {text-decoration:underline;}
	#header .lnb .nav .depth1_item:first-child .depth1_text:after, #header .lnb .nav .depth1_text:before {display:none;}
	#header .lnb .nav .depth1_item:first-child .depth1_text[target='_blank']:after {display:inline-block; position:static; width:1px; height:1px; background-image:none; content:'새창'}
	#header .lnb .nav .depth1_item.has .depth1_text:before {display:inline-block; position:static; width:1px; height:1px; background-image:none; content:'하위메뉴가있는';}

	/* 1차메뉴 활성화 */
	.lnb_active #header .lnb .nav .depth1 {padding-right:62.5%;}
	#header .lnb .nav .depth1_item.active .depth1_text {background-color:#fff; color:#004ec7;}
	#header .lnb .nav .depth1_item.active .depth1_text:hover {text-decoration:none;}

	/* 2차메뉴 */
	#header .lnb .nav .depth2 {overflow-x:hidden; overflow-y:auto; position:fixed; top:0; left:-26.25%; z-index:auto; width:43.75%; height:100%; padding:90px 30px 10px; box-sizing:border-box; background-color:#fff; transform-origin:right center; transition-property:visibility, opacity, left, transform;}
	#header .lnb .nav .depth2_list {padding:0;}
	#header .lnb .nav .depth2_item {float:none; width:auto; height:auto; margin-top:0; border-bottom: 1px dotted #004ec7; border-style: dashed; transition-property:border-bottom-color;}
	#header .lnb .nav .depth2_item.has:before {display:block; position:absolute; top:23px; right:0; width:16px; height:16px; background:url('/resource/edu2021/images/common/common_sprite.png') no-repeat left -160px;}
	#header .lnb .nav .depth2_text {padding:21px 0 22px 0; color:#004ec7; font-size:18px; line-height:20px; transition-property:none; text-align:left;}
	#header .lnb .nav .depth2_text[target='_blank'] {padding-right:20px;}
	#header .lnb .nav .depth2_item.has .depth2_text {margin-right:20px;}
	#header .lnb .nav .depth2_item.has .depth2_text[target='_blank'] {display:inline-block;}
	#header .lnb .nav .depth2_text:hover {text-decoration:underline;}
	#header .lnb .nav .depth2_text[target='_blank']:after {display:block; position:absolute; top:23px; right:0; width:16px; height:16px; background:url('/resource/edu2021/images/common/common_sprite.png') left -134px; transition-property:top, height, background-color;}

	/* 이전 2차메뉴 활성화 제거 */
	#header .lnb .nav .depth1_item.active .depth2 {visibility:hidden; transform:scaleY(1);}
	#header .lnb .nav .depth2_item.active {background-color:transparent;}
	#header .lnb .nav .depth2_item.active .depth2_text {color:#004ec7; font-weight:600;}

	/* 2차메뉴 활성화 */
	.lnb_open #header .lnb .nav .depth1_item .depth2 {left:26.25%; transform:scaleX(0);}
	.lnb_open.lnb_active #header .lnb .nav .depth1_item.active .depth2 {visibility:visible;}
	#header .lnb .nav .depth1_item.active .depth2 {transform:scaleX(1);}
	#header .lnb .nav .depth2_item.active {border-bottom-color:transparent;}
	#header .lnb .nav .depth2_item.has.active:before {top:30px; height:1px; background-color:#004ec7; background-image:none;}
	#header .lnb .nav .depth2_item.active .depth2_text:hover {text-decoration:none;}
}

@media screen and (max-width:640px) {
	#header .lnb .nav {left:-100%; width:100%;}
	#header .lnb:before {display:none;}

	/* 버튼 */
	#header .lnb .nav_open {top:-55px;}
	#header .lnb .nav_open .nav_button {width:42px; height:42px;}
	#header .lnb .nav_open .nav_button:before {width:20px; height:20px; background-position:left 25.42%; background-size:100% 942.85%;}
	#header .lnb .nav_close {top:24px; left:-61px;}
	#header .lnb .nav_close .nav_button {width:42px; height:42px;}
	#header .lnb .nav_close .nav_button:before {width:18px; height:19px; background-position:left 41.17%; background-size:112% 1015.38%;}

	/* 버튼 활성화 */
	.lnb_open #header .lnb .nav_close {left:100%; margin-left:-61px;}

	/* 제목상자 */
	#header .lnb .nav .nav_title {left:-100%; width:100%; padding-right:61px; padding-left:23px;}
	#header .lnb .nav .nav_title img {height:39px;}

	/* 1차메뉴 */
	#header .lnb .nav .depth1_text {padding-top:14px; padding-bottom:15px; padding-left:19px; font-size:15px; line-height:17px;}

	/* 2차메뉴 */
	#header .lnb .nav .depth2 {left:-37.5%; width:62.5%; padding-right:20px; padding-left:20px;}
	#header .lnb .nav .depth2_item.has:before {top:16px;}
	#header .lnb .nav .depth2_item .depth2_text {padding-top:14px; padding-bottom:15px; font-size:16px; line-height:18px;}
	#header .lnb .nav .depth2_item .depth2_text[target='_blank']:after {top:16px;}

	/* 2차메뉴 활성화 */
	.lnb_open #header .lnb .nav .depth1_item .depth2 {left:37.5%;}
	#header .lnb .nav .depth2_item.has.active:before {top:23px;}
}

/* 하단 */
#footer {background-color:#222732;}
#footer .wrap {position: relative;padding-top:30px; padding-right:150px; padding-bottom:60px; box-sizing:border-box;}
#footer .footer_nav {margin-bottom:20px; padding-left:0;}
#footer .footer_nav ul li {float:left; position:relative; margin-left:22px; padding-left:25px;}
#footer .footer_nav ul li:first-child {margin-left:0; padding-left:0;}
#footer .footer_nav ul li:before {display:block; position:absolute; top:5px; left:0; width:1px; height:9px; background-color:#89919a;}
#footer .footer_nav ul li:first-child:before {display:none;}
#footer .footer_nav ul li a {display:block; color:#fff; font-size:16px; line-height:18px;}
#footer .footer_nav ul li.privacy a {color:#a5d8ff;}
#footer .footer_info {padding-left:0; color:#fff;}
#footer .footer_info address {font-size:16px; line-height:18px; margin-bottom:10px;}
#footer .footer_info address mark {display:inline-block; margin-left:20px;}
#footer .footer_info p {font-size:14px; line-height:20px;}

/*
#footer #btn_quick_bar {position:fixed;bottom:70px;right:10px;z-index:0;width:120px;height:120px;border:none;font-size:0;transition:all .2s ease-in-out}
#footer #btn_qucik_bar img {display:inline-block;}
*/

#footer #btn_site_top {position:fixed;bottom:10px;right:10px;z-index:0;width:40px;height:40px;border:none;border-radius:50%;background:#000;font-size:0;opacity:.3;transition:all .2s ease-in-out}
#footer #btn_site_top img {display:inline-block;vertical-align: middle;}

@media screen and (max-width:1200px){
	#footer .wrap {padding-right:0;}
}

@media screen and (max-width:1000px) {
	#footer .wrap {padding:unset;padding:20px;}
	#footer .footer_nav {overflow:hidden; padding-left:0;}
	#footer .footer_nav ul {margin-top:-5px; font-size:0; line-height:0; text-align:center;}
	#footer .footer_nav ul li {display:inline-block; float:none; margin-top:5px; vertical-align:middle;}
	#footer .footer_info {padding-left:0; text-align:center;}
}

@media screen and (max-width:640px) {
	#footer .footer_nav ul li {margin-left:13px; padding-left:13px;}
	#footer .footer_info {color:#dddfe2;}
	#footer .footer_info address {margin-bottom:20px;}
	#footer .footer_info address mark {display:none;}

	/*#footer #btn_quick_bar {display: none}*/
}

/* 20211130 수정 */

#header .lnb .nav .depth1_item.active .depth1_text {color:#f44502;}
#header .lnb .nav .depth2 {background-color:#f9f9f9;}
#header .lnb .nav .depth2_item.active .depth2_text {background-color:#f44502;}


/* 2025.08.11 개편 수정 - 사이버학이시습 퀵 버튼 디자인 변경 */
#footer #btn_quick_bar{position:fixed; bottom:0; top:60%; right:10px; display:block; height:max-content; animation:i_repeat 2s linear infinite normal forwards; z-index:1;}
#footer #btn_quick_bar a{line-height:1.2em; text-align:center; font-size:14px; font-weight:bold;margin:0 auto;color:#fff; background:#0469b4; border-radius:50%; display:flex; justify-content: center;align-items: center;width:105px; height:105px; text-decoration:none;box-shadow:5px 5px 10px rgba(0,0,0,.2);}
#footer #btn_quick_bar a:before{content:""; display:block; background:url(http://iksanwww.9is.co.kr/resource/edu2021/images/common/img_quick.png) no-repeat center / 100%; width:85px; height:85px; position:absolute; top:-100px; left:50%;transform: translateX(-50%);}
#footer #btn_quick_bar a:after{content:"";display:block;width:0;height:0;border-left: 8px solid transparent;border-top: 0px solid transparent;border-bottom: 8px solid #0469b4;border-right: 8px solid transparent;position:absolute;top: -12px;left:0;right:0;margin:auto;}

@keyframes i_repeat {
    from{transform:translateY(0);}
    50%{transform:translateY(-.5em);}
    to{transform:translateY(0);}
}

@media screen and (max-width:1368px) {
    #footer #btn_quick_bar{top: initial;bottom: 70px;}
    #footer #btn_quick_bar a{width:90px;height:90px;font-size:13px;}
    #footer #btn_quick_bar a:before{width:70px;height:67px;top:-90px;}
}

@media screen and (max-width:1023px) {
  	#footer #btn_quick_bar{animation:none;}
    #footer #btn_quick_bar a:before,
    #footer #btn_quick_bar a:after{display:none;}
}

@media screen and (max-width:640px) {
    #footer #btn_quick_bar{display:none;}
}
/* end */