@charset "utf-8";
@import url("basic.css");

/* skipnav */
.skipnav {position:absolute; width:100%; z-index:100000;}
.skipnav dd a {position:absolute; display:block; left:0; top:0; width:1px; height:1px; margin:-10000px 0 0 -10000px; padding:0; background-color:#033477; text-align:center; overflow:hidden; color:#fff; font-weight:bold;}
.skipnav dd a:hover,.skipnav dd a:active,.skipnav dd a:focus {margin:0; width:100%; height:auto; padding:10px;}

/* mobile */
#asideArea {
	display:none;
}

/********************************************************************************************************************************************/
/* header */
#header {position:absolute; width:100%; left:0;width:100%;height:109px;z-index:998; border-bottom:none; padding:0 30px;}
#header:after {content:""; display:block; width:100%; height:110px; background:#fff; position:absolute; left:0; top:0; opacity:0; -webkit-opacity:0; z-index:1; transition:all 0.3s ease; -webkit-transition:all 0.3s ease;} 
#header .headerWrap {position:relative; width:100%; height:auto; z-index:2;}
#header .s_top {display:block; overflow:hidden; margin-top:15px;}
#header .s_top ul.related_site {float:right; color:#fff;}
#header .s_top ul.related_site li {display:inline-block; font-size:14px;}
#header .s_top ul.related_site li:before {position:relative; display:inline-block; width:1px; height:11px; background:#fff; margin:0 10px 0 5px; content:'';}
#header .s_top ul.related_site li:first-child:before {display:none;}
#header .s_top ul.related_site li a:hover {color:#4476b9;}
#header .headLogo {position:relative; float:left; width:362px; height:54px; z-index:99;}
#header .headLogo a {display:block; width:100%; height:54px; font-size:0; background:url('../images/common/top_logo.png') center no-repeat; background-size:contain;}
#header ul.util {position:relative; float:right; margin-top:24px; z-index:2;}
#header ul.util li {float:left;}
#header ul.util li a {line-height:35px;}
#header ul.util li.headLogin {width:38px; height:35px; font-size:0; margin-left:15px;}
#header ul.util li.headLogin a {height:35px; background:url("../images/common/login_btn.png")no-repeat; text-indent:-99999px; display:block;}
#header ul.util li.headRegist {width:38px; height:35px; font-size:0; margin-left:15px;}
#header ul.util li.headRegist a {height:35px; background:url("../images/common/regist_btn.png")no-repeat; text-indent:-99999px; display:block;}
#header ul.util li.search_common {width:33px; height:33px; margin-top:1px; font-size:0; margin-left:15px;}
#header ul.util li.search_common a {height:35px; background:url("../images/common/search_btn.png")no-repeat; text-indent:-99999px; display:block;}
#header .menu {display:none;}

