@charset "utf-8";
@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);

body { }

/* LAYOUT */
#wrap { min-width: 1280px; height: 100%; }
#header { min-width: 1280px; height: 80px; background-color: #ffffff; }
#container { overflow: hidden; min-width: 1280px; background: url(../images/inc/bg.png) repeat left top; }
#footer { overflow: hidden; position: relative; min-width: 1280px; background-color: #ffffff; border-top: 1px solid #e4e4e4; }

/* HEADER */
#header > .outer { position: relative; width: 1200px; margin: 0 auto; }

#header > .outer h1 { margin:0; padding: 0; line-height: 0; }

#header > .outer .gnb { position: absolute; height: 50px; right: 202px; top: 30px; }
#header > .outer .gnb ul { margin: 0; padding: 0; }
#header > .outer .gnb li { position: relative; list-style: none; float: left; margin-left: 50px; }
#header > .outer .gnb a,
#header > .outer .gnb a:hover { font-family: 'Noto Sans KR', sans-serif; font-size: 16px; line-height: 18px; font-weight: 800; letter-spacing: -1px; color: #5b5b5b; display: block; }
#header > .outer .gnb a:hover { font-family: 'Noto Sans KR', sans-serif; font-size: 16px; line-height: 18px; font-weight: 800; letter-spacing: -1px; color: red; display: block; }
#header > .outer .gnb:after { content:""; display:block; clear:both; /* height:0; visibility:hidden; */}

#header > .outer .gnb .sub_menu { position: absolute; width: 156px; left: 0; top: 50px; margin-left: -48px; background-color: #ffffff; z-index: 1; display: none; }
#header > .outer .gnb .sub_menu.v1 { margin-left: -34px; }
#header > .outer .gnb .sub_menu ul { margin: 0; padding: 20px 0; border-left: 1px solid #5b5b5b;border-right: 1px solid #5b5b5b;border-bottom: 1px solid #5b5b5b;}
#header > .outer .gnb .sub_menu li { list-style: none; float: none; margin: 0;}
#header > .outer .gnb .sub_menu a,
#header > .outer .gnb .sub_menu a:hover { display: block; font-family: 'notokr-demilight', sans-serif; font-size: 13.5px; line-height: 30px; font-weight: 700; color: #5b5b5b; letter-spacing: -1px; text-align: center; }
#header > .outer .gnb .sub_menu a:hover { display: block; font-family: 'notokr-demilight', sans-serif; font-size: 13.5px; line-height: 30px; font-weight: 700; color: red; letter-spacing: -1px; text-align: center; }



