@charset 'UTF-8';
.pc{display:block;}
.mobile{display:none;}
.orange{color:#fd5900;}

#wrap{width:100%; position:relative;}

#wrap #header{width:100%; position:relative; border-bottom:2px solid #000000;}
#wrap #header .m_header_wrap{display:none;}
#wrap #header .util h1{position:absolute; left:0; top:21px;}
#wrap #header h1 span{font-size:30px; font-weight:600; color:#575758; display:inline-block; margin-top:10px; margin-left:10px;}
#wrap #header .util{border-bottom:1px solid #f0f0f0; padding-bottom:16px;}
#wrap #header .util_wrap:after{content:''; display:block; clear:both;}
#wrap #header .util_wrap{max-width:1370px; margin:0 auto; position:relative;}
#wrap #header .util ul.util_con{float:right; margin-top:28px; padding-right:2px;}
#wrap #header .util ul.util_con > li{float:left;  height:40px; line-height:38px; margin-left:7px;}
#wrap #header .util ul.util_con li.mypage{background:url(/images/top_mypage.jpg) no-repeat;}
#wrap #header .util ul.util_con li.pmovie img{width:95%;padding-top:10px;width:130px;}
#wrap #header .util ul.util_con li.soc{width:45px;margin-left:0px;}
#wrap #header .util ul.util_con li.soc img{width:70%;padding-top:11px;margin-left:10px;}
#wrap #header .util ul li.language{background:url(/images/top_language.jpg) no-repeat; position:relative;}
#wrap #header .util ul li.language button{display:block; padding-left:60px; font-size:14px; font-weight:600; height:38px; width:100%; text-align:left;}
#wrap #header .util ul li.language ul{position:absolute; top:40px; right:0; width:138px; border:1px solid #000; box-sizing:border-box; background:#fff; z-index:20; padding:5px 0; display:none;}
#wrap #header .util ul li.language ul li{text-align:center; font-size:14px; heigth:30px; line-height:30px;}
#wrap #header .util ul li.language ul li a{display:block;  padding:0;}
#wrap #header .util ul li.language ul li a:hover{text-decoration:underline;}
#wrap #header .util ul li.organ_guide{background:url(/images/top_organ.jpg) no-repeat;}
#wrap #header .util ul li a{display:block; font-size:14px; font-weight:600;}
#wrap #header .gnb{margin-top:2px; position:relative;}
#wrap #header .gnb_wrap{max-width:1370px; margin:0 auto; position:relative;}
#wrap #header .gnb .menu:after{content:''; display:block; clear:both;}
#wrap #header .gnb .menu > li{float:left; line-height:66px; text-align:center; width:13.5%; background:url(/images/gnb_line.jpg) left center no-repeat; position:relative;}
#wrap #header .gnb .menu > li:first-child{background:none;}
#wrap #header .gnb .menu > li.long{width:15%;}
#wrap #header .gnb .menu > li > a{display:block; font-size:20px;}
#wrap #header .gnb .menu > li:hover > a{color:#2b6ead;}
#wrap #header .gnb .menu > li:hover > ul{background:#f5f5f5;}
#wrap #header .gnb .menu > li > ul{position:absolute; width:100%; left:0; top:68px; padding-top:6px; height:0px; box-sizing:border-box; display:none; z-index:100;}
#wrap #header .gnb .menu > li > ul > li{line-height:16px; margin-top:25px;}
#wrap #header .gnb .menu > li > ul > li > a{font-size:16px; color:#666; display:block; font-weight:400; line-height:20px;}
#wrap #header .gnb .menu > li > ul > li > a:hover{color:#000;}
#wrap #header .gnb_wrap button{position:absolute; right:3px; top:24px; font-size:0;}
#wrap #header #menu_bg{width:100%; background:#fff; position:absolute; top:68px; height:0px; z-index:99; display:none;}

#wrap #footer{width:100%; background:#585e6a; padding-bottom:25px;}
#wrap #footer .footer_wrap{max-width:1370px; margin:0 auto;}
#wrap #footer .footer_wrap .family_site{position:relative; padding-top:10px; height:60px; line-height:60px;}
#wrap #footer .footer_wrap .family_site:after{content:''; display:block; clear:both;}
#wrap #footer .footer_wrap .family_site > div{display:block; float:left; max-width:262px; width:20%; position:relative;}
#wrap #footer .footer_wrap .family_site .f_left{margin-right:35px;}
#wrap #footer .footer_wrap .family_site input{box-sizing:border-box; width:100%; max-width:262px; height:60px; line-height:60px; border:0; background:url(/images/family_bg.jpg) right center no-repeat; color:#fff; font-size:14px; text-align:left; padding:0; cursor:pointer;}
#wrap #footer .footer_wrap .family_site ul{display:none; position:absolute; background:#fff; border:1px solid #000; bottom:60px; z-index:999; width:100%;}
#wrap #footer .footer_wrap .family_site ul li{text-align:center; height:40px; line-height:40px;}
#wrap #footer .footer_wrap .family_site ul li a{font-size:14px; color:#000; display:block; border-top:1px solid #000;}
#wrap #footer .footer_wrap .family_site ul li:first-child a{border-top:0;}
#wrap #footer .footer_wrap .footer_con{border-top:1px solid #3d4451;}
#wrap #footer .footer_wrap .footer_con ul{margin:15px 0;}
#wrap #footer .footer_wrap .footer_con ul li{display:inline-block; padding-left:35px; margin:3px 0;}
#wrap #footer .footer_wrap .footer_con ul li.facebook img{margin-right:5px; margin-left:5px;}
#wrap #footer .footer_wrap .footer_con ul li:first-child{padding-left:0;}
#wrap #footer .footer_wrap .footer_con ul li a{color:#fff; font-size:14px;}
#wrap #footer .footer_wrap .footer_con ul li a:hover{text-decoration:underline;}
#wrap #footer .footer_wrap .footer_con p{font-size:13px; color:#fff; line-height:22px;}

@media screen and (max-width:1000px){
	#wrap .blank{background:#606060; width:100%; position:absolute; left:0; top:0; opacity:0.6; z-index:9998;}
	#wrap #header{padding:20px 0;}
	#wrap #header .util{display:none;}
	#wrap #header #gnb{display:none;}
	#wrap #header .m_header_wrap{display:block;}
	#wrap #header .m_header_wrap .mobile_menu{position:absolute; right:20px; top:29px;}
	#wrap #header .m_header_wrap .m_menu_wrap{max-width:420px; position:absolute; top:0; right:0; width:100%; z-index:9999;}
	#wrap #header .m_header_wrap .m_menu_wrap .m_menu_top{ background:#697283; position:relative;}
	#wrap #header .m_header_wrap .m_menu_wrap .m_menu_top #close{position:absolute; right:0; top:0;}
	#wrap #header .m_header_wrap .m_menu_wrap .m_menu_top ul.top{padding:11px 0; padding-left:5px;}
	#wrap #header .m_header_wrap .m_menu_wrap .m_menu_top ul:after{content:''; display:block; clear:both;}
	#wrap #header .m_header_wrap .m_menu_wrap .m_menu_top ul.top > li{float:left; width:26%; box-sizing:border-box; margin-left:5px; position:relative;}
	#wrap #header .m_header_wrap .m_menu_wrap .m_menu_top ul.top > li > a{color:#fff; display:block; padding:10px 0; border:1px solid #9fa5b0; border-radius:5px; font-size:14px;}
	#wrap #header .m_header_wrap .m_menu_wrap .m_menu_top ul.top li.mypage a{background:url(/images/m_mypage.jpg) left center no-repeat; padding-left:33px;}
	#wrap #header .m_header_wrap .m_menu_wrap .m_menu_top ul.top li.language > a{background:url(/images/m_language.jpg) 2px center no-repeat; padding-left:33px;}
	#wrap #header .m_header_wrap .m_menu_wrap .m_menu_top ul.top li.language ul{position:absolute; top:40px; right:0; border:1px solid #9fa5b0; box-sizing:border-box; background:#697283; z-index:10000; width:100%; box-sizing:border-box; padding:5px 0; display:none;}
	#wrap #header .m_header_wrap .m_menu_wrap .m_menu_top ul.top li.language ul li{text-align:center;}
	#wrap #header .m_header_wrap .m_menu_wrap .m_menu_top ul.top li.language ul li a{color:#fff; line-height:25px; display:block;}
	#wrap #header .m_header_wrap .m_menu_wrap .m_menu_top ul.top li.organ a{background:url(/images/m_organ.jpg) 7px center no-repeat; padding-left:40px;}
	#wrap #header .m_header_wrap .m_menu_wrap .m_menu{position:relative;}
	#wrap #header .m_header_wrap .m_menu_wrap .m_menu .m_gnb{background:#2b6fad; width:43%;}
	#wrap #header .m_header_wrap .m_menu_wrap .m_menu .m_gnb li{width:100%; font-size:20px;}
	#wrap #header .m_header_wrap .m_menu_wrap .m_menu .m_gnb li a{display:block; padding:20px 0 20px 22px; color:#fff; border-bottom:1px solid #5f8bb3;}
	#wrap #header .m_header_wrap .m_menu_wrap .m_menu .m_gnb li a.on{background:#fff; border:0; color:#000;}
	#wrap #header .m_header_wrap .m_menu_wrap .m_menu .gnb_con{background:#fff; width:57%; position:absolute; right:0; top:0;}
	#wrap #header .m_header_wrap .m_menu_wrap .m_menu .gnb_con .title{text-align:center; font-size:20px; color:#2b6fad; font-weight:800; margin:0 15px; padding:20px 0; border-bottom:1px solid #335b85;}
	#wrap #header .m_header_wrap .m_menu_wrap .m_menu .gnb_con ul{}
	#wrap #header .m_header_wrap .m_menu_wrap .m_menu .gnb_con ul li{margin:0 15px; border-bottom:1px solid #666;}
	#wrap #header .m_header_wrap .m_menu_wrap .m_menu .gnb_con ul li:first-child{border-top:1px solid #b0c8dd;}
	#wrap #header .m_header_wrap .m_menu_wrap .m_menu .gnb_con ul li a{padding:16px 0; color:#666; font-size:18px; display:block; line-height:22px;}

	#wrap #footer .footer_wrap .family_site{padding-left:20px; padding-right:20px;}
	#wrap #footer .footer_wrap .footer_con{padding-right:20px; padding-left:20px;}
	#wrap #footer .footer_wrap .family_site > div{width:40%;}
}

@media screen and (max-width:550px){
	
	}

@media screen and (max-width:640px){
		#wrap #footer .footer_wrap .family_site{padding:0; height:auto;}
		#wrap #footer .footer_wrap .family_site .f_left{margin:0;}
		#wrap #footer .footer_wrap .family_site > div{float:none; width:100%; max-width:640px; border-bottom:1px solid #3d4451;}
		#wrap #footer .footer_wrap .family_site input{max-width:640px; padding:0 30px; background:url(/images/family_bg.jpg) 92% center no-repeat}
		#wrap #footer .footer_wrap .footer_con{border:0;}
		
		.pc{display:none;}
		.mobile{display:block;}
	}
	
	@media screen and (max-width:440px){
		#wrap #header .m_header_wrap h1 img{width:160px;}
		#wrap #header .m_header_wrap  h1 span{font-size:24px; margin-top:10px; margin-left:2px;}
		#wrap #header .m_header_wrap .mobile_menu img{width:30px;}
		
		#wrap #footer .footer_wrap .footer_con{padding-left:10px;padding-right:10px;}
		#wrap #footer .footer_wrap .footer_con ul li{padding-left:7px;}
	}
	
	@media screen and (max-width:375px){
		#wrap #header .m_header_wrap .m_menu_wrap .m_menu_top ul.top > li{width:25%;}
		#wrap #header .m_header_wrap .m_menu_wrap .m_menu_top ul.top li > a{font-size:13px; letter-spacing:-0.5px;}
		#wrap #header .m_header_wrap .m_menu_wrap .m_menu_top ul.top li.mypage a{background-size:20px auto; padding-left:25px;}
		#wrap #header .m_header_wrap .m_menu_wrap .m_menu_top ul.top li.language > a{background-size:20px auto; padding-left:25px;}
		#wrap #header .m_header_wrap .m_menu_wrap .m_menu_top ul.top li.language ul li a{font-size:13px; letter-spacing:-0.5px;}
		#wrap #header .m_header_wrap .m_menu_wrap .m_menu_top ul.top li.organ a{background-size:20px auto; padding-left:32px;}
	}
	
		@media screen and (max-width:340px){
				#wrap #footer .footer_wrap .footer_con p{letter-spacing:-0.5px;}
				#wrap #footer .footer_wrap .footer_con ul li{padding-left:3px;}
	}