.headGnb .extension {width:100%; text-align:center;}
.headGnb .extension > li {float:left; width:160px; text-align:center;}
.headGnb .extension > li > a {display:block; position:relative; font-size:19px; width:100%; letter-spacing:-0.02em; text-align:center; text-transform:uppercase; color:#fff; padding:15px 0 29px; font-family:'notokr-bold', sans-serif;}
.headGnb .extension > li > a:hover {color:#4476b9;}
.headGnb .extension > li:hover > a:before {transform:scaleX(1);}
.headGnb .extension > li > ul.headSubMenu {position:absolute; left:-30px; z-index:2; display:none; padding:20px 0; width:calc(100% + 60px); background:#fff; box-sizing:border-box; top:70px; border-top:1px solid #ddd;}
.headGnb .extension > li:hover > ul.headSubMenu {display:block !important;}
.headGnb .extension > li > ul.headSubMenu > li {display:inline-block; font-size:17px; text-align:left; color:#333;}
.headGnb .extension > li > ul.headSubMenu > li > a {position:relative; display:block; overflow:hidden; color:#000; padding:0px 36px; letter-spacing:-0.03em;}
.headGnb .extension > li > ul.headSubMenu > li > a:hover {color:#4476b9;}

.headGnb .extension > li.m1 ul.headSubMenu > li.s1 {margin-left:28%;}
.headGnb .extension > li.m2 ul.headSubMenu > li.s1 {margin-left:20%;}
.headGnb .extension > li.m3 ul.headSubMenu > li.s1 {margin-left:34%;}

#header:hover .headGnb .extension > li > a:hover {color:#4476b9;}
#header:hover .headGnb .extension > li > ul.headSubMenu > li > a:hover {color:#4476b9;}


#header .location {position:relative; top:40px; color:#fff; float:right; vertical-align:middle; font-size:14px;}
#header .location:before {position:relative; display:inline-block; width:14px; height:20px; background:url('../img/location_icon.png') center no-repeat; content:''; margin-right:6px; top:4px;}

#gnb_slide {display:none;}
	
	@media (min-width:1025px) {
		#header:hover:after {opacity:1; -webkit-opacity:1;}
		#header:hover .s_top ul.related_site {color:#222;}
		#header:hover .s_top ul.related_site li:before {background:#222;}
		#header:hover .headLogo a {background:url('../images/common/top_logo_b.png') center no-repeat; background-size:contain;}
		#header:hover .headGnb .extension > li > a {color:#222;}
		#header:hover ul.util li.search_common a {background:url("../images/common/search_btn_b.png")no-repeat;}

		.headGnb {position:absolute; float:left; border:0; box-shadow:none; padding-left:45%; width:100%;}
	}

	@media (max-width:1279px) {
		#header .headLogo {width:300px;}
		#header ul.util {margin-top:14px;}
		.headGnb {padding-left:33%;}

		.headGnb .extension > li.m1 ul.headSubMenu > li.s1 {margin-left:0;}
	}

	@media (max-width:1024px) {
		#header {height:90px; padding:20px 2%;}
		#header:after {opacity:1; height:90px;}
		#header .s_top {display:none;}
		#header .headLogo {width:367px;}
		#header .headLogo a {background:url('../images/common/top_logo_b.png') center no-repeat; background-size:contain;}
		#header ul.util {margin-top:0;}
		#header ul.util .headLogin {display:none;}
		#header ul.util .headRegist {display: none;}
		.headGnb {display:none;}

		#header .menu {display: block; width:58px; height: 58px; line-height: 58px; text-align: center; font-size:0; background: url(../images/common/mobile_menu_btn.png) center no-repeat; background-size:contain;}
	
		#gnb_slide {display:block;position:fixed;top:0;right:-110%;width:100%;height:100%;z-index:999;}
		#gnb_slide ._bg {position:fixed;top:0;left:0;z-index:0;width:100%;height:100%;background:rgba(0,0,0,0.8);display:none;}
		#gnb_slide ._close {border:0;position:absolute;top:0;right:0;z-index:2;background:url('../images/common/mobile_menu_close_btn.png') #3a3a3c center no-repeat; font-size:0px;width:80px;height:80px;line-height:80px;text-align:center; background-size:36px;}
		#gnb_slide .gnb {position:absolute;top:0;right:0;z-index:1;width:100%;height:100%;overflow-y:auto;overflow-x:hidden;background:#fff;box-shadow:0 0 3px rgba(0,0,0,0.1);}
		#gnb_slide .gnb .all_menu {display:block; line-height:20px;padding:30px 25px; font-size:24px; color:#fff; background:#727171;}
		#gnb_slide .gnb > ul.gnb_top {display:block; overflow:hidden;}
		#gnb_slide .gnb > ul.gnb_top > li {float:left;width:50%; text-align:center; border-right:1px solid rgba(230,230,230,0.5);}
		#gnb_slide .gnb > ul.gnb_top > li:last-child {border-right:0;}
		#gnb_slide .gnb > ul.gnb_top > li > a {font-size:18px; padding:15px 0;}
		#gnb_slide .gnb li a {display:block;color:#333;line-height:20px;}
		#gnb_slide .gnb > ul.dep1 {border-top:1px solid rgba(230,230,230,0.5);}
		#gnb_slide .gnb > ul.dep1 > li {border-bottom:1px solid rgba(230,230,230,0.5);}
		#gnb_slide .gnb > ul.dep1 > li > a {padding:22px 40px;color:#2a2a2a; position:relative; font-size:20px; text-transform:uppercase;}
		#gnb_slide .gnb > ul.dep1 > li > a:after {position:absolute; right:25px; display:inline-block; width:20px; height:20px; background:url('../images/common/mobile_menu_plus_btn.png') center no-repeat; background-size:contain; content:'';  transform: rotate(90deg); -webkit-transform: rotate(90deg); transition: all 0.3s ease; -webkit-transition: all 0.3s ease;}
		#gnb_slide .gnb > ul.dep1 > li.active > a {background:#4476b9; color:#fff; font-weight:normal;}
		#gnb_slide .gnb > ul.dep1 > li.active > a:after {background:url('../images/common/mobile_menu_minus_btn.png') center no-repeat; transform: rotate(360deg); -webkit-transform: rotate(360deg);}
		#gnb_slide .gnb > ul.dep1 > li > ul {height:auto !important;max-height:0;overflow:hidden;transition:all 0.3s;background:#f8f8f8;}
		#gnb_slide .gnb > ul.dep1 > li.active > ul {max-height:600px;}
		#gnb_slide .gnb > ul.dep1 > li > ul li {border-bottom:1px solid #e6e6e6;}
		#gnb_slide .gnb > ul.dep1 > li > ul li:last-child {border-bottom:0;}
		#gnb_slide .gnb > ul.dep1 > li > ul li a {padding:20px 40px;font-size:18px;color:#2a2a2a;line-height:18px;}
		#gnb_slide .gnb > ul.dep1 > li > ul li.active a {color:#255aa5;}

		#header ul.util li.search_common {width:58px; height: 58px; margin-left:10px;}
		#header ul.util li.search_common a {line-height: 58px; background: url('../images/common/mobile_search_btn.png') center no-repeat; background-size:contain;}
	}

	@media (max-width:789px) {
		#header {height:70px; padding:10px 2%;}
		#header:after {height:70px;}

		#header .headLogo {width:240px; height:40px; margin-top:5px;}
		#header .headLogo a {height:40px;}

		#header .menu {width:48px; height:48px; line-height:48px;}
		#header ul.util li.search_common {width:48px; height: 48px;}
		#header ul.util li.search_common a {line-height:48px;}

		#gnb_slide .gnb .all_menu {font-size:22px;}
		#gnb_slide .gnb > ul.gnb_top > li > a {font-size:14px; padding:10px 0;}
		#gnb_slide .gnb > ul.dep1 > li > a {font-size:16px; padding:15px 20px;}
		#gnb_slide .gnb > ul.dep1 > li > ul li a {padding:15px 20px; font-size:16px; line-height:16px;}
		#gnb_slide .gnb > ul.dep1 > li > a:after {width:18px; height:18px;}
	}

	@media (max-width:449px) {
		#header {padding:15px 2%;}

		#header .headLogo {width:210px; height:31px;}
		#header .headLogo a {height:31px;}

		#header .menu {width:38px; height:38px; line-height:38px;}
		#header ul.util li.search_common {width:38px; height:38px;}
		#header ul.util li.search_common a {line-height:38px;}

		#gnb_slide ._close {width:60px; height:60px; line-height:60px; background-size:25px;}
		#gnb_slide .gnb .all_menu {font-size:20px; padding:20px 15px;}
		#gnb_slide .gnb > ul.gnb_top > li > a {font-size:15px;}
		#gnb_slide .gnb > ul.dep1 > li > a {font-size:18px;}
	}

/* search */
#header .main_search_box{display:none; position:absolute; width:103.4%; left:-1.6%; top:95px; border-top:1px solid #ccc; background:#1155a8; padding:60px 0; z-index:101  }
#header .main_search_box .container{position:relative; width:1020px; margin:0 auto;}
.main_search_box .container .search_main{width:540px; margin:0 auto;}
.search_main span.write{display:block; border-bottom:5px solid #fff;}
.search_main span.write .search_int{display:inline-block; padding:10px 15px; font-size:20px; width:475px; background:#1155a8; border:1px solid #1155a8; color:#fff;}
.search_main span.write .search_int::placeholder{font-size:17px; color:#fff;}

button.sch_btn{display:inline-block; color:#fff; text-indent:-99999px; height:52px; width:60px; background:url("../images/common/search_icon.png") right center no-repeat;}
.container .search_close{position:absolute; right:0; top:10px; width:45px; height:45px; text-indent:-99999px; background:url("../images/common/icon_close.png") no-repeat;}

/********************************************************************************************************************************************/
/* banner */
.banner_wrap{width:100%; height:82px; padding-top:15px; padding-bottom:15px; box-sizing:border-box; border-top:1px solid #ddd;}
.banner_wrap .banner_zone {position:relative; max-width:1658px; margin:0 auto; padding-left:180px;}
.banner_wrap .area_control {position:absolute;left:0;top:0; overflow:hidden;width:160px;box-sizing:border-box;}
.banner_wrap .area_control .text {float:left;margin-right:11px;}
.banner_wrap .area_control .wrap_controls {float:left;height:54px;}
.banner_wrap .area_control .wrap_controls a {display:inline-block;height:54px; line-height:54px;float:left; cursor:pointer;}
.banner_wrap .area_control .wrap_controls a img{vertical-align:top;}
.banner_wrap .area_control .wrap_controls .play {display:none;}
.banner_wrap .area_control .view_more {display:inline-block;margin-top:4px;margin-left:3px;line-height:54px;}
.banner_wrap .owl-carousel.owl-loaded {}
.banner_wrap .owl-carousel .owl-item > div {display:block;}
.banner_wrap .owl-carousel .owl-item a {position:relative;}
.banner_wrap .owl-carousel .owl-item a:after {position:absolute; display:inline-block; top:14px; right:1px; width:1px; height:24px; background:#dedede; content:''; vertical-align:top; z-index:2;}
.banner_wrap .owl-carousel .owl-item a img{width:208px; height:54px; box-sizing:border-box; margin:0 auto;}
.banner_wrap .owl-carousel.owl-drag .owl-item ul li a{display:block; text-align:center;padding:0 10px;}

	@media (max-width:1658px) {
		.banner_wrap .banner_zone {max-width:100%;}
		.banner_wrap .area_control {left:1%;}
	}

	@media (max-width:999px) {
		.banner_wrap .banner_zone {max-width:100%;}
	}

/********************************************************************************************************************************************/
/* footer */
#footer {height:160px; background:#333333; position:relative;}
#footer .footerWrap {width:1658px;}
#footer .footerLogo {margin-top:52px; margin-right:120px; margin-bottom:10px; float:left;}
#footer .footerLogo a {display:block;}
#footer .infoMenu {padding-top:46px; display:block; overflow:hidden;}
#footer .infoMenu li {float:left; padding:0 15px; background:url('../images/common/bg_util_line.gif')no-repeat right center; font-size:14px;}
#footer .infoMenu li a {color:#fff;}
#footer .infoMenu li.privacy a {color:#ecc028;}
#footer .infoMenu li:last-child {background:none;}
#footer .address {padding-top:20px; font-size:13px; color:#888;}
#footer .quick_link {position:absolute; top:51px; right:0; box-sizing:border-box;}
#footer #link1 {top:30px;}
#footer #link2 {top:79px;}
#footer .quick_link .quick_site {display:inline-block; width:220px; height:50px; line-height:48px; font-size:14px; color:#999999; padding:0 11px; border:1px solid #6d6d6d; box-sizing:border-box; background:rgba(256,256,256,0.1);}
#footer .quick_link .quick_site span.arrow {float:right; display:inline-block; width:10px; height:50px; background:url("../images/common/bg_arr_pc.png") center no-repeat;}
#footer .quick_link .quick_site.on span.arrow {transform:rotate(180deg); -webkit-transform:rotate(180deg);}
#footer .quick_link .desc_box {position:absolute; overflow-y:auto; border:1px solid #6d6d6d; display:none; bottom:50px; left:0; width:100%; height:152px; max-width:220px; z-index:111;}
#footer .quick_link .desc_box::-webkit-scrollbar {width:5.2px;} /* 스크롤 바 */
#footer .quick_link .desc_box::-webkit-scrollbar-track {background-color:#fff;} /* 스크롤 바 밑의 배경 */
#footer .quick_link .desc_box::-webkit-scrollbar-thumb {background:#ddd; border-radius:10px;} /* 실질적 스크롤 바 */
#footer .quick_link .desc_box::-webkit-scrollbar-thumb:hover {background:#404040;} /* 실질적 스크롤 바 위에 마우스를 올려다 둘 때 */
#footer .quick_link .desc_box::-webkit-scrollbar-thumb:active {background:#808080;} /* 실질적 스크롤 바를 클릭할 때 */
#footer .quick_link .desc_box::-webkit-scrollbar-button {display:none;} /* 스크롤 바 상 하단 버튼 */
#footer .quick_link .desc_box ul li a {overflow:hidden; display:block; height:50px; padding:0 11px; white-space:nowrap; text-overflow:ellipsis; line-height:50px; background:#222; font-size:14px; border-top:1px solid #cfd6db; box-sizing:border-box; color:#707070;}
#footer .quick_link .desc_box ul li a:hover {background:#fff; color:#222;}
#footer .quick_link .desc_box ul li:first-child a {border-top:0;}

	@media (max-width:1658px) {
		#footer {padding:0 1%;}
		#footer .footerWrap {width:100%;}
	}

	@media (max-width:1279px) {
		#footer .footerLogo {display:none;}
	}

	@media (max-width:789px) {
		#footer {padding:0; height:auto;}
		#footer .quick_link {display:inline-block; position:relative; width:50%;}
		#footer #link1 {top:0px;}
		#footer #link2 {top:0px; margin-left:-4px;}
		#footer .quick_link .quick_site {width:100%;}
		#footer .quick_link .desc_box {max-width:100%;}
		#footer .infoMenu {padding:0; text-align:center; border-bottom:1px solid #6d6d6d;}
		#footer .infoMenu li {width:24%; font-size:12px; padding:0;}
		#footer .infoMenu li a {display:block; padding:18px 0;}
		#footer .infoMenu li.email {background:none;}
		#footer .infoMenu li.sitemap {display:none;}
		#footer .address {text-align:center; font-size:12px; padding:28px 2%;}
	}

/* 필수입력사항 표시 */
span.star{color:#f90040;}