@charset "utf-8";
@import url(/pub/board/ckEditor/build/nabyCommonCK.css);
#nabyWrap {position: relative; width: 100%; padding: 0; margin: 0;}

/* Privacy Start */
#privacyArea {position: relative; display: block; width: 100%;}
#privacyArea p.privacyEngTitle {width: 100%; height: 30px; padding: 0; line-height: 30px; font-size: 28px; font-weight: 700; text-align: left; letter-spacing: -1px; color: #222;}
#privacyArea p.privacyGuideComment {width: 100%; height: 30px; padding: 0; line-height: 30px; font-size: 15px; font-weight: 300; text-align: left; letter-spacing: -0.5px; color: #666;}
#privacyArea .privacyAgreeArea {display: block; margin: 20px auto 0; width: 100%; height: auto; box-sizing: border-box; padding: 39px; border: 1px #eee solid; background-color: #fcfcfc; transition: all 0.3s;}
#privacyArea .privacyAgreeArea > p {width: 100%; height: auto; padding: 0; line-height: 1.64em; font-size: 15px; font-weight: 300; text-align: left; letter-spacing: -0.5px; color: #666;}
#privacyArea .privacyAgreeArea > h6 {line-height: 20px; font-size: 15px; font-weight: 400; color: #222; padding: 0; margin-top: 20px;}
#privacyArea .privacyAgreeArea > ul {}
#privacyArea .privacyAgreeArea > ul > li {list-style: decimal inside; font-size: 13px; color: #666;}

#privacyArea .privacyAgreddChk {display: block; margin: 20px auto; width: 140px; height: auto; text-align: center;}
#privacyArea .privacyAgreddChk > label {padding-right: 10px; line-height: 30px; font-size: 16px; font-weight: 500; color: #222;}

/* #agree {position: absolute;	opacity: 0.3; top: -4px; left: -4px; width: 22px; height: 22px;} */

@media screen and (max-width: 1220px) {
}
@media screen and (max-width: 980px) {
}
@media screen and (max-width: 660px) {
	#privacyArea  p.privacyEngTitle {height: auto; line-height: 1.2em; font-size: 24px;}
	#privacyArea  p.privacyGuideComment {height: 20px; line-height: 20px; font-size: 13px;}
	#privacyArea  .privacyAgreeArea {padding: 19px;}
	#privacyArea  .privacyAgreeArea > p {font-size: 13px;}
	#privacyArea  .privacyAgreeArea > h6 {font-size: 14px;}
	#privacyArea  .privacyAgreeArea > ul {}
	#privacyArea  .privacyAgreeArea > ul > li {font-size: 11px;}
}
@media screen and (max-width: 420px) {
}
/* Privacy End */