#header > .outer .lnb { position: absolute; right: 0; top: 26px; }
#header > .outer .lnb ul { margin: 0; padding: 0; }
#header > .outer .lnb li { list-style: none; float: left; margin-left: 4px; -webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px; }
#header > .outer .lnb li a,
#header > .outer .lnb li a:hover { display: block; padding: 0 20px; font-family: dotum; font-size: 12px; line-height: 28px; color: #ffffff; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; }
#header > .outer .lnb li.v1 { background: #767676; /* Old browsers */
background: -moz-linear-gradient(top,  #767676 0%, #656565 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#767676), color-stop(100%,#656565)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #767676 0%,#656565 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #767676 0%,#656565 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #767676 0%,#656565 100%); /* IE10+ */
background: linear-gradient(to bottom,  #767676 0%,#656565 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#767676', endColorstr='#656565',GradientType=0 ); /* IE6-9 */ 
}
#header > .outer .lnb li.v2 { background: #929292; /* Old browsers */
background: -moz-linear-gradient(top,  #929292 0%, #878787 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#929292), color-stop(100%,#878787)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #929292 0%,#878787 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #929292 0%,#878787 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #929292 0%,#878787 100%); /* IE10+ */
background: linear-gradient(to bottom,  #929292 0%,#878787 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#929292', endColorstr='#878787',GradientType=0 ); /* IE6-9 */ 
}
#header > .outer .lnb:after { content:""; display:block; clear:both; /* height:0; visibility:hidden; */}


/* CONTAINER */
#container > .outer { width: 1512px; margin: 100px auto; font-size: 0; }

#container > .outer .best { display: inline-block; vertical-align: top; position: relative; width: 50%; height: 540px; background: url(../images/main/best_thum.jpg) repeat center top; cursor: pointer;}
#container > .outer .best .pop_box { position: absolute; width: 250px; height: 150px; left: -50px; top: 20px; background-color: #fff; box-shadow: 5px 5px 5px rgba(4,0,0,0.33); }
#container > .outer .best .pop_box h2 { margin: 26px 0 0 28px; padding: 0; font-family: 'notokr-medium'; font-weight: normal; font-size: 25px; color: #cf092a; letter-spacing: -0.5px; }
#container > .outer .best .pop_box p { margin: 9px 0 0 28px; padding: 0;font-family: 'Noto Sans KR', sans-serif; font-size: 14.5px; line-height: 24px; font-weight: 400; letter-spacing: -1px; color: #4e4e4e; }

#container > .outer .best .side_kakao1:hover .thum_ov { -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; filter:alpha(opacity=100);  -moz-opacity:1.0; -khtml-opacity:1.0; opacity:1.0; }
#container > .outer .best .side_kakao1:hover .pop_box { background-color: #ffff00; }
#container > .outer .best .side_kakao1:hover .pop_box h2 { color: #000000; }
#container > .outer .best .side_kakao1:hover .pop_box p { color: #000000; }

#container > .outer .side { display: inline-block; vertical-align: top; width: 50%; cursor: pointer; }
#container > .outer .side .side_kakao { display: inline-block; vertical-align: top; position: relative; width: 50%; height: 270px; background: url(../images/main/kakao_thum.jpg) repeat center top; }
#container > .outer .side .side_kakao .thum_ov { opacity:0; -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition: all 0.3s ease; transition:all 0.3s ease; position: absolute; width: 100%; height: 100%; left: 0; top: 0; background: url(../images/main/kakao_thum_ov.jpg) repeat center top; }
#container > .outer .side .side_kakao .pop_box { -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition: all 0.3s ease; transition:all 0.3s ease; position: absolute; width: 250px; height: 110px; left: -50px; top: 20px; background-color: #fff; box-shadow: 5px 5px 5px rgba(4,0,0,0.33); }
#container > .outer .side .side_kakao .pop_box h2 { -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition: all 0.3s ease; transition:all 0.3s ease; margin: 20px 0 0 28px; padding: 0; font-family: 'notokr-medium'; font-weight: normal; font-size: 25px; color: #cf092a; letter-spacing: -0.5px; }
#container > .outer .side .side_kakao .pop_box p { -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition: all 0.3s ease; transition:all 0.3s ease; margin: 5px 0 0 28px; padding: 0;font-family: 'Noto Sans KR', sans-serif; font-size: 14.5px; line-height: 24px; font-weight: 400; letter-spacing: -1px; color: #4e4e4e; }
#container > .outer .side .side_kakao .pop_box .qrcode { position: absolute; right: 20px; top: 14px; line-height: 0; }

#container > .outer .side .side_kakao:hover .thum_ov { -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; filter:alpha(opacity=100);  -moz-opacity:1.0; -khtml-opacity:1.0; opacity:1.0; }
#container > .outer .side .side_kakao:hover .pop_box { background-color: #ffff00; }
#container > .outer .side .side_kakao:hover .pop_box h2 { color: #000000; }
#container > .outer .side .side_kakao:hover .pop_box p { color: #000000; }


#container > .outer .side .side_remote { display: inline-block; vertical-align: top; position: relative; width: 50%; height: 270px; background: url(../images/main/remote_thum.jpg) repeat center top; }
#container > .outer .side .side_remote .thum_ov { opacity:0; -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition: all 0.3s ease; transition:all 0.3s ease; position: absolute; width: 100%; height: 100%; left: 0; top: 0; background: url(../images/main/remote_thum_ov.jpg) repeat center top; }
#container > .outer .side .side_remote .pop_box { -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition: all 0.3s ease; transition:all 0.3s ease; position: absolute; width: 250px; height: 110px; right: -50px; top: 20px; background-color: #fff; box-shadow: 5px 5px 5px rgba(4,0,0,0.33); }
#container > .outer .side .side_remote .pop_box h2 { -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition: all 0.3s ease; transition:all 0.3s ease; margin: 20px 28px 0 0; padding: 0; font-family: 'notokr-medium'; font-weight: normal; font-size: 25px; color: #cf092a; letter-spacing: -1px; text-align: right; }
#container > .outer .side .side_remote .pop_box p { -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition: all 0.3s ease; transition:all 0.3s ease; margin: 5px 28px 0 0; padding: 0;font-family: 'Noto Sans KR', sans-serif; font-size: 14.5px; line-height: 24px; font-weight: 400; letter-spacing: -1px; color: #4e4e4e; text-align: right; }
#container > .outer .side .side_remote .pop_box .qrcode { position: absolute; right: 20px; top: 14px; line-height: 0; }

#container > .outer .side .side_remote:hover .thum_ov { -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; filter:alpha(opacity=100);  -moz-opacity:1.0; -khtml-opacity:1.0; opacity:1.0; }
#container > .outer .side .side_remote:hover .pop_box { background-color: #cf092a; }
#container > .outer .side .side_remote:hover .pop_box h2 { color: #fff; }
#container > .outer .side .side_remote:hover .pop_box p { color: #fff; }


#container > .outer .side .side_customer { display: inline-block; vertical-align: top; position: relative; width: 50%; height: 270px; background: url(../images/main/customer_thum.jpg) repeat center top; }
#container > .outer .side .side_customer .thum_ov { opacity:0; -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition: all 0.3s ease; transition:all 0.3s ease; position: absolute; width: 100%; height: 100%; left: 0; top: 0; background: url(../images/main/customer_thum_ov.jpg) repeat center top; }
#container > .outer .side .side_customer .pop_box { -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition: all 0.3s ease; transition:all 0.3s ease; position: absolute; width: 250px; height: 110px; left: -50px; bottom: 20px; background-color: #fff; box-shadow: 5px 5px 5px rgba(4,0,0,0.33); }
#container > .outer .side .side_customer .pop_box h2 { -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition: all 0.3s ease; transition:all 0.3s ease; margin: 20px 0 0 28px; padding: 0; font-family: 'notokr-medium'; font-weight: normal; font-size: 25px; color: #cf092a; letter-spacing: -1px; }
#container > .outer .side .side_customer .pop_box p { -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition: all 0.3s ease; transition:all 0.3s ease; margin: 5px 0 0 28px; padding: 0;font-family: 'Noto Sans KR', sans-serif; font-size: 14.5px; line-height: 24px; font-weight: 400; letter-spacing: -1px; color: #4e4e4e; }

#container > .outer .side .side_customer:hover .thum_ov { -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; filter:alpha(opacity=100);  -moz-opacity:1.0; -khtml-opacity:1.0; opacity:1.0; }
#container > .outer .side .side_customer:hover .pop_box { background-color: #cf092a; }
#container > .outer .side .side_customer:hover .pop_box h2 { color: #fff; }
#container > .outer .side .side_customer:hover .pop_box p { color: #fff; }


#container > .outer .side .side_account { display: inline-block; vertical-align: top; position: relative; width: 50%; height: 270px; background: url(../images/main/account_thum.jpg) repeat center top; }
#container > .outer .side .side_account .thum_ov { opacity:0; -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition: all 0.3s ease; transition:all 0.3s ease; position: absolute; width: 100%; height: 100%; left: 0; top: 0; background: url(../images/main/account_thum_ov.jpg) repeat center top; }
#container > .outer .side .side_account .pop_box { -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition: all 0.3s ease; transition:all 0.3s ease; position: absolute; width: 250px; height: 110px; right: -50px; bottom: 20px; background-color: #fff; box-shadow: 5px 5px 5px rgba(4,0,0,0.33); }
#container > .outer .side .side_account .pop_box h2 { -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition: all 0.3s ease; transition:all 0.3s ease; margin: 20px 28px 0 0; padding: 0; font-family: 'notokr-medium'; font-weight: normal; font-size: 25px; color: #cf092a; letter-spacing: -1px; text-align: right; }
#container > .outer .side .side_account .pop_box p { -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition: all 0.3s ease; transition:all 0.3s ease; margin: 5px 28px 0 0; padding: 0; font-family: 'Noto Sans KR', sans-serif; font-size: 14.5px; line-height: 24px; font-weight: 400; letter-spacing: -1px; color: #4e4e4e; text-align: right; }
#container > .outer .side .side_account .pop_box .qrcode { position: absolute; right: 20px; top: 14px; line-height: 0; }

#container > .outer .side .side_account:hover .thum_ov { -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; filter:alpha(opacity=100);  -moz-opacity:1.0; -khtml-opacity:1.0; opacity:1.0; }
#container > .outer .side .side_account:hover .pop_box { background-color: #cf092a; }
#container > .outer .side .side_account:hover .pop_box h2 { color: #fff; }
#container > .outer .side .side_account:hover .pop_box p { color: #fff; }


#popup_bg { position:fixed; width:100%; height:100vh; left:0; top:0; background-color:rgba(0,0,0,0.6); z-index:999999; display:none; }
#popup { position:fixed; width:100%; height:100vh; left:0; top:0; -webkit-overflow-scrolling:touch; z-index:999999; display:table; display:none; }
#popup .outer { display:table-cell; vertical-align:middle; }
/* 위 아래 꽉 차게 하고 싶을 경우 height를 100%로 변경 */
#popup .outer .inner { position:relative; width:400px; height:180px; margin:0 auto; background-color:#fff; -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px; }
#popup .outer .inner .inner_box { overflow-y:auto; position:relative; height:180px; padding:15px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; -moz-box-shadow:0 0 20px #555; -webkit-box-show:0 0 20px #555; box-shadow:0 0 20px #555; }
#popup .outer .inner .inner_box .bank { margin: 0 auto; padding-top: 20px; text-align: center; line-height: 0; }
#popup .outer .inner .inner_box .bank_info { margin: 20px 0 0 auto; font-family: 'Noto Sans KR', sans-serif; font-size: 14.5px; line-height: 24px; font-weight: 400; letter-spacing: -0.5px; color: #4e4e4e; text-align: center; }
#popup .outer .inner .btn_close { position:absolute; right:-40px; top:4px; cursor:pointer; }

#popup_bg1 { position:fixed; width:100%; height:100vh; left:0; top:0; background-color:rgba(0,0,0,0.6); z-index:999999; display:none; }
#popup1 { position:fixed; width:100%; height:100vh; left:0; top:0; -webkit-overflow-scrolling:touch; z-index:999999; display:table; display:none; }
#popup1 .outer { display:table-cell; vertical-align:middle; }
/* 위 아래 꽉 차게 하고 싶을 경우 height를 100%로 변경 */
#popup1 .outer .inner { position:relative; width:400px; height:200px; margin:0 auto; background-color:#fff; -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px; }
#popup1 .outer .inner .inner_box { overflow-y:auto; position:relative; height:200px; padding:15px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; -moz-box-shadow:0 0 20px #555; -webkit-box-show:0 0 20px #555; box-shadow:0 0 20px #555; }
#popup1 .outer .inner .inner_box .bank { margin: 0 auto; padding-top: 20px; text-align: center; line-height: 0; }
#popup1 .outer .inner .inner_box .bank_info { margin: 20px 0 0 auto; font-family: 'Noto Sans KR', sans-serif; font-size: 14.5px; line-height: 24px; font-weight: 400; letter-spacing: -0.5px; color: #4e4e4e; text-align: center; }
#popup1 .outer .inner .btn_close { position:absolute; right:-40px; top:4px; cursor:pointer; }

#popup_bg3 { position:fixed; width:100%; height:100vh; left:0; top:0; background-color:rgba(0,0,0,0.6); z-index:999999; display:none; }
#popup3 { position:fixed; width:100%; height:100vh; left:0; top:0; -webkit-overflow-scrolling:touch; z-index:999999; display:table; display:none; }
#popup3 .outer { display:table-cell; vertical-align:middle; }
/* 위 아래 꽉 차게 하고 싶을 경우 height를 100%로 변경 */
#popup3 .outer .inner { position:relative; width:800px; height:710px; margin:0 auto; background-color:#fff; -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px; }
#popup3 .outer .inner .inner_box { overflow-y:auto; position:relative; height:710px; padding:5px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; -moz-box-shadow:0 0 20px #555; -webkit-box-show:0 0 20px #555; box-shadow:0 0 20px #555; }
#popup3 .outer .inner .inner_box .bank { margin: 0 auto; padding-top: 20px; text-align: center; line-height: 0; }
#popup3 .outer .inner .inner_box .bank_info { margin: 20px 0 0 auto; font-family: 'Noto Sans KR', sans-serif; font-size: 14.5px; line-height: 24px; font-weight: 400; letter-spacing: -0.5px; color: #4e4e4e; text-align: center; }
#popup3 .outer .inner .btn_close { position:absolute; right:-40px; top:4px; cursor:pointer; }

@media screen and (max-width:640px) {
	#popup .outer .inner { width:auto; height:88vh; margin:30px; }
	#popup .outer .inner .inner_box { height:88vh; }
	#popup .outer .inner .btn_close { width:100%; height:40px; left:0; right:0; top:88vh; margin-top:-50px; background-color:#999; text-align:center; cursor:pointer; }
	#popup .outer .inner .btn_close img { width:16px; margin-top:10px; }
}

@media screen and (max-width:1680px) {
	/* CONTAINER */
	#container > .outer { width: auto; margin: 100px 60px; }
}


#sub_container { overflow: hidden; position: relative; height: 100%; background-color: #f6f7fb; }
#side { width: 200px; height: 100%; min-height: 940px; left: 0; top: 0; }
#side .side_logo { line-height: 0; text-align: center; }

#side .side_gnb { }
#side .side_gnb ul { margin: 0; padding: 0; }
#side .side_gnb li { list-style: none; padding: 20px 30px; font-family: 'notokr-regular'; font-weight: normal; font-size: 15px; line-height: 15px; letter-spacing: 0; color: #e4e4e4; border-top: 1px solid #334578; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; }
#side .side_gnb:after { content:""; display:block; clear:both; /* height:0; visibility:hidden; */}

#side .side_sub { margin: 10px 0 0; }
#side .side_sub ul { margin: 0; padding: 0; }
#side .side_sub li { position: relative; list-style: none; padding: 0 20px; font-family: 'Noto Sans KR', sans-serif; font-size: 12.5px; line-height: 24px; font-weight: 400; letter-spacing: -1px; color: #93a3d4; border: none; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; }
#side .side_sub li:after { content: ""; position: absolute; width: 3px; height: 5px; left: 12px; top: 10px; background: url(../images/inc/side_dot.png) repeat left top; }
#side .side_sub li a,
#side .side_sub li a:hover { display: block; font-family: 'Noto Sans KR', sans-serif; font-size: 12.5px; line-height: 24px; font-weight: 400; letter-spacing: -1px; color: #93a3d4;}
#side .side_sub li a:hover { display: block; font-family: 'Noto Sans KR', sans-serif; font-size: 12.5px; line-height: 24px; font-weight: 400; letter-spacing: -1px; color: yellow;}
#side .side_sub:after { content:""; display:block; clear:both; /* height:0; visibility:hidden; */}

#sub_head { overflow: hidden; position: relative; height: 80px; background-color: #fff; -webkit-box-show:0 1px 8px rgba(4,0,0,0.10); -moz-box-shadow:0 1px 8px rgba(4,0,0,0.10); box-shadow:0 1px 8px rgba(4,0,0,0.10); }
#sub_head .search { position: relative; width: 400px; height: 38px; margin: 21px 0 0 40px; -webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px; background-color: #f3f5fa; }
#sub_head .search .input { width: 340px; height: 38px; background-color: transparent; border: none; padding-left: 20px; font-family: dotum; font-size: 12px; line-height: 38px; color: #6c6c6c; outline: none; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; }
#sub_head .search .btn_insert { position: absolute; right: 0; top: 0; line-height: 0; }

#sub_head .logout { position: absolute; width: 85px; height: 28px; right: 120px; top: 26px; -webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px;
background: #929292; /* Old browsers */
background: -moz-linear-gradient(top,  #929292 0%, #878787 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#929292), color-stop(100%,#878787)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #929292 0%,#878787 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #929292 0%,#878787 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #929292 0%,#878787 100%); /* IE10+ */
background: linear-gradient(to bottom,  #929292 0%,#878787 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#929292', endColorstr='#878787',GradientType=0 ); /* IE6-9 */ 
}
#sub_head .logout a,
#sub_head .logout a:hover { display: block; font-family: dotum; font-size: 12px; line-height: 28px; color: #ffffff; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; text-align: center; }

#sub_head .join { position: absolute; width: 85px; height: 28px; right: 30px; top: 26px; -webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px;
background: #929292; /* Old browsers */
background: -moz-linear-gradient(top,  #929292 0%, #878787 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#929292), color-stop(100%,#878787)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #929292 0%,#878787 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #929292 0%,#878787 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #929292 0%,#878787 100%); /* IE10+ */
background: linear-gradient(to bottom,  #929292 0%,#878787 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#929292', endColorstr='#878787',GradientType=0 ); /* IE6-9 */ 
}
#sub_head .join a,
#sub_head .join a:hover { display: block; font-family: dotum; font-size: 12px; line-height: 28px; color: #ffffff; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; text-align: center; }

#sub_head .msg { position: absolute; right: 220px; top: 34px; font-family: dotum; font-size: 12px; line-height: 16px; color: #414141; text-align: right; }
#sub_head .msg1 { position: absolute; left: 30px; top: 34px; font-family: dotum; font-size: 16px; line-height: 16px; color: #414141; text-align: left; }
#sub_head .msg strong { color: #112256; }
#sub_head .msg1 strong { color: #112256; }

#content { position: relative; margin: 30px; padding: 20px; background-color: #fff; -webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px; -webkit-box-show:0 0 12px rgba(4,0,0,0.08); -moz-box-shadow:0 0 12px rgba(4,0,0,0.08); box-shadow:0 0 12px rgba(4,0,0,0.08); -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; }

#sub_container .select03 { vertical-align: middle; width: 106px; height: 28px; border: 1px solid #c6c6c6;  -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; font-family: 'gulim', 굴림; color: #444444; font-size: 12px; line-height: 20px; font-weight: normal; letter-spacing: 0; }
#sub_container .input03 { vertical-align: middle; width: 166px; height: 28px; border: 1px solid #c6c6c6;  -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; font-family: 'gulim', 굴림; color: #444444; font-size: 12px; line-height: 26px; font-weight: normal; letter-spacing: 0; }

#sub_container .list {}
#sub_container .list th { padding: 15px 0; border: 1px solid #dddddd; border-bottom: 1px solid #dddddd; background-color: #4179A6; font-family: 'gulim', 굴림; color: white; font-size: 12px; line-height: 18px; font-weight: bold; letter-spacing: 0; text-align: center; }
#sub_container .list td { padding: 7px 0; border: 1px solid #dddddd; font-family: 'gulim', 굴림; color: #444444; font-size: 12px; line-height: 18px; font-weight: normal; letter-spacing: 0; text-align: center; }
#sub_container .list td.left { text-align: left;padding-left:7px; }
#sub_container .list td.right { text-align: right;padding-right:7px; }
#sub_container .list tr.q { background-color: #ecf5f5; }
#sub_container .list .btn_confirm { width: 52px; height: 30px; margin: 0 auto; border: 1px solid #dcdcdc; background-color: #fff; -webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -moz-box-shadow:0 2px 0 #e5e5e5; -webkit-box-show:0 2px 0 #e5e5e5; box-shadow:0 2px 0 #e5e5e5; text-align: center; }
#sub_container .list .btn_confirm a,
#sub_container .list .btn_confirm a:hover { display: block; font-family: 'gulim', 굴림; color: #444444; font-size: 12px; line-height: 28px; font-weight: normal; letter-spacing: 0; }
#sub_container .list .btn_option { display: inline-block; width: 40px; height: 22px; margin: 0 0 0 4px; border: 1px solid #a0a0a0; background-color: #e3e3e3;  -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; text-align: center; }
#sub_container .list .btn_option a,
#sub_container .list .btn_option a:hover { display: block; font-family: 'gulim', 굴림; color: #444444; font-size: 12px; line-height: 20px; font-weight: normal; letter-spacing: 0; }

#sub_container .list3 {}
#sub_container .list3 th { padding: 9px 0; background-color: #4179A6; font-family: 'gulim', 굴림; color: white; font-size: 12px; line-height: 18px; font-weight: bold; letter-spacing: 0; text-align: center; }
#sub_container .list3 td { padding: 6px 0; font-family: 'gulim', 굴림; color: #444444; font-size: 12px; line-height: 18px; font-weight: normal; letter-spacing: 0; text-align: center; }
#sub_container .list3 td.left { text-align: left;padding-left:7px; }
#sub_container .list3 td.right { text-align: right;padding-right:7px; }
#sub_container .list3 tr.q { background-color: #ecf5f5; }
#sub_container .list3 .btn_confirm { width: 52px; height: 30px; margin: 0 auto; border: 1px solid #dcdcdc; background-color: #fff; -webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -moz-box-shadow:0 2px 0 #e5e5e5; -webkit-box-show:0 2px 0 #e5e5e5; box-shadow:0 2px 0 #e5e5e5; text-align: center; }
#sub_container .list3 .btn_confirm a,
#sub_container .list3 .btn_confirm a:hover { display: block; font-family: 'gulim', 굴림; color: #444444; font-size: 12px; line-height: 28px; font-weight: normal; letter-spacing: 0; }
#sub_container .list3 .btn_option { display: inline-block; width: 40px; height: 22px; margin: 0 0 0 4px; border: 1px solid #a0a0a0; background-color: #e3e3e3;  -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; text-align: center; }
#sub_container .list3 .btn_option a,
#sub_container .list3 .btn_option a:hover { display: block; font-family: 'gulim', 굴림; color: #444444; font-size: 12px; line-height: 20px; font-weight: normal; letter-spacing: 0; }

#sub_container .list2 {}
#sub_container .list2 th { padding: 9px 0; border: 1px solid #dddddd; border-bottom: 1px solid #dddddd; background-color: #4179A6; font-family: 'gulim', 굴림; color: white; font-size: 12px; line-height: 18px; font-weight: bold; letter-spacing: 0; text-align: center; }
#sub_container .list2 td { padding: 6px 0; border: 1px solid #dddddd; font-family: 'gulim', 굴림; color: #444444; font-size: 12px; line-height: 18px; font-weight: normal; letter-spacing: 0; text-align: center; }
#sub_container .list2 td.left { text-align: left;padding-left:7px; }
#sub_container .list2 td.right { text-align: right;padding-right:7px; }
#sub_container .list2 tr.q { background-color: #ecf5f5; }
#sub_container .list2 .btn_confirm { width: 52px; height: 30px; margin: 0 auto; border: 1px solid #dcdcdc; background-color: #fff; -webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -moz-box-shadow:0 2px 0 #e5e5e5; -webkit-box-show:0 2px 0 #e5e5e5; box-shadow:0 2px 0 #e5e5e5; text-align: center; }
#sub_container .list2 .btn_confirm a,
#sub_container .list2 .btn_confirm a:hover { display: block; font-family: 'gulim', 굴림; color: #444444; font-size: 12px; line-height: 28px; font-weight: normal; letter-spacing: 0; }
#sub_container .list2 .btn_option { display: inline-block; width: 40px; height: 22px; margin: 0 0 0 4px; border: 1px solid #a0a0a0; background-color: #e3e3e3;  -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; text-align: center; }
#sub_container .list2 .btn_option a,
#sub_container .list2 .btn_option a:hover { display: block; font-family: 'gulim', 굴림; color: #444444; font-size: 12px; line-height: 20px; font-weight: normal; letter-spacing: 0; }

#sub_container .list4 {}
#sub_container .list4 th { padding: 9px 0; border: 1px solid #dddddd; border-bottom: 1px solid #dddddd; background-color: #4179A6; font-family: 'gulim', 굴림; color: white; font-size: 12px; line-height: 18px; font-weight: bold; letter-spacing: 0; }
#sub_container .list4 td { padding: 6px 0; border: 1px solid #dddddd; font-family: 'gulim', 굴림; color: #444444; font-size: 12px; line-height: 18px; font-weight: normal; letter-spacing: 0; }
#sub_container .list4 td.left { text-align: left;padding-left:7px; }
#sub_container .list4 td.right { text-align: right;padding-right:7px; }
#sub_container .list4 tr.q { background-color: #ecf5f5; }
#sub_container .list4 .btn_confirm { width: 52px; height: 30px; margin: 0 auto; border: 1px solid #dcdcdc; background-color: #fff; -webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -moz-box-shadow:0 2px 0 #e5e5e5; -webkit-box-show:0 2px 0 #e5e5e5; box-shadow:0 2px 0 #e5e5e5; text-align: center; }
#sub_container .list4 .btn_confirm a,
#sub_container .list4 .btn_confirm a:hover { display: block; font-family: 'gulim', 굴림; color: #444444; font-size: 12px; line-height: 28px; font-weight: normal; letter-spacing: 0; }
#sub_container .list4 .btn_option { display: inline-block; width: 40px; height: 22px; margin: 0 0 0 4px; border: 1px solid #a0a0a0; background-color: #e3e3e3;  -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; text-align: center; }
#sub_container .list4 .btn_option a,
#sub_container .list4 .btn_option a:hover { display: block; font-family: 'gulim', 굴림; color: #444444; font-size: 12px; line-height: 20px; font-weight: normal; letter-spacing: 0; }

/* FOOT */
#footer > .area { position: relative; width: 1200px; margin: 44px auto 0; }
#footer > .area .foot_menu { margin-left: 20px; }
#footer > .area .foot_menu ul { margin: 0; padding: 0; }
#footer > .area .foot_menu li { position: relative; list-style: none; float: left; padding-left: 11px; margin-right: 10px; }
#footer > .area .foot_menu li:first-child { padding-left: 0; }
#footer > .area .foot_menu li:first-child:after { display: none; }
#footer > .area .foot_menu li:after { content: ""; position: absolute; width: 1px; height: 11px; left: 0; top: 2px; background-color: #6d6d6d; }
#footer > .area .foot_menu a,
#footer > .area .foot_menu a:hover { font-family: 'Nanum Gothic'; font-size: 12px; line-height: 14px; font-weight: 800; color: #5b5b5b; }
#footer > .area .foot_menu:after{ content:""; display:block; clear:both; /* height:0; visibility:hidden; */}

#footer > .area .copyright { margin: 10px 0 40px 20px; }
#footer > .area .copyright ul { margin: 0; padding: 0; }
#footer > .area .copyright li { position: relative; list-style: none; float: left; padding-left: 11px; margin-right: 10px; margin-bottom: 5px; font-family: 'Nanum Gothic'; font-size: 12px; line-height: 14px; color: #848484; }
#footer > .area .copyright li:first-child { padding-left: 0; background: none; }
#footer > .area .copyright li.v1 { clear: both; padding-left: 0; }
#footer > .area .copyright li.v1:after { display: none; }
#footer > .area .copyright li:after { content: ""; position: absolute; width: 1px; height: 11px; left: 0; top: 2px; background-color: #959595; }
#footer > .area .copyright:after{ content:""; display:block; clear:both; /* height:0; visibility:hidden; */}

#footer > .area .family { position: absolute; width: 158px; right: 0; top: 1px; }
#footer > .area .family ul { margin: 0; padding: 0; }
#footer > .area .family li { list-style: none; margin: 3px 0;}
#footer > .area .family select { width: 100%; height: 25px; border: 1px solid #b4b6bb; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; font-family: gulim; font-size: 12px; color: #636363; line-height: 25px; outline: none; }