@charset "utf-8";

/* 
File Name : layout.css
Description : mirnetwork_site
Author : kwj (master@dmax.kr)
Date : 2016-11-24
 */
#popup {/*width:90%; height:100%; */position:fixed; top:10%; left:10%; z-index:9999; display:flex;}
/* #popup .popup_wrap {width:400px; height:566px;} */
#popup .popup_wrap {width:400px; height:500px;}
#popup .popup_wrap img {width:100%;}
#popup .popup_wrap .bt_close {display:block; width:100%; height:auto; padding:10px; box-sizing:border-box; text-align:right; background:#222; color:#fff; font-size:13px;}

/* ÆË¾÷1°³ÀÏ¶§ */
/* @media screen and (min-width: 300px) and (max-width: 568px) {
	#popup {top:3%; left:3%;}
	#popup .popup_wrap {width:300px; height:auto;}
} */

/* ÆË¾÷2°³ÀÏ¶§ */
@media screen and (max-width: 768px) {
	#popup {top:3%; left:3%;}
	#popup .popup_wrap {width:300px; height:auto; position: absolute;}
	#popup .popup_wrap.pop1 {z-index:1;}
	#popup .popup_wrap.pop2 {z-index:0;}
}




#browser_msg{width:100%; height:100%;background:#fff; position:absolute; top:0; left:0; z-index:1; text-align:center;}
#browser_msg h1{color:#444; font-size:40px; padding:300px 0 0 0; font-family:sans-serif;}
#browser_msg p{color:#797979; font-size:18px; font-family:sans-serif; padding:20px 0 0 0; line-height:130%;}
#browser_msg ul{width:570px; height:auto; padding:30px 0 0 0; margin:0 auto;}
#browser_msg li{display:inline-block; padding:5px;}

#wrap{width:100%; /*min-width:1200px;*/ height:auto; position:relative;}

