﻿@charset "utf-8";

/* @import url(http://fonts.googleapis.com/earlyaccess/notosanskr.css); */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');
/* font-family: 'Noto Sans KR'; */
/* Thin 250, Light 300, DemiLight 350, Regular 400, Medium 500, Bold 700, Black 900 */
/* 100, 300, 400, 500 ,700, 900 */


@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+KR:wght@200;300;400;500;600;700;900&display=swap');
/* font-family: 'Noto Serif KR'; */
/* 200, 300, 400, 500, 600, 700, 900 */


/* Base Style Start */
html, body {position: relative; width: 100%; height: 100%; margin: 0 auto; padding: 0; font-size: 16px;}
body, div, ul, li, dl, dt, dd, ol, p, h1, h2, h3, h4, h5, h6, table, form, img {margin: 0; padding: 0; border: 0;}

/* 아이폰 사파리 폰트 사이즈 자동 조정 막음 : -webkit-text-size-adjust: none; */
/* word-break: break-all; */
body {
	position: relative;
	font-family: 'Noto Sans KR', 'Nanum Gothic', 'Malgun Gothic', '맑은 고딕', sans-serif; word-break: keep-all; word-wrap: break-word;
	font-weight: 400; color: #222;
	background : none;
	-webkit-text-size-adjust: none;
}
/* Base Font Size : 16px, 1.000em, 12pt => body base : 12px */
/* Base Style End */

/* Text Base Style Start */
dl, dt, dd, ul, ol, li, p {list-style : none; vertical-align : middle; letter-spacing : 0; line-height: 1.2em; line-height: normal;}
/* Text Base Style Start */

/* form 요소 Start */
input, textarea {display: inline-block; font-family: 'Noto Sans KR', 'Nanum Gothic', 'Malgun Gothic', '맑은 고딕', sans-serif; vertical-align: middle;}
/*
input[type=checkbox] {width: 20px; height: 20px;}
input[type=radio] {width: 20px; height: 20px;}
*/
/* input[placeholder], [placeholder],*[placeholder] {color: #bbb !important; font-weight: bold; font-size: 14px !important;} */
/* Webkit Browsers */
/* Mozilla FF 4 ~ 18 */
/* Mozilla FF 19+ */
/* IE 10~ */
input::-webkit-input-placeholder {color: #bbb; font-weight: 300; font-size: 14px;}
input:-moz-placeholder {color: #bbb; font-weight: 300; font-size: 14px;}
input::-moz-placeholder {color: #bbb; font-weight: 300; font-size: 14px;}
input:-ms-input-placeholder {color: #bbb; font-weight: 300; font-size: 14px;}

textarea::-webkit-input-placeholder {color: #bbb; font-weight: 300; font-size: 14px;}
textarea:-moz-placeholder {color: #bbb; font-weight: 300; font-size: 14px;}
textarea::-moz-placeholder {color: #bbb; font-weight: 300; font-size: 14px;}
textarea:-ms-input-placeholder {color: #bbb; font-weight: 300; font-size: 14px;}

.formField {display: inline-block; height: 30px; line-height: 20px; box-sizing: border-box; padding: 4px; font-size : 13px; font-weight: 300; color : #222; vertical-align: middle; border: 1px #ddd solid; background-color: #fdfdfd;} /* box-sizing: inherit; */
.formField:focus {border: 1px #999 solid; background-color: #fff;}
select {
	font-family: 'Nanum Gothic', 'Malgun Gothic', '맑은 고딕', sans-serif;
	display: inline-block; height: 30px; line-height: 20px; padding: 4px; font-size : 12px; font-weight: normal; color : #333; vertical-align: middle; background-color : #fdfdfd; border: 1px #ddd solid;
}
select:focus {border: 1px #999 solid; background-color : #fff;}
/* form 요소 End */

/* a href Style Start */
a:link, a:visited, a:active {letter-spacing: 0px; margin: 0; text-decoration: none; outline: 0; color: #444;}
a:hover {text-decoration: underline; color: #000;}
/* a href Style End */


/* btn class */
.Btn {display: inline-block; vertical-align: middle; margin: 0 !important; box-sizing: border-box;}
.Btn>span {display: inline-block; text-align: center;}

.Btn.White {border: 0px #eee solid; background-color: #fdfdfd;}
.Btn.White:hover {background-color: #eee;}
.Btn.White>span {color: #777; font-weight: 400;}

.Btn.Silver {border: 0px #eaeaeb solid; background-color: #eaeaeb;}
.Btn.Silver:hover {background-color: #dddde1;}
.Btn.Silver>span {color: #666; font-weight: 400;}

.Btn.DarkSilver {border: 0px #9094a2 solid; background-color: #9094a2;}
.Btn.DarkSilver:hover {background-color: #737682;}
.Btn.DarkSilver>span {color: #fff; font-weight: 400;}

.Btn.Gold {border: 0px #cfb96a solid; background-color: #cfb96a;}
.Btn.Gold:hover {background-color: #c0ab5f;}
.Btn.Gold>span {color: #fff; font-weight: 400;}

.Btn.Gray {border: 0px #eee  solid; background-color: #eee;}
.Btn.Gray:hover {background-color: #ddd;}
.Btn.Gray>span {color: #666; font-weight: 400;}

.Btn.GrayRed {border: 0px #eee  solid; background-color: #eee;}
.Btn.GrayRed:hover {background-color: #ca0114;}
.Btn.GrayRed>span {color: #666; font-weight: 400;}
.Btn.GrayRed:hover>span {color: #fff;}

.Btn.DarkGray {border: 0px #666 solid; background-color: #666;}
.Btn.DarkGray:hover {background-color: #444;}
.Btn.DarkGray>span {color: #fff; font-weight: 400;}

.Btn.Red {border: 0px #ca0114 solid; background-color: #ca0114;}
.Btn.Red:hover {background-color: #a20110;}
.Btn.Red>span {color: #fff; font-weight: 400;}

.Btn.Orange {border: 0px #F16A54 solid; background-color: #F16A54;}
.Btn.Orange:hover {background-color: #e35a44;}
.Btn.Orange>span {color: #fff; font-weight: 400;}

.Btn.Blue {border: 0px #6979a4 solid; background-color: #6979a4;}
.Btn.Blue:hover {background-color: #434e69;}
.Btn.Blue>span {color: #fff; font-weight: 400;}

.Btn.DarkBlue {border: 0px #4a515f solid; background-color: #4a515f;}
.Btn.DarkBlue:hover {background-color: #3b414c;}
.Btn.DarkBlue>span {color: #fff; font-weight: 400;}

.Btn.Standard {height: 40px; padding: 10px 10px; overflow: hidden;}
.Btn.Round3 {height: 40px; padding: 10px 10px; overflow: hidden; border-radius: 3px;}
.Btn.Round5 {height: 40px; padding: 10px 10px; overflow: hidden; border-radius: 5px;}

.Btn.Standard>span,
.Btn.Small>span,
.Btn.VerySmall>span,
.Btn.Round3>span,
.Btn.Round5>span {display: block; line-height: 20px; padding: 0 10px; font-size: 14px;}
a.Btn:hover {text-decoration: none;}

.Btn.Small {height: 30px; padding: 5px; overflow: hidden;}
.Btn.Small>span {line-height: 20px; font-size: 13px; padding-left: 10px; padding-right: 10px;}

.Btn.VerySmall {height: 20px; padding: 4px 4px; overflow: hidden; margin: 0;}
.Btn.VerySmall>span {line-height: 12px; font-size: 12px; padding-left: 5px; padding-right: 5px;}

.Btn.GapLeft {margin-left: 100px !important;}

.Btn.Wide {height: 40px; padding: 10px; overflow: hidden;}
.Btn.Wide>span {padding-left: 20px; padding-right: 20px;}

.BtnWrap {width: 100%; text-align: center; padding: 20px 0;}

.circlePoint {display: inline-block; width: 20px; height: 20px; line-height: 20px; border-radius: 50%; background-color: #bbb; font-size: 10px; font-weight: bold; color: #fff; text-align: center; margin: 5px 5px 5px 0;}
.red {background-color: #f25135;}
.yellow {background-color: #eec625;}
.blueSky {background-color: #69b3e2;}
.green {background-color: #92ce2a;}
/* btn class */

.dummy {clear: both; width: 100%; height: 0; border: 0; margin: 0; padding: 0; line-height: 0; font-size: 0;}
.clearFix:after {content:""; display: block; clear: both;} /* 부모창에 자식창의 높이를 알려주는 권장방법 */
.clearFix {*zoom: 1;} /* IE5.5 ~ 7 브라우저 대응 핵 */
.hidden {display: none;}
.upFileHidden {position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0;}


#nabyWrap {position: relative; width: 100%; height: 100%; margin: 0; padding: 0px;}

	/* Table Base Style Start */
	#nabyWrap table {table-layout: fixed; width: 100%; margin: 0 auto; padding: 0; border-collapse: collapse; border: 1px #e9e9e9 solid;}
	#nabyWrap table caption {display: none;}
	#nabyWrap table th,
	#nabyWrap table td {padding: 10px 5px; border: 1px #e9e9e9 solid; line-height: 20px; font-size: 13px; font-weight: 400;}
	#nabyWrap table thead th {color: #222; font-weight: 500; background-color: #f2f2f2;}
	#nabyWrap table tbody th {color: #222; font-weight: 400; background-color: #f9f9f9;}
	#nabyWrap table td {color: #444; background-color: #fff;}
	/* Table Base Style End */


	/* Board Setup Start */
	#nabyWrap .setupTable {width: 600px; margin: 50px auto 0;}
	#nabyWrap .setupTable > h1 {float: left; display: block; width: 100%; height: 60px; line-height: 60px; font-size: x-large; font-weight: normal; color: #222; text-align: center;}
	#nabyWrap .setupTable > h2 {float: left; display: block; width: 100%; height: 60px; line-height: 60px; font-size: large; font-weight: normal; color: #222; text-align: center;}
	#nabyWrap .setupTable > .bigMessge {float: left; display: block; width: 90%; padding: 0 5%; height: 39px; line-height: 39px; font-size: small; font-weight: normal; color: #333; text-align: center; background-color: #f9f9f9; border-top: 1px #ddd dashed;}
	#nabyWrap .setupTable > form > dl {float: left; width: 100%; border-top: 2px #444 solid; border-bottom: 1px #444 solid;}
	#nabyWrap .setupTable > form > dl > dt {float: left; width: 25%; height: 30px; line-height: 30px; padding: 10px 0 9px; border-bottom: 1px #ddd solid; font-size: 13px; font-weight: 500;}
	#nabyWrap .setupTable > form > dl > dd {float: left; width: 60%; height: 30px; line-height: 30px; padding: 10px 0 9px; border-bottom: 1px #ddd solid; font-size: 13px;}
	#nabyWrap .setupTable > form > dl > dd.notes {float: left; width: 15%; height: 30px; line-height: 30px; padding: 10px 0 9px; border-bottom: 1px #ddd solid; text-align: center; color: #777;}
	#nabyWrap .setupTable > form > dl > dd.notes > .circle {display: inline-block; width: 20px; height: 20px; line-height: 20px; border-radius: 50%; background-color: #bbb; color: #fff; text-align: center; margin: 0 3px 1px;}
	#nabyWrap .setupTable > form > dl > dd.notes > .essential {background-color: #eec625; color: #fff;}
	#nabyWrap .setupTable > form > dl > dd.notes > .selection {background-color: #69b3e2; color: #fff;}
	#nabyWrap .setupTable > form > dl > dd.errMsg {float: left; display: none; width: 75%; height: 30px; line-height: 30px; padding: 10px 0 9px 25%; border-bottom: 1px #ddd solid; font-size: 12px; font-weight: normal; color: #F16A54;}
	#nabyWrap .setupTable > .BtnWrap {float: left;}
	/* Board Setup End */

	/* Alert Popup Start */
	#nabyWrap #alertPopupDimmLayer {position: fixed; display: none; top: 0; left: 0; width: 100%; height: 100%; z-index: 103; background-color: #000; opacity: 0.4;} /* for Drag Popup */
	/* #alertPopup {position: absolute; display: none; top: 50%; left: 50%; margin-left: -180px; margin-top: -110px;  width: 360px; height: 220px; z-index: 104; background-color: #fff; border-radius: 5px; box-shadow: 0 0 10px #bbb; overflow: hidden;} */
	#nabyWrap #alertPopup {position: fixed; display: none; top: 250px; left: 50%; margin-left: -180px; width: 360px; height: 220px; z-index: 104; background-color: #fff; border-radius: 5px; box-shadow: 0 0 10px #bbb; overflow: hidden;}
	#nabyWrap #alertPopup > .msgBox {padding: 80px 20px 40px; width: 320px; height: 30px; background: url('../img/alertCheck.png') center 30px no-repeat;}
	#nabyWrap #alertPopup > .msgBox > p {font-size: 14px; font-weight: normal; color: #333; text-align: center; line-height: 20px;}
	#nabyWrap #alertPopup > .confirmBox {width: 360px; height: 70px;}
	#nabyWrap #alertPopup > .confirmBox > .confirmChk {display: block; width: 320px; height: 30px; padding: 20px; font-size: 16px; font-weight: bold; color: #fff; text-align: center; line-height: 30px; background-color: #464a55;}
	#nabyWrap #alertPopup > .confirmBox > .confirmChk:hover {background-color: #33363d;}
	/* Alert Popup End */

	/* Confirm Popup Start */
	/* #confirmPopup {position: absolute; display: none; top: 50%; left: 50%; margin-left: -180px; margin-top: -110px;  width: 360px; height: 220px; z-index: 104; background-color: #fff; border-radius: 5px; box-shadow: 0 0 10px #bbb; overflow: hidden;} */
	#nabyWrap #confirmPopup {position: fixed; display: none; top: 250px; left: 50%; margin-left: -180px; width: 360px; height: 220px; z-index: 104; background-color: #fff; border-radius: 5px; box-shadow: 0 0 10px #bbb; overflow: hidden;}
	#nabyWrap #confirmPopup > .msgBox {padding: 80px 20px 40px; width: 320px; height: 30px; background: url('../img/alertCheck.png') center 30px no-repeat;}
	#nabyWrap #confirmPopup > .msgBox > p {font-size: 14px; font-weight: normal; color: #333; text-align: center; line-height: 20px;}
	#nabyWrap #confirmPopup > .confirmBox {width: 360px; height: 70px;}
	#nabyWrap #confirmPopup > .confirmBox > .confirmSign {float: left; display: block; width: 140px; height: 30px; padding: 20px; font-size: 16px; font-weight: bold; color: #fff; text-align: center; line-height: 30px; background-color: #464a55;}
	#nabyWrap #confirmPopup > .confirmBox > .confirmSign:hover {background-color: #33363d;}
	#nabyWrap #confirmPopup > .confirmBox > .confirmSign:first-of-type {padding: 20px 19px 20px 20px; border-right: 1px #6f7380 solid;}
	/* Confirm PopupEnd */

	/* Paging Start */
	#nabyWrap .pagingArea {width: 100%; height: 30px; padding: 30px 0; text-align: center;}
	#nabyWrap .pagingArea > a {display: inline-block; width: 30px; height: 30px; line-height: 30px; text-align: center; text-decoration: none;}
	#nabyWrap .pagingArea img {display: inline-block; vertical-align: middle; }
	#nabyWrap .pagingArea > ul {display: inline-block;}
	#nabyWrap .pagingArea > ul > li {
		float: left; display: block; width: 29px; height: 28px; line-height: 28px; text-align: center; font-size: 13px; color: #777;
		border-top: 1px #e9e9e9 solid;
		border-bottom: 1px #e9e9e9 solid;
		border-right: 1px #e9e9e9 solid;
	}
	#nabyWrap .pagingArea > ul > li > a {display: block; width: 30px; height: 30px; line-height: 30px; text-align: center;}
	#nabyWrap .pagingArea > ul > li:last-of-type {width: 30px; border-right: 0;}
	#nabyWrap .pagingArea > ul > li.on {color: #fff; background-color: #464a55; border-top: 1px #464a55 solid; border-bottom: 1px #464a55 solid;}
	/* Paging End */

	/* 404 Error Start */
	#wrap404 {position: relative; width: 100%; height: 100%; background-color: #333;}
	.textArea404 {width: 96%; height: 330px; padding: 100px 2% 150px; margin-top: 5%; background: url('../img/bg404.png') center top no-repeat;}
	.textArea404 > p.oops {font-size: 96px; font-weight: 100; color: #fff; text-align: center; line-height: 120px; color: #dda100;}
	.textArea404 > h1 {font-size: 64px; font-weight: bold; color: #fff; text-align: center; text-decoration: underline;}
	.textArea404 > p.joke {font-size: 22px; font-weight: normal; color: #999; text-align: center; padding: 30px; word-break: keep-all;}
	#wrap404 > .BtnWrap {padding-top: 80px;}
	.copyrightArea404 {width: 310px; height: 30px; margin: 0 auto; padding-top: 20px;}
	.copyrightArea404 > p {line-height: 49px; font-size: 11px; font-weight: normal; color: #999; text-align: center; border-top: 1px #555 solid;}
	/* 404 Error End */




	/* Membership Login Start */
	#nabyWrap.bgLoginWrap {background-color: #fafafa;}
	#nabyWrap .nabyLoginArea {position: relative; display: block; width: 320px; box-sizing: border-box; padding: 60px 20px 0; margin: 0 auto;}
	#nabyWrap .nabyLoginArea .BtnWrap {background-color: #eee;}

	/* for login */
	#nabyWrap .nabyLoginArea > .loginTitle {width: 100%; height: 120px; margin: 0 auto; padding: 0 0 19px; border-bottom: 1px #eee solid;}
	#nabyWrap .nabyLoginArea > .loginTitle > h1 {font-size: 18px; font-weight: 500; color: #222; text-align: center; line-height: 40px;}
	#nabyWrap .nabyLoginArea > .loginTitle > h2 {font-size: 36px; font-weight: 700; color: #ca0114; text-align: center; line-height: 40px;}
	#nabyWrap .nabyLoginArea > .loginTitle > p {padding-top: 10px; font-size: 12px; font-weight: 400; color: #444; text-align: center; line-height: 15px;}

	/* for search tab */
	#nabyWrap .nabyLoginArea > .accountTitle {width: 100%; height: 140px; margin: 0 auto; padding: 0;}
	#nabyWrap .nabyLoginArea > .accountTitle > h1 {font-size: 18px; font-weight: 500; color: #222; text-align: center; line-height: 40px;}
	#nabyWrap .nabyLoginArea > .accountTitle > h2 {font-size: 32px; font-weight: 700; color: #ca0114; text-align: center; line-height: 40px;}
	#nabyWrap .nabyLoginArea > .accountTitle > ul.tabMenu {display: block; width: 100%; height: 39px; padding-top: 20px; border-bottom: 1px #ccc solid;}
	#nabyWrap .nabyLoginArea > .accountTitle > ul.tabMenu > li {float: left; width: 50%; height: 39px;}
	#nabyWrap .nabyLoginArea > .accountTitle > ul.tabMenu > li > a {display: block; width: 100%; height: 39px; line-height: 39px; font-size: 14px; font-weight: 500; text-align: center; color: #666; background-color: #f0f0f0;}
	#nabyWrap .nabyLoginArea > .accountTitle > ul.tabMenu > li > a:hover {color: #666; text-decoration: underline; background-color: #e9e9e9;}
	#nabyWrap .nabyLoginArea > .accountTitle > ul.tabMenu > li.on > a {color: #fff; background-color: #ca0114;}
	#nabyWrap .nabyLoginArea > .accountTitle > ul.tabMenu > li.on > a:hover {color: #fff; text-decoration: underline; background-color: #a20110;}
	#nabyWrap .nabyLoginArea > .accountTitle > ul.tabMenu > li:first-child > a {border-radius: 3px 0 0 0;}
	#nabyWrap .nabyLoginArea > .accountTitle > ul.tabMenu > li:last-child > a {border-radius: 0 3px 0 0;}


	/* for login & search form */
	#nabyWrap .nabyLoginArea > .loginForm {position: relative; width: 100%; box-sizing: border-box; padding: 40px 0 0;}
	#nabyWrap .nabyLoginArea > .loginForm input {width: 100%; height: 40px; box-sizing: border-box;  padding: 0; margin-bottom: 10px; font-size: 14px; font-weight: 300; color: #333; text-indent: 30px; background-color: #fff; border: 1px #ddd solid;; border-radius: 3px;}
	#nabyWrap .nabyLoginArea > .loginForm input:focus {border: 1px #ca0114 solid;}

	#nabyWrap .nabyLoginArea > .loginForm a#loginSubmit,
	#nabyWrap .nabyLoginArea > .loginForm a#findIDSubmit,
	#nabyWrap .nabyLoginArea > .loginForm a#findPasswdSubmit,
	#nabyWrap .nabyLoginArea > .loginForm a#passwdChangeSubmit {display: block; width: 100%; height: 50px; margin-top: 0; text-align: center; font-size: 18px; font-weight: 300; color: #fff; background-color: #ca0114; line-height: 50px; text-decoration: none; border-radius: 3px;}
	#nabyWrap .nabyLoginArea > .loginForm a#loginSubmit:hover,
	#nabyWrap .nabyLoginArea > .loginForm a#findIDSubmit:hover,
	#nabyWrap .nabyLoginArea > .loginForm a#findPasswdSubmit:hover,
	#nabyWrap .nabyLoginArea > .loginForm a#passwdChangeSubmit:hover {background-color: #a20110;}

	#nabyWrap .nabyLoginArea > .loginForm .snsLogin {display: block; width: 100%; height: 60px; margin: 0 auto; box-sizing: border-box; padding: 20px 0 0; border-radius: 3px; overflow: hidden;}
	#nabyWrap .nabyLoginArea > .loginForm .snsLogin.hidden {display: none !important;}
	#nabyWrap .nabyLoginArea > .loginForm .snsLogin > li {float: left; width: 50%; height: 40px;}
	#nabyWrap .nabyLoginArea > .loginForm .snsLogin > li.naverLogin {background: url('../img/iconLoginNaver.png') left center no-repeat #f4f4f4;} /* {background-color: #03CF5D;} */
	#nabyWrap .nabyLoginArea > .loginForm .snsLogin > li.kakaoLogin {background: url('../img/iconLoginKakao.png') left center no-repeat #efefef;} /* {background-color: #FEE500;} */
	#nabyWrap .nabyLoginArea > .loginForm .snsLogin > li > a {display: block; width: 100%; height: 40px; box-sizing: border-box; padding-left: 25px; line-height: 40px; font-size: 12px; font-weight: 500; color: #444; text-align: center; text-decoration: none;}
	/*
	#nabyWrap .nabyLoginArea > .loginForm .snsLogin > li.naverLogin > a {color: #ffffff;}
	#nabyWrap .nabyLoginArea > .loginForm .snsLogin > li.kakaoLogin > a {color: #381E1F;}
	*/


	/* for search Result area */
	#nabyWrap .nabyLoginArea > .searchResultArea {position: relative; width: 100%; padding: 40px 0 0;}
	#nabyWrap .nabyLoginArea > .searchResultArea > .resultBox {width: 100%; height: 40px; margin-bottom: 5px; background-color: #f4f4f4; border-radius: 3px; padding: 10px 0; font-size: 16px; font-weight: bold; color: #333; line-height: 40px; text-align: center; }
	#nabyWrap .nabyLoginArea > .searchResultArea p.errMsg {display: block; width: 100%; height: 50px; line-height: 50px; text-align: center; font-size: 12px; font-weight: 300; color: #777; margin-bottom: 5px;}
	#nabyWrap .nabyLoginArea > .searchResultArea a#reFindSubmit {display: block; width: 100%; height: 50px; text-align: center; font-size: 18px; font-weight: 300; color: #fff; background-color: #ca0114; line-height: 50px; text-decoration: none; border-radius: 3px;}
	#nabyWrap .nabyLoginArea > .searchResultArea a#reFindSubmit:hover {background-color: #a20110;}

	#nabyWrap .nabyLoginArea > .loginBottom {position: relative; width: 100%; padding: 0; margin-top: 20px; border: 1px #eee solid; border-radius: 3px; background-color: #f4f4f4; overflow: hidden;}
	#nabyWrap .nabyLoginArea > .loginBottom .loginSupport {display: block; width: 100%; height: 70px; margin: 0 auto; box-sizing: border-box; padding: 20px; text-align: center;}
	#nabyWrap .nabyLoginArea > .loginBottom .loginSupport > li {float: left; display: block; height: 30px;}
	#nabyWrap .nabyLoginArea > .loginBottom .loginSupport > li:nth-child(1) {width: 160px;}
	#nabyWrap .nabyLoginArea > .loginBottom .loginSupport > li:nth-child(2) {width: 80px;}
	#nabyWrap .nabyLoginArea > .loginBottom .loginSupport > li > a {display: block; width: 100%; height: 100%; line-height: 30px; font-size: 13px; font-weight: 300; color: #777; text-align: center; text-decoration: none;}

	@media screen and (max-width: 640px) {
	}
	/* Membership Login End */


	/* Membership Join & Edit Start */
	#nabyWrap .nabyAgreementArea {position: relative; display: block; width: 600px; box-sizing: border-box; padding: 60px 20px 0; margin: 0 auto;}
	#nabyWrap .nabyAgreementArea .BtnWrap {background-color: #eee;}

	#nabyWrap .nabyAgreementArea > .agreementTitle {width: 100%; height: 120px; margin: 0 auto; padding: 0 0 19px; border-bottom: 1px #eee solid;}
	#nabyWrap .nabyAgreementArea > .agreementTitle > h1 {font-size: 18px; font-weight: 500; color: #222; text-align: center; line-height: 40px;}
	#nabyWrap .nabyAgreementArea > .agreementTitle > h2 {font-size: 32px; font-weight: 700; color: #ca0114; text-align: center; line-height: 40px;}
	#nabyWrap .nabyAgreementArea > .agreementTitle > p {font-size: 14px; font-weight: 300; color: #666; text-align: center; line-height: 40px;}

	#nabyWrap .nabyAgreementArea > .agreementForm {position: relative; width: 100%; box-sizing: border-box; padding: 40px 0 0;}



	#nabyWrap .joinArea {position: absolute; top: 60px; left: 50%; margin-left: -250px; width: 500px; min-height: 610px; box-sizing: border-box; padding: 30px 0; background-color: #fff; border: 1px #e9e9e9 solid; border-radius: 5px;}
	#nabyWrap .joinArea > .BtnWrap {background-color: #eee;}
	#nabyWrap .joinArea > .joinTitle {width: 400px; height: 80px; margin: 0 auto; padding: 0 0 10px;}
	#nabyWrap .joinArea > .joinTitle > h2 {font-size: 36px; font-weight: bold; color: #ca0114; text-align: center; line-height: 50px;}
	#nabyWrap .joinArea > .joinTitle > p {font-size: 12px; font-weight: bold; color: #666; text-align: center; line-height: 30px;}

	#nabyWrap .joinArea ul.joinForm {width: 400px; padding: 0 50px;}
	#nabyWrap .joinArea ul.joinForm > li {width: 100%; min-height: 40px; padding: 5px 0; list-style: none; font-size: 13px; color: #333; font-weight: normal; line-height: 40px;}
	#nabyWrap .joinArea ul.joinForm > li > h3 {font-size: 13px;}
	#nabyWrap .joinArea ul.joinForm > li > input[type=text],
	#nabyWrap .joinArea ul.joinForm > li > input[type=password] {width: 100%; height: 40px; background-color: #f4f4f4; text-indent: 20px; font-size: 14px; font-weight: normal; padding: 0; border: 0; border-radius: 3px;}
	#nabyWrap .joinArea ul.joinForm > li > input[name=passwd] {width: 49%;}
	#nabyWrap .joinArea ul.joinForm > li > input[name=repasswd] {width: 50%;}
	#nabyWrap .joinArea ul.joinForm > li.agree {height: 30px; min-height: 30px; line-height: 30px; padding: 5px 0;}
	#nabyWrap .joinArea ul.joinForm > li > p.errMsg {display: none; width: 100%; height: 20px; line-height: 2px; text-align: center; font-size: 12px; font-weight: bold; color: #777;}
	#nabyWrap .joinArea ul.joinForm > li > span.privateView > a {color: #ca0114; padding-left: 20px;}
	#nabyWrap .joinArea #joinSubmit,
	#nabyWrap .joinArea #editSubmit {display: block; width: 400px; margin: 0 50px; height: 50px; margin-top: 20px; margin-bottom: 20px; text-align: center; font-size: 18px; font-weight: bold; color: #fff; background-color: #ca0114; line-height: 50px; text-decoration: none; border-radius: 3px;}
	#nabyWrap .joinArea #joinSubmit:hover,
	#nabyWrap .joinArea #editSubmit:hover {background-color: #a20110;}
	#nabyWrap .joinArea .nabyLeave {width: 400px; min-height: 30px; margin: 20px 50px 0; text-align: center; padding-top: 19px; border-top: 1px #ddd dashed; font-size: 12px;}
	@media screen and (max-width: 640px) {
		#nabyWrap .joinArea {margin-left: -150px; width: 300px;}
		#nabyWrap .joinArea > .joinTitle {width: 260px; margin: 0 20px;}
		#nabyWrap .joinArea ul.joinForm {width: 260px; padding: 0 20px;}
		#nabyWrap .joinArea ul.joinForm > li > input[name=passwd],
		#nabyWrap .joinArea ul.joinForm > li > input[name=repasswd] {width: 100%;}
		#nabyWrap .joinArea ul.joinForm > li > input[name=repasswd] {margin-top: 5px;}
		#nabyWrap .joinArea ul.joinForm > li.agree:last-child {padding-bottom: 10px;}
		#nabyWrap .joinArea #joinSubmit,
		#nabyWrap .joinArea #editSubmit {width: 260px; margin: 0 20px;}
		#nabyWrap .joinArea .nabyLeave {width: 260px; min-height: 30px; margin: 20px 20px 0;}
	}
	/* Membership Join End */

	/* Membership Welcome or Goodbye Start */
	#nabyWrap .nabyMembershipMessgeArea {position: absolute; top: 50%; left: 50%; margin-top: -150px; margin-left: -250px; width: 500px; min-height: 300px; background-color: #fff; border: 1px #e9e9e9 solid; border-radius: 5px;}
	#nabyWrap .nabyMembershipMessgeArea > .MessgeTitle {width: 400px; height: 80px; margin: 0 50px; padding: 50px 0 10px;}
	#nabyWrap .nabyMembershipMessgeArea > .MessgeTitle > h2 {font-size: 36px; font-weight: bold; color: #ca0114; text-align: center; line-height: 50px;}
	#nabyWrap .nabyMembershipMessgeArea > .MessgeTitle > p {font-size: 12px; font-weight: bold; color: #666; text-align: center; line-height: 30px;}
	#nabyWrap .nabyMembershipMessgeArea > .MessgeBody {height: 50px; padding: 60px 0 50px;}
	#nabyWrap .nabyMembershipMessgeArea > .MessgeBody > a {display: block; width: 400px; margin: 0 50px; height: 50px; text-align: center; font-size: 18px; font-weight: bold; color: #fff; background-color: #ca0114; line-height: 50px; text-decoration: none; border-radius: 3px;}
	#nabyWrap .nabyMembershipMessgeArea > .MessgeBody > a:hover {background-color: #a20110;}
	@media screen and (max-width: 640px) {
		#nabyWrap .nabyMembershipMessgeArea  {margin-left: -150px; width: 300px;}
		#nabyWrap .nabyMembershipMessgeArea  > .MessgeTitle {width: 240px; margin: 0 30px;}
		#nabyWrap .nabyMembershipMessgeArea  > .MessgeBody > a {width: 240px; margin: 0 30px;}
	}
	/* Membership Welcome or Goodbye End */


	/* Private Agreement Start */
	#nabyWrap .agreementWrap {width: 100%; padding: 50px 0;}
	#nabyWrap .agreementWrap > h2 {padding-bottom: 40px; font-size: 24px; font-weight: bold; color: #333; text-align: center;}
	#nabyWrap .agreementWrap > .agreementArea {width: 90%; max-width: 1080px; margin: 0 auto 50px; padding: 50px; text-align: justify; background-color: #f9f9f9; border: 1px #ddd solid;}
	#nabyWrap .agreementWrap > .agreementArea > h3 {padding-bottom: 40px; font-size: 20px; font-weight: bold; color: #333;}
	#nabyWrap .agreementWrap > .agreementArea > h4 {padding-bottom: 20px; font-size: 16px; font-weight: bold; color: #333;}
	#nabyWrap .agreementWrap > .agreementArea > p {padding-bottom: 20px; font-size: 12px; font-weight: normal; color: #666;}
	@media screen and (max-width: 1280px) {
		#nabyWrap .agreementWrap > .agreementArea {width: 90%; max-width: 760px; margin: 0 auto 50px; padding: 50px; text-align: justify; background-color: #f9f9f9; border: 1px #ddd solid;}
	}
	@media screen and (max-width: 960px) {
		#nabyWrap .agreementWrap > .agreementArea {width: 90%; max-width: 440px; margin: 0 auto 50px; padding: 50px; text-align: justify; background-color: #f9f9f9; border: 1px #ddd solid;}
	}
	@media screen and (max-width: 640px) {
		#nabyWrap .agreementWrap {width: 100%; padding: 20px 0;}
		#nabyWrap .agreementWrap > .agreementArea {width: 90%; max-width:260px; margin: 0 auto 30px; padding: 20px; text-align: justify; background-color: #f9f9f9; border: 1px #ddd solid;}
	}
	/* Private Agreement End */

	/* naby Popup for User Start */
	.nabyPopupLayer {position: fixed; display: block; z-index: 102; box-shadow: 0 0 7px #666; border-radius: 5px; overflow: hidden;}
	.nabyPopupLayer > form > .close {position: absolute; display: block; top: 15px; right: 20px; width: 20px; height: 20px; padding: 0; margin: 0; background-image: url('../img/popupCloseGray.png');}
	.nabyPopupLayer > form > .headArea {float: left; width: 100%; height: 50px; box-sizing: border-box; padding: 5px 50px 5px 20px; background-color: #464a55; border-radius: 5px 5px 0 0;}
	.nabyPopupLayer > form > .headArea > h2 {width: auto; height: 20px; padding: 10px 30px 10px 0; font-size: 14px; font-weight: bold; color: #fff; line-height: 20px; text-align: left; white-space: nowrap; overflow: hidden;}
	.nabyPopupLayer > form > .bodyArea {float: left; width: 100%; padding: 0; margin: 0; background-color: #fff;}
	.nabyPopupLayer > form > .bottomArea {float: left; width: 100%; height: 50px; box-sizing: border-box; padding: 9px 0 10px; text-align: center; background-color: #222; border-radius: 0 0 5px 5px; border-top: 1px #444 dashed;}
	.nabyPopupLayer > form > .bottomArea p {display: block; height: 22px; line-height: 22px; font-size: 12px; font-weight: bold; color: #999; text-align: center; padding: 4px 5px; vertical-align: middle;}
	/* naby Popup for User End */


	/* for Smart Editor 2016.10.12 */
	#smartEditorArea > dl,
	#smartEditorArea > dt,
	#smartEditorArea > dd,
	#smartEditorArea > ul,
	#smartEditorArea > ol,
	#smartEditorArea > li,
	#smartEditorArea > p {list-style : none; vertical-align : middle; letter-spacing : 0; line-height: normal !important;}