/* List Start */
.listArea {width: 100%; box-sizing: border-box; padding: 0; margin: 20px auto;}
.listArea > ul.listLine {width: 100%; padding: 0; margin: 0; border-bottom: 1px #e9e9e9 solid;}
.listArea > ul.listLine > li {width: 100%; padding: 20px 0; border-top: 1px #e9e9e9 solid; list-style: none; background-color: #fff;}
.listArea > ul.listLine > li.tHead {background-color: #f9f9f9;}
.listArea > ul.listLine > li.tHead > * {font-weight: bold; color: #333;}
.listArea > ul.listLine > li > * {color: #666;}
.listArea > ul.listLine > li > ul.listUnit {width: 100%;}
.listArea > ul.listLine > li > ul.listUnit > li {float: left; line-height: 1.5em; list-style: none;}
.listArea > ul.listLine > li > ul.listUnit > li.num {width: 10%; text-align: center;}
.listArea > ul.listLine > li > ul.listUnit > li.title {width: 65%; text-align: left; color: #333;}
.listArea > ul.listLine > li > ul.listUnit > li.title > span.replyCount {font-size: 12px; color: #666; margin-left: 5px;}
.listArea > ul.listLine > li > ul.listUnit > li.title > img.iconListType {width: 18px; height: 18px; vertical-align: middle; padding: 0 1px 1px; line-height: 1.5em; margin-left: 5px;}
/* 관리자 화면에서 리스트를 위해 */
img.iconListType {width: 18px; height: 18px; vertical-align: middle; padding: 0 1px 1px; line-height: 1.5em; margin-left: 5px;}

.listArea > ul.listLine > li > ul.listUnit > li.info {width: 25%; text-align: center;}
.listArea > ul.listLine > li.tHead > ul.listUnit > li.info > span {float: left; display: block; font-size: 14px;}
.listArea > ul.listLine > li > ul.listUnit > li.info > span {float: left; display: block; font-size: 12px;}
.listArea > ul.listLine > li > ul.listUnit > li.info > span.writer {width: 40%; text-align: center;}
.listArea > ul.listLine > li > ul.listUnit > li.info > span.regDate {width: 30%; text-align: center;}
.listArea > ul.listLine > li > ul.listUnit > li.info > span.view {width: 30%; text-align: center;}

.countNsearch {width: 100%; height: 30px; box-sizing: border-box; padding: 0; margin: 20px auto 10px;}
.countNsearch > p {float: left; display: block; line-height: 30px; font-size: 14px; font-weight: bold; color: #333;}
.countNsearch > p > span {line-height: 30px; font-size: 12px; font-weight: normal; color: #999;}
.countNsearch > .searchArea {position: relative; float: right; display: block; line-height: 30px; font-size: 12px; font-weight: bold; color: #333;}
.countNsearch > .searchArea > form > span {padding-right: 30px;}
.countNsearch > .searchArea > form > label {display: none;}
.countNsearch > .searchArea > form > .errMsg  {position: absolute; top: 30px; right: 0px; display: none; width: 280px; height: 30px; line-height: 30px; font-size: 12px; font-weight: normal; color: #F16A54;}

@media screen and (min-width: 1280px) {
	.listArea,
	.countNsearch {max-width: 1280px;}
}

@media screen and (min-width: 960px) and (max-width: 1279px) {
}

@media screen and (min-width: 640px) and (max-width: 959px) {
	.listArea > ul.listLine > li > ul.listUnit > li.title {width: 90%; text-align: left; color: #333;}
	.listArea > ul.listLine > li.tHead > ul.listUnit > li.info {display: none;}
	.listArea > ul.listLine > li > ul.listUnit > li.info {width: 90%; padding-left: 10%; padding-top: 10px;}
	.listArea > ul.listLine > li > ul.listUnit > li.info > span {float: left; display: block; font-size: 12px; padding-right: 20px;}
	.listArea > ul.listLine > li > ul.listUnit > li.info > span.writer {width: auto; text-align: left;}
	.listArea > ul.listLine > li > ul.listUnit > li.info > span.regDate {width: auto; text-align: left;}
	.listArea > ul.listLine > li > ul.listUnit > li.info > span.view {width: auto; text-align: left;}
}

@media screen and (min-width: 0) and (max-width: 639px) {
	.listArea {width: 100%; min-width: 260px; box-sizing: border-box; padding: 0; margin: 20px auto;}
	.listArea > ul.listLine > li.tHead {display: none;}
	.listArea > ul.listLine > li > ul.listUnit > li.num {display: none;}
	.listArea > ul.listLine > li > ul.listUnit > li.title {width: 100%; text-align: left; color: #333;}
	.listArea > ul.listLine > li.tHead > ul.listUnit > li.info {display: none;}
	.listArea > ul.listLine > li > ul.listUnit > li.info {width: 100%; padding-top: 10px;}
	.listArea > ul.listLine > li > ul.listUnit > li.info > span {float: left; display: block; font-size: 12px; padding-right: 20px;}
	.listArea > ul.listLine > li > ul.listUnit > li.info > span.writer {width: auto; text-align: left;}
	.listArea > ul.listLine > li > ul.listUnit > li.info > span.regDate {width: auto; text-align: left;}
	.listArea > ul.listLine > li > ul.listUnit > li.info > span.view {width: auto; text-align: left;}
	
	.countNsearch {width: 100%; min-width: 260px; height: 70px; box-sizing: border-box; padding: 0; margin: 20px auto 10px;}
	.countNsearch > p {width: 100%; line-height: 30px; font-size: 14px; font-weight: bold; color: #333; padding-bottom: 10px;}
	.countNsearch > p > span {line-height: 30px; font-size: 12px; font-weight: normal; color: #999;}
	.countNsearch > .searchArea {position: relative; width: 100%; line-height: 30px; font-size: 12px; font-weight: bold; color: #333;}
	.countNsearch > .searchArea > form > label {display: none;}
	.countNsearch > .searchArea > form > .errMsg  {position: absolute; top: 30px; left: 0px; display: none; width: 280px; height: 30px; line-height: 30px; font-size: 12px; font-weight: normal; color: #F16A54;}

}
/* List End */


/* Write & Edit 공통 Start */
.writeArea {width: 100%; min-width: 260px; box-sizing: border-box; padding: 0; margin: 20px auto;}
.writeArea > form > ul.writeLine {width: 100%; padding: 10px 0; margin: 0; border-top: 1px #e9e9e9 solid; border-bottom: 1px #e9e9e9 solid;}
.writeArea > form > ul.writeLine > li {float: left; width: 100%; padding: 5px 0; margin: 0 auto; list-style: none; text-align: center;}
.writeArea > form > ul.writeLine > li > label {display: block; padding-left: 10px; font-weight: bold; color: #333; line-height: 26px; text-align: left; font-size: 13px;}
.writeArea > form > ul.writeLine > li input,
.writeArea > form > ul.writeLine > li select,
.writeArea > form > ul.writeLine > li textarea {width: 100%; box-sizing: border-box; margin: 0 auto;}
.writeArea > form > ul.writeLine > li #title {line-height: 40px; height: 40px;}
.writeArea > form > ul.writeLine > li #subTitle {line-height: 1.5em; height: 50px; padding-top: 10px;}
.writeArea > form > ul.writeLine > li > ul.infoUnit {width: 100%; margin: 0 auto;}
.writeArea > form > ul.writeLine > li > ul.infoUnit > li {float: left;}
.writeArea > form > ul.writeLine > li > ul.infoUnit > li.name {width: 20%; box-sizing: border-box; padding-right: 10px;}
.writeArea > form > ul.writeLine > li > ul.infoUnit > li.email {width: 40%; box-sizing: border-box; padding-right: 10px;}
.writeArea > form > ul.writeLine > li > ul.infoUnit > li.phone {width: 40%; padding-right: 0;}
.writeArea > form > ul.writeLine > li > ul.infoUnit > li.phone > input[name=phone01] {float: left; width: 30%; margin-left: 0;}
.writeArea > form > ul.writeLine > li > ul.infoUnit > li.phone > input[name=phone02] {float: left; width: 34%; margin-left: 1%;}
.writeArea > form > ul.writeLine > li > ul.infoUnit > li.phone > input[name=phone03] {float: left; width: 34%; margin-left: 1%;}
/*
.writeArea > form > ul.writeLine > li > ul.infoUnit > li.passwd {width: 28%; padding-right: 2%;}
.writeArea > form > ul.writeLine > li > ul.infoUnit > li.secret {width: 10%; padding-right: 0%;}
*/
.writeArea > form > ul.writeLine > li > ul.infoUnit > li > label {display: block; width: auto; padding-left: 6px; font-weight: bold; color: #333; line-height: 26px; text-align: left; font-size: 13px;}
.writeArea > form > ul.writeLine > li.iframeEditors {width: 100%; box-sizing: border-box; padding: 20px 0 5px; text-align: center; margin: 0 auto;}
.writeArea > form > ul.writeLine > li > ul.upFile {width: 100%; box-sizing: border-box; padding-left: 10px; padding-bottom: 10px; text-align: left;}
.writeArea > form > ul.writeLine > li > ul.upFile > li {float: left; width: 100%; padding-bottom: 10px;}
.writeArea > form > ul.writeLine > li > ul.upFile > li > label {float: left; width: 80px;}
.writeArea > form > ul.writeLine > li > ul.upFile > li > div {float: left; width: auto; line-height: 30px; margin-left: 20px; margin-right: 10px;}
.writeArea > form > ul.writeLine > li > ul.additionalFile {width: 100%; box-sizing: border-box; padding-left: 10px; padding-bottom: 10px; text-align: left;}
.writeArea > form > ul.writeLine > li > ul.additionalFile > li {float: left; padding-left: 10px; list-style: disc inside;}
.writeArea > form > ul.writeLine > li > ul.additionalFile > li > a {font-size: 12px; color: #444; line-height: 1.5em;}
.writeArea > form > ul.writeLine > li > ul.additionalFile > li > a > img {vertical-align: middle;}

@media screen and (min-width: 1280px) {
}

@media screen and (min-width: 960px) and (max-width: 1279px) {
}

@media screen and (min-width: 640px) and (max-width: 959px) {
	.writeArea > form > ul.writeLine > li > ul.infoUnit > li.name {width: 50%; box-sizing: border-box; padding: 0 10px 0 0;}
	.writeArea > form > ul.writeLine > li > ul.infoUnit > li.email {width: 50%; box-sizing: border-box; padding: 0 0 0 10px;}
	.writeArea > form > ul.writeLine > li > ul.infoUnit > li.phone {width: 50%; box-sizing: border-box; padding: 0 10px 0 0;}
	/*
	.writeArea > form > ul.writeLine > li > ul.infoUnit > li.passwd {width: 49%; padding: 0 1% 0 0;}
	.writeArea > form > ul.writeLine > li > ul.infoUnit > li.secret {width: 10%; padding: 0 0 0 1%;}
	*/
}
@media screen and (min-width: 0) and (max-width: 639px) {
	.writeArea > form > ul.writeLine > li > ul.infoUnit > li.name {width: 100%; box-sizing: border-box; padding: 0;}
	.writeArea > form > ul.writeLine > li > ul.infoUnit > li.email {width: 100%; box-sizing: border-box; padding: 0;}
	.writeArea > form > ul.writeLine > li > ul.infoUnit > li.phone {width: 100%; box-sizing: border-box; padding: 0;}
	/*
	.writeArea > form > ul.writeLine > li > ul.infoUnit > li.passwd {width: 99%; padding: 0;}
	.writeArea > form > ul.writeLine > li > ul.infoUnit > li.secret {width: auto; padding: 0;}
	*/

}
/* Write End */


/* Read 공통 Start */
.readArea {width: 100%; min-width: 260px; box-sizing: border-box; padding: 20px 0; margin: 0 auto;}
.readArea > .titleArea {padding: 20px 0; border-top: 1px #e9e9e9 solid; }
.readArea > .titleArea > h3 {font-size: 26px; font-weight: normal; color: #333; line-height: 1.2em;}
.readArea > .titleArea > h4.subTitle {font-size: 18px; font-weight: normal; color: #555; line-height: 1.5em; padding-top: 20px;}

.readArea > ul.infoArea {padding: 30px 0;}
.readArea > ul.infoArea > li {list-style: none; font-size: 12px; color: #777; line-height: 20px;}

.readArea > .contentArea {padding: 0px 0px 0px; border-bottom: 1px #e9e9e9 solid;}
.readArea > .contentArea > .smartEditorArea{margin: 0px 0; padding: 50px 0;}
.readArea > .contentArea > ul.imgFile {margin: 0px 0; padding: 50px 0; border-top: 1px #e9e9e9 dashed;}
.readArea > .contentArea > .youtubeArea {margin: 0px 0; padding: 50px 0; border-top: 1px #e9e9e9 dashed;}
.readArea > .contentArea > dl.additional {margin: 0px 0; padding: 50px 0 50px; border-top: 1px #e9e9e9 dashed;}
.readArea > .contentArea > dl.additional > dt {font-size: 14px; font-weight: bold; color: #e74a2e; padding-top: 20px;}
.readArea > .contentArea > dl.additional > dt:first-child {padding-top: 0;}
.readArea > .contentArea > dl.additional > dd > a {font-size: 12px; font-weight: normal; color: #444;}
.readArea > .contentArea > dl.additional > dd {font-size: 12px; color: #777;}
.readArea > .contentArea > dl.additional > dd {list-style: disc inside; text-indent: 10px;}

.readArea > .contentArea > .youtubeArea > .youtubeUCC {position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden;}
.readArea > .contentArea > .youtubeArea > .youtubeUCC iframe,
.readArea > .contentArea > .youtubeArea > .youtubeUCC object,
.readArea > .contentArea > .youtubeArea > .youtubeUCC embed {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}

.readArea > .contentArea > dl.answerArea {width: 100%; border-top: 1px #e9e9e9 dashed; padding: 50px 0 50px; margin-bottom: 30px;}
.readArea > .contentArea > dl.answerArea > dt {height: 40px; line-height: 40px; font-size: 14px; font-weight: bold; color: #333;}
.readArea > .contentArea > dl.answerArea > dt > img.iconAnswerType {width: 30px; height: 30px; vertical-align: middle; padding: 5px 10px 5px 0; line-height: 40px;}
.readArea > .contentArea > dl.answerArea > dd {font-size: 12px; color: #777; background-color: #f9f9f9; padding: 2%; margin-top: 10px;}

.readArea > .contentArea > .replyArea {padding: 50px 0; border-top: 1px #e9e9e9 dashed;}

@media screen and (min-width: 1280px) {
}

@media screen and (min-width: 960px) and (max-width: 1279px) {
}

@media screen and (min-width: 640px) and (max-width: 959px) {
}

@media screen and (min-width: 0) and (max-width: 639px) {
}
/* Read End */



/* unset */
#unset dl, #unset dt, #unset dd, #unset ul, #unset ul li, #unset li, #unset ol, #unset ol li, #unset p {
	list-style: initial;
	line-height: initial;
	/* font-size: initial; */
	margin: unset;
	padding: revert;
}
#unset ol, #unset ol li {
	list-style:  decimal;
}

/*.wirteArea #unset *,
.readArea #unset * {font-size: initial;}
*/
.wirteArea #unset table,
.wirteArea #unset table tbody th,
.wirteArea #unset table tbody td {border: revert; background-color: inherit;}
#unset table tbody td {background-color: inherit;}
.readArea #unset table {border-collapse: collapse;  border: 1px solid #bfbfbf;}
.readArea #unset table tbody th,
.readArea #unset table tbody td { border: 1px solid  #bfbfbf; padding: .4em;}