@charset "utf-8";


/*********************reset.css*********************/
body, html{ margin:0; padding:0; width:100%; height:100%; }

/*
body, html{
	-ms-user-select: none; 
	-moz-user-select: -moz-none;
	-khtml-user-select: none;
	-webkit-user-select: none;
	user-select: none;
}
*/


body, input, textarea, select, button, table {
	font-family: 'Noto Sans KR', '나눔바른고딕', NanumBarunGothic, ng, '맑은 고딕', 'Malgun Gothic', '돋움', Dotum, '애플 SD 산돌고딕 Neo', 'Apple SD Gothic Neo', AppleGothic, Helvetica, sans-serif !important;
	font-size: 12px;
	-webkit-font-smoothing: antialiased
}
img, fieldset, button {
	border: 0
}
ul, ol {
	margin:0; padding:0;
	list-style: none
}
em, address {
	font-style: normal
}
a {
	text-decoration: none
}
a:hover, a:active, a:focus {
	text-decoration: none
}

form, fieldset, input, h1, h2, h3, h4, h5, h6, p{ margin:0; padding:0; }


/***********scrollbar***********/
body::-webkit-scrollbar {
      width: 5px;
      background-color:transparent;
      position:fixed;
      z-index:999999;
} /* this targets the default scrollbar (compulsory) */
body::-webkit-scrollbar-track{
	background-color:#666;
}
body::-webkit-scrollbar-thumb {
      background-color: rgba(255, 255, 255, 0.4); 
      border-radius:20px;
} /* this will style the thumb, ignoring the track */



/*********************custom.css*********************/
#container div, #container li, #container header, #container section, #container h1,
#container h2, #container h3, #container h4, #container h5, #container h6, #container p, 
#container small, #container aside, #container legend, #container form{ box-sizing:border-box; }

.flex{
	display:flex;
	display:-ms-flexbox;
	display:-moz-flexbox;
}
.flex_wrap{
	display:flex;
	display:-ms-flexbox;
	display:-moz-flexbox;
	flex-flow:row wrap;
}
.flex_center{
	display:flex;
	display:-ms-flexbox;
	display:-moz-flexbox;
	justify-content:center;
	align-items:center;
}

.pdh-05{ padding-right:05px; padding-left:05px; }
.pdh-10{ padding-right:10px; padding-left:10px; }
.pdh-15{ padding-right:15px; padding-left:15px; }
.pdh-20{ padding-right:20px; padding-left:20px; }
.pdh-25{ padding-right:25px; padding-left:25px; }
.pdh-30{ padding-right:30px; padding-left:30px; }
.pdh-35{ padding-right:35px; padding-left:35px; }
.pdh-40{ padding-right:40px; padding-left:40px; }


.col-01{ width:8.333333333333333% }
.col-02{ width:16.66666666666667%; }
.col-20{ width:20%; }
.col-03{ width:25%; }
.col-04{ width:33.33333333333333%; }
.col-05{ width:41.66666666666667%; }
.col-06{ width:50%; }
.col-07{ width:58.33333333333333%; }
.col-08{ width:66.66666666666667%; }
.col-09{ width:75%; }
.col-80{ width:80%; }
.col-10{ width:83.33333333333333%; }
.col-11{ width:91.66666666666667%; }
.col-12{ width:100%; }






/*********************header.css*********************/
#header{
	position:absolute;
	z-index:1000;
	top:0;
	left:0;
	width:100%;
	padding:55px 0 0;
}

#header.fixed{
	position:fixed;
	padding:0;
	-webkit-animation: ani-header 0.4s forwards;
	animation: ani-header 0.4s forwards;
	box-shadow:0 0 10px 0 rgba(0,0,0,0.2);

}

@-webkit-keyframes ani-header {
	0% { top: -70px }
	100% { top: 0px }
}
@keyframes ani-header {
	0% { top: -70px }
	100% { top: 0px }
}

#header:before, #header:after{
	content:'';
	display:table;
	clear:both;
}

.header_box{ padding:0 20px; }

.header_mxwidth{
	position:relative;
	z-index:200;
	height:100%;
	margin:0 auto;
	zoom:1;
	max-width:1200px;
	justify-content: space-between;
}

.header_logo_wrap{
	float:left;
	padding:15px 0 15px 0px;
	
}

.header_logo_wrap:before, .header_logo_wrap:after{ content:''; display:table; clear:both; }

.header_logo_wrap img{
	float:left;
	max-height:40px;
	max-width:150px;
	height:auto;
	width:auto;
}

.header_logo_wrap a{
    font-size: 22px;
    font-weight: 700;
    line-height: 40px;
}

nav#header_menu_wrap{
	float:right;
	width:calc(100% - 283px);
	display:flex;
	justify-content:center;
}

nav#header_menu_wrap ul{
	float:left;
}

nav#header_menu_wrap ul li.depth1{
	float:left;
	font-size:15px;
	font-weight:300;
	position:relative;
}

nav#header_menu_wrap ul li.depth1 a{
	padding:24px 25px;
	line-height:1.5;
	display: block;
}

nav#header_menu_wrap ul li.depth1 a p{
	display: -webkit-box;
	height:22px;
	overflow:hidden;
	text-align:center;
	text-overflow:ellipsis;
	-webkit-line-clamp:1;
	-webkit-box-orient: vertical;
}

nav#header_menu_wrap ul li.depth1 ul{
	position:absolute;
	top:100%;
	left:0;
	background-color:#272727;
	z-index:1000;
	float:left;
	min-width:200px;
	padding:10px 0;
	display:none;
}

nav#header_menu_wrap ul li.depth1 ul li.depth2{
	line-height:30px;
	position:relative;
}

nav#header_menu_wrap ul li.depth1 ul li.depth2.more > a:after{
	content:'';
	width:7px;
	height:7px;
	position:absolute;
	top:calc(50% - 3.5px);
	right:13px;
	transform:rotate(45deg);
	border-top:1px solid #888;
	border-right:1px solid #888;
}

nav#header_menu_wrap ul li.depth1 ul li.depth2 a{
	display:block;
	padding:5.5px 20px;
	color:#888;
	font-size:13px;
}

nav#header_menu_wrap ul li.depth1 ul li.depth2 ul{
	position:absolute;
	top:-10px;
	left:100%;
	background-color:#272727;
	display:none;
}

nav#header_menu_wrap ul li.depth1 ul li.depth2 ul li.depth3{
	line-height:30px;
}

nav#header_menu_wrap ul li.depth1 ul li.depth2 ul li.depth3 a{
	display:block;
	padding:5.5px 20px;
	color:#888;
	font-size:13px;
}

@media( max-width:850px ){
	.topLogo{ margin:0px  !important;padding:7px !important;}
	.topLogo img{ max-height:36px !important; margin:0px  !important;padding:0px  !important;}
	.side > ul > li > a {max-height:30px;}
}

@media( max-width:650px ){
	.header_logo_wrap a{ font-size:18px; }
}



/*********************add_menu.css*********************/
ul.add_menu_wrap{border:0px solid #000;}
ul.add_menu_wrap li{
	float:left;
	padding:0 7px;
	text-align:center;
	word-break:keep-all;
}

ul.add_menu_wrap:before, ul.add_menu_wrap:after{ content: ''; display: table; clear: both; }

.member_btn_link{
	float:left;
}

.member_btn_link:hover{
	cursor:pointer;
}
.add_menu a{
    float: left;
    cursor: pointer;
    font-size:11px;
	
}

.add_menu a i{ font-size:22px; margin-bottom:5px; }
.add_menu a p{ font-weight:300; }

.add_menu a .member_btn{
	display:inline-block;
	vertical-align:middle;
	position:relative;
	width:24px;
	height:2px;
	background-color:#888;
	transition-duration:0.3s;
}

.add_menu a .member_btn:before{
	content:'';
	width:24px;
	height:2px;
	background-color:#888;
	position:absolute;
	top:-7px;
	left:0;
	transition-duration:0.4s;
}

.add_menu a .member_btn:after{
	content:'';
	width:24px;
	height:2px;
	background-color:#888;
	position:absolute;
	top:7px;
	left:0;
	transition-duration:0.4s;
}

.add_menu a.spreaded .member_btn{
    background-color: transparent;
    height: 24px;
    border: 2px solid #888;
    border-radius: 100%;
}

.add_menu a.spreaded .member_btn:before{
	top: calc(50% - 1px);
    transform: rotate(225deg);
    width: 14px;
    left: calc(50% - 7px);
}

.add_menu a.spreaded .member_btn:after{
	transform:rotate(315deg);
    top: calc(50% - 1px);
    width: 14px;
    left: calc(50% - 7px);
}

.add_menu a.spreaded .admin_icon{
	vertical-align:middle;
}




/*********************mo_menu.css*********************/
#mo_menu_wrap{
	float:left;
	display:none;
	padding:10px;
}

#mo_menu_wrap:before, #mo_menu_wrap:after{
	content:'';
	display:table;
	clear:both;
}
.mo_menu{
	float:left;
}

.mo_menu li{ 
	float:left;
	line-height:50px;
	font-size:24px;
	padding:0 15px;
}

.mo_menu li .mo_menu_btn:hover{ cursor:pointer; }


@media( max-width:850px ){
	#mo_menu_wrap{ display:block; float:left; line-height:30px;padding:0px;}
	nav#header_menu_wrap ul.add_menu_wrap li{ line-height:30px; }
}




/*********************mo_gnb.css*********************/
.mo_gnb{
	position:absolute;
	top:100%;
	left:0;
	width:100%;
	box-sizing:border-box;
	overflow-x:hidden;
	overflow-y:auto;
	background-color:#2b2b2b;
	display:none;
	z-index:999999 !important;
}

.mo_gnb::-webkit-scrollbar { width: 5px; background-color:transparent; position:fixed; z-index:999999; }
.mo_gnb::-webkit-scrollbar-track{ background-color:#666; }
.mo_gnb::-webkit-scrollbar-thumb { background-color: rgba(255, 255, 255, 0.4);  border-radius:20px; }

.mo_depth1{
	text-align:left;
}

.mo_depth1 > a{
	display:block;
	font-size:15px;
	font-weight:300;
	color:#ddd;
	padding:10px 15px;
	border-bottom:1px solid rgba(255,255,255,0.05);
	border-top:1px solid rgba(30,30,30,1);
}

.mo_depth1:first-child > a{
	border-top:none;
}
.mo_depth1:last-child > a{
	border-bottom:none;
}

nav#header_menu_wrap > .mo_gnb > .mo_depth1 > ul{
	float:none;
	display:none;
}

nav#header_menu_wrap > .mo_gnb > .mo_depth1 > ul > li.mo_depth2 > a{
	display:block;
	color:#aaa;
	font-size:13px;
	font-weight:300;
	padding:10px 0 10px 15px;
	background-color:#212121;
}

nav#header_menu_wrap > .mo_gnb > .mo_depth1 > ul > li.mo_depth2 > ul{
	float:none;
	display:none;
}

nav#header_menu_wrap > .mo_gnb > .mo_depth1 > ul > li.mo_depth2 > ul > li.mo_depth3 > a{
	display:block;
	color:#888;
	font-size:13px;
	font-weight:300;
	padding:10px 0 10px 25px;
	background-color:#181818;
}

.mo_depth_list1, .mo_depth_list2{
	position:relative;
}

.mo_depth_list1:after, .mo_depth_list2:after{
	content:'';
	width:8px;
	height:8px;
	position:absolute;
	right:15px;
	top:calc(50% - 4px);
	border-top:1px solid #aaa;
	border-right:1px solid #aaa;
	transform:rotate(45deg);
	transition-duration:0.3s;
}

.mo_depth_list1.spreaded:after, .mo_depth_list2.spreaded:after{
	transform:rotate(135deg);
}






/*********************fixed_menu.css*********************/
.fixed nav#header_menu_wrap ul li.depth1 a{ padding:24px 15px; }





/*********************member_menu.css*********************/
.member_menu_wrap{
	background-color:#353535;
	position:fixed;
	z-index:9999;
	top:0;
	bottom:0;
	left:0;
	right:0;
	padding:50px 20px;
	background-color:rgba(0,0,0,0.5);
	overflow-y:auto;
	transition-duration:0.4s;
	display:none;
}

.member_menu_box{
	width:100%;
	height:100%;
	position:relative;
}

.member_menu_close{
	position:absolute;
	top:8px;
	right:8px;
	color:#fff;
	font-size:20px;
	line-height:20px;
	cursor:pointer;
}

.member_menu{
	width:350px;
	padding:40px 45px 30px;
	background-color:rgba(44, 47, 62, 0.9);
	position:relative;
}

.member_profile_wrap{
	width:180px;
	height:180px;
	border-radius:100%;
	overflow:hidden;
	margin:0 auto 12px;
}
.member_profile_wrap img{
	display:block;
	width:100%;
	height:auto;
}

.member_profile_desc{
	font-size:15px;
	text-align:center;
	line-height:1.5;
	word-break:keep-all;
	margin-bottom:30px;
}

.member_login_form .form{
	border-bottom:1px solid #51556a;
	margin-bottom:10px;
	position:relative;
}

.form span{ color:#fff; font-size:21px; position:absolute; top:6px; left:0; }

.form input{
	width:100%;
	border:none;
	background-color:transparent !important;
	color:#a7a9b7;
	padding:12px 5px 12px 30px;
	font-size:14px;
	position:relative;
}

.form input.inputid:before{
	content:'\e68a';
	font-family:xeicon;
	position:absolute;
	top:0;
	left:0;
	color:#fff;
	font-size:14px;
}

.form input.inputpw:before{
	content:'\e66b';
	font-family:xeicon;
	position:absolute;
	top:0;
	left:0;
	color:#fff;
	font-size:14px;
}

.log_add_wrap{
	margin-bottom:30px;
}

.keep_login{ display:flex; align-items:center; }

.keep_login input[id="keepid_opt"] + label{
	display:inline-block;
	width:12px;
	height:12px;
	border:1px solid #51556a;
	margin-right:10px;
	float:left;
	position:relative;
}

.keep_login input[id="keepid_opt"]:checked + label:before{
	content:"\f00c";
	font-family:FontAwesome;
	font-size:12px;
	color:#d4d4d4;
	position:absolute;
	top:0;
	left:0;
}

input#keepid_opt{
	display:none;
}

.keep_login label{
	font-size:12px;
	color:#adadad;
}

.find_account{ text-align:center; font-size:14px; margin-top:10px; }
.find_account a{ display:block; color:#adadad; padding:7px; }

.login_submit, .login_signup{
	width:100%;
	padding:10.5px 5px;
	font-size:14px;
	color:#fff;
	border-radius:100px;
	display:inline-block;
	box-sizing:border-box;
	margin-bottom:10px;
	text-align:center;
	cursor:pointer;
}

.login_signup{ background-color:#efefef; color:#666; }


.logged_menu{ padding:12px 25px; background-color:#222531; }
.logged_menu ul li a{ border-bottom:1px solid #51556a; }
.logged_menu ul li:last-child a{ border-bottom:none; }
.logged_menu ul li a{ font-size:14px; transition-duration:0.3s; color:#fff; display:block; padding:7px 3px; }
.logged_menu ul li a:hover{ padding-left:10px; } 

.logged_menu ul li.logged_btn{ display:block; }
.logged_menu ul li.logged_btn a{ position:relative; padding:7px 3px 7px 20px; transition-duration:0.3s; }
.logged_menu ul li.logged_btn a:before{ position:absolute; transition-duration:0.3s; top:9px; right:calc(100% - 15px); color:#fff; font-family:xeicon; }
.logged_menu ul li.logged_btn:nth-child(2) a:before{ content:'\e68a'; }
.logged_menu ul li.logged_btn:nth-child(3) a:before{ content:'\e64e'; }
.logged_menu ul li.logged_btn:nth-child(4) a:before{ content:'\e651'; }
.logged_menu ul li.logged_btn:nth-child(5) a:before{ content:'\e673'; }
.logged_menu ul li.logged_btn:nth-child(6) a:before{ content:'\e68e'; }
.logged_menu ul li.logged_btn:nth-child(7) a:before{ content:'\e794'; }
.logged_menu ul li.logged_btn:nth-child(8) a:before{ content:'\e6ed'; }
.logged_menu ul li.logged_btn:nth-child(9) a:before{ content:'\e68e'; }
.logged_menu ul li.logged_btn a:hover{ padding-left:27px; }
.logged_menu ul li.logged_btn a:hover:before{ margin-right:-7px; }



/*********************lang_menu.css*********************/
.lang_menu_wrap{
	background-color:#353535;
	position:fixed;
	z-index:9999;
	top:0;
	bottom:0;
	left:0;
	right:0;
	padding:50px 20px;
	background-color:rgba(0,0,0,0.3);
	overflow-y:auto;
	transition-duration:0.4s;
	display:none;
}

.lang_menu_box{
	width:100%;
	height:100%;
	position:relative;
}

.lang_menu_close{
	position:absolute;
	top:8px;
	right:8px;
	color:#fff;
	font-size:20px;
	line-height:20px;
	cursor:pointer;
}

.lang_title{ font-size:17px; margin-bottom:10px; text-align:center; }

.lang_menu{
	width:350px;
	padding:40px 20px;
	background-color:#2c2f3e;
	position:relative;
}

.lang_menu ul.lang_list{
	padding:12px 25px;
	background-color:#222531;
}

.lang_menu ul li{ border-bottom:1px solid #51556a; }
.lang_menu ul li:last-child{ border-bottom:none; }
.lang_menu ul li a{
	font-size: 14px;
    transition-duration: 0.3s;
    color: #fff;
    display: flex;
    align-items:center;
    padding: 7px 3px;
}
.lang_menu ul li a:hover{ padding-left:10px; } 

.lang_menu ul li a img{ margin-right:10px; }


.contbox2 a{color:#ffff00;font-weight:bold;}



/*********************footer*********************/
#footer{ overflow:hidden; }
#footer.dark{ background-color:#272727; }
#footer.light{ background-color:#fafafa; }
#footer div{ box-sizing:border-box; }

.ft_cont{ padding:65px 20px 80px; max-width:1240px; margin:0 auto; }
.ft_pt_wrap{ margin:0 -15px; }
.ft_pt{ box-sizing:border-box; }
.ft_pt.pt_01{ width:100%; }
.ft_pt.pt_02{ width:50%; }
.ft_pt.pt_03{ width:33.333333333%; }
.ft_pt.pt_04{ width:25%; }
.ft_logo_wrap{ margin:-13px 0 0 0; border:0px solid #fff;}
.ft_logo img{ max-height:60px; max-width:100%; width:auto; display:block; }
.ft_icon{ margin:0px 10px; margin-bottom:0px; }
.ft_icon:last-child{ margin-right:0; }

.ft_icon i{ width:30px; height:30px; border-radius:100%; text-align:center; line-height:30px; font-size:16px; }
#footer.dark .ft_icon i{ color:#fff; background-color:#444; }
#footer.light .ft_icon i{ color:#333; background-color:#ddd; }

.ft_pt_title{ font-size:20px; font-weight:600; margin-bottom:15px; }
#footer.dark .ft_pt_title{ color:#fff; }
#footer.light .ft_pt_title{ color:#333; }

.ft_pt_cont{ line-height:1.5; font-size:13px; font-weight:300; }
#footer.dark .ft_pt_cont{ color:#b2b2b2; }
#footer.light .ft_pt_cont{ color:#777; }

li.ft_list{ padding:2px 0; }
li.ft_list a{ font-size:14px; }
#footer.dark li.ft_list a{ color:#b2b2b2; }
#footer.light li.ft_list a{ color:#4d4d4d; }

/*********************copyright.css*********************/
.copyright{ padding:10px 15px; }
#footer.dark .copyright{ background-color:#383838; }
#footer.light .copyright{ background-color:#f1f1f1; }
.copy_txt{ max-width:1200px; margin:0 auto; text-align:center; color:#888; }

.ft_quick{display:none;}
.ft_icon_wrap{display:none;}


/*********************footer_mediaquery*********************/
@media( max-width:900px ){
	.ft_pt.pt_01, .ft_pt.pt_02, .ft_pt.pt_03, .ft_pt.pt_04{ width:100%; max-width:700px; margin:0 auto 30px; }
	#ft_pt4{ display:none; }
	.ft_pt:last-child{ margin-bottom:0 !important; }
	.ft_logo img{ margin:0 auto; }
	.ft_icon_wrap{ justify-content:center; border:1px solid #444;margin-top:10px;padding:5px;box-sizing:border-box;display:block;text-align:center;}

	.ft_icon_wrap i{width:30px;height:30px;font-size:20px;}
}

@media( max-width:850px ){
	.ft_top_pt{ width:100%; border:none; }
}

@media( max-width:800px ){
	.ft_top_pt:last-child{ padding-top:0; }
	.top_01 h1{ margin-bottom:15px; }
}

@media( max-width:600px ){
	.top_01{ flex-direction:column; }

	

}