/* header */
header{width:100%; height:auto; position:fixed; top:0; left:0; z-index:1;}
header h1{position:absolute; top:23px; left:38px;}
header h1 a {background:url("../image/common/logo.png") 0 0 no-repeat; background-size:100%; width:80px; height:55px; display:block; font-size:0;}
header h1 a.white {background:url("../image/common/logo_w.png") 0 0 no-repeat; }
header nav {position:fixed; top:219px; right:50px; display:block;}
header nav li{width:125px; height:29px; margin:10% 0;}
header nav a{display:block; width:125px; height:29px;}
header nav a .lnb_name{display:none; background:url("../image/common/lnb_names_box.png") 0 0 no-repeat; width:90px; height:29px; line-height:29px; color:#fff; font-size:13px; text-indent:11px; letter-spacing:-0.07em;}
header nav a:hover .lnb_name, header nav a.on .lnb_name{display:block;}
header nav .m1{background:url("../image/common/ico_lnb1_off.png") right center no-repeat;}
header nav .m1:hover, header nav .m1.on{background:url("../image/common/ico_lnb1_on.png") right center no-repeat;}
header nav .m2{background:url("../image/common/ico_lnb2_off.png") right center no-repeat;}
header nav .m2:hover, header nav .m2.on{background:url("../image/common/ico_lnb2_on.png") right center no-repeat;}
header nav .m3{background:url("../image/common/ico_lnb3_off.png") right center no-repeat;}
header nav .m3:hover, header nav .m3.on{background:url("../image/common/ico_lnb3_on.png") right center no-repeat;}
header nav .m4{background:url("../image/common/ico_lnb4_off.png") right center no-repeat;}
header nav .m4:hover, header nav .m4.on{background:url("../image/common/ico_lnb4_on.png") right center no-repeat;}
header nav .m5{background:url("../image/common/ico_lnb5_off.png") right center no-repeat;}
header nav .m5:hover, header nav .m5.on{background:url("../image/common/ico_lnb5_on.png") right center no-repeat;}
header nav .m6{background:url("../image/common/ico_lnb6_off.png") right center no-repeat;}
header nav .m6:hover, header nav .m6.on{background:url("../image/common/ico_lnb6_on.png") right center no-repeat;}
header nav .m7{background:url("../image/common/ico_lnb7_off.png") right center no-repeat;}
header nav .m7:hover, header nav .m7.on{background:url("../image/common/ico_lnb7_on.png") right center no-repeat;}
header nav .m8{background:url("../image/common/ico_lnb8_off.png") right center no-repeat;}
header nav .m8:hover, header nav .m8.on{background:url("../image/common/ico_lnb8_on.png") right center no-repeat;}

@media screen and (max-width: 960px) {
	header nav{display:none;}
}
/*styling open close button*/
header .bt_menu{position:absolute; top:44px; right:46px; background:url("../image/common/bt_menu.png") 0 0 no-repeat; background-size:28px; width:28px; height:16px; font-size:0; z-index:9999;}
header .bt_menu.white { position:absolute; top:44px; right:46px; background:url("../image/common/bt_menu_w.png") 0 0 no-repeat; width:28px; height:16px; font-size:0; z-index:9999; }

header .btn-open{background:url("../image/common/bt_menu.png") 0 0 no-repeat;}
header .btn-close{background:url("../image/common/bt_close_b.png") 0 0 no-repeat; width:22px; height:22px; z-index: 999999;}
/*overlay*/
.fullmenu_overay {display:none; position:fixed; top:0; height:100%; width:100%; background:#fff; overflow:auto; z-index:9999;}
.fullmenu_overay .fullmenu_area {text-align:center; max-width:100%; margin:0 auto;}
.fullmenu_area ul {text-transform:capitalize; padding:200px 0px 100px;}
.fullmenu_area ul li {display:inline-block; vertical-align:top; width:20%; position:relative; padding-bottom:50px;}
.fullmenu_area ul li a {font-size:30px; color:#0060b0; display:block; padding:10px 0; text-decoration:none; transition-property:all .2s linear 0s; -moz-transition:all .2s linear 0s; -webkit-transition:all .2s linear 0s; -o-transition:all .2s linear 0s;}
.fullmenu_area ul li a:hover {color:#7bbd26;}
.fullmenu_area ul ul {padding:20px 0; height:200px; border-bottom:1px solid #f0f0f0;}
.fullmenu_area ul ul li {display:block; width:100%; padding:0;}
.fullmenu_area ul ul li a {color:#797979; font-size:17px;}
.fullmenu_area ul ul li a:hover {color:#7bbd26;}

/* footer */
footer{float:left; width:100%; height:auto; background:#121212; text-align:center; padding:30px 0;}
footer address{color:#757575; font-size:13px; font-weight:600; padding:27px 0 0 0;}
footer address span{display:inline-block; color:#757575; font-size:13px; font-weight:600; padding:0 10px;}
footer cite{display:block; color:#757575; font-size:10px; font-weight:600; letter-spacing:1px; padding:20px 0 0 0;}
footer cite a{color:#757575; font-size:10px; font-weight:600; letter-spacing:1px;}
footer .bt_adm{font-size:10px; font-weight:600; color:#797979;}

/* volunteer menu */
.vol_menu{width:100%; height:auto; padding:50px 0; overflow:hidden; border-bottom:1px solid #e5e5e5;}
.vol_menu ul{width:1000px; height:auto; margin:0 auto;}
.vol_menu ul li{float:left; width:25%; text-align:center;}
.vol_menu.education ul li{width:33.33%;}
.vol_menu ul li a{font-weight:600;}
.vol_menu ul li a:hover, .vol_menu ul li a.active, .vol_menu ul li a:hover span, .vol_menu ul li a.active span{color:#db5c5c;}
.vol_menu.education ul li a:hover, .vol_menu.education ul li a.active, .vol_menu.education ul li a:hover span, .vol_menu.education ul li a.active span{color:#f3ad36;}
.vol_menu_m{display:none;}

@media screen and (min-width: 737px) and (max-width: 1024px) {
	.vol_menu{padding:35px 0;}
	.vol_menu ul{width:70%;}
	.vol_menu ul li span{display:block; padding:3px 0 0 0;}
}
@media screen and (min-width: 737px) and (max-width: 970px) {
	.vol_menu{padding:35px 0;}
	.vol_menu ul li span{display:block; padding:3px 0 0 0;}
}

/* community menu */
.commu_menu{width:100%; height:auto; padding:50px 0; overflow:hidden;}
.commu_menu ul{width:1000px; height:auto; margin:0 auto;}
.commu_menu ul li{float:left; width:33%; text-align:center;}
.commu_menu ul li a{font-weight:600;}
.commu_menu ul li a:hover, .commu_menu ul li a.active{color:#6faf1d;}
.commu_menu_m{display:none;}

@media screen and (min-width: 961px) and (max-width: 1320px) {
	.commu_menu ul{width:70%;}
}

@media screen and (max-width: 960px) {
	.commu_menu ul{width:70%;}
}

/* community container */
#commu_wrap{width:100%; height:auto; border-top:1px solid #e5e5e5; background:#f6f6f6; overflow:hidden;}