@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:fixed;
	z-index:1000;
	top:0;
	left:0;
	width:100%;
	transition-duration:0.3s;
}

#header.fixed{
	box-shadow:0 3px 3px 0 rgba(0,0,0,0.15);
}

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

.header_mxwidth{
	position:relative;
	z-index:200;
	height:100%;
	margin:0 auto;
	zoom:1;
	padding:0 60px;
}

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

.header_logo_wrap{
	float:left;
	margin:10px 20px 10px 0;
}

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

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

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

nav#header_menu_wrap{
	float:right;
}

nav#header_menu_wrap ul{
	float:left;
}

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

nav#header_menu_wrap ul li.depth1 a{
	padding:20.5px 15px;
	line-height:30px;
}

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:0 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:0 20px;
	color:#888;
	font-size:13px;
}

@media( max-width:950px ){
	.header_mxwidth{ padding:0 15px; }
}

@media( max-width:850px ){
	nav#header_menu_wrap{ float:left; }
	#header{ text-align:center; }
	.header_logo_wrap{ margin:0; display:inline-block; float:none; position: absolute; top:50%; left:50%; transform:translate(-50%, -50%); }
	.header_logo_wrap img{ max-height:30px; }
	.header_mxwidth{ padding:0; }
	.pc_gnb{ display:none; }
}

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



/*********************add_menu.css*********************/
nav#header_menu_wrap ul.add_menu_wrap{
	padding:0 8px;
}
nav#header_menu_wrap ul.add_menu_wrap li{
	float:left;
	line-height:60px;
	font-size:20px;
	padding:0 7px;
}

.member_btn_link{
	float:left;
}

.member_btn_link:hover{
	cursor:pointer;
}
.add_menu a{
	cursor:pointer;
}

.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;
}


@media( max-width:850px ){
	nav#header_menu_wrap ul.add_menu_wrap li{ line-height:50px; }
}


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

#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:20px;
	padding:0 15px;
}

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

@media( max-width:850px ){
	#mo_menu_wrap{ display:block; float:right; }
}





/*********************mo_gnb.css*********************/
.mo_gnb{
	position:absolute;
	top:100%;
	left:0;
	width:100%;
	box-sizing:border-box;
	max-height:350px;
	overflow-x:hidden;
	overflow-y:auto;
	background-color:#2b2b2b;
	box-shadow:0 0 5px 0 rgba(0,0,0,0.3);
	display:none;
}

.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*********************/
/*#header.fixed nav#header_menu_wrap ul li.depth1, #header.fixed nav#header_menu_wrap ul.add_menu_wrap li, #header.fixed #mo_menu_wrap .mo_menu li{ line-height:50px; }*/
/*#header.fixed nav#header_menu_wrap ul li.depth1 a{ padding:19px 15px; }*/
.fixed nav#header_menu_wrap ul li.depth1 a{ padding:20px 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.3);
	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:150px;
	height:150px;
	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:'\e6ed'; }
.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; }