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



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


/* Privacy Start */
#privacyArea {position: relative; display: block; width: 100%;}
#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 > 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 > li {font-size: 11px;}
}
@media screen and (max-width: 420px) {
}
/* Privacy End */


/* Write & Edit 공통 Start */
#nabyWrap .writeArea {width: 100%; min-width: 260px; box-sizing: border-box; padding: 0; margin: 20px auto;}
#nabyWrap .writeArea > form > .writeTable {table-layout: fixed; width: 100%; margin: 30px auto 0; padding: 0; border-collapse: collapse; border: 0; border-top: 2px solid #222; border-bottom: 1px solid #999; font-size: 13px;}
#nabyWrap .writeArea > form > .writeTable th {font-size: 16px; font-weight: 500; color: #222;}
#nabyWrap .writeArea > form > .writeTable td,
#nabyWrap .writeArea > form > .writeTable th {box-sizing: border-box; padding: 9px; border: 1px solid #eee;}
#nabyWrap .writeArea > form > .writeTable tr:first-child th {border-top: 0;}
#nabyWrap .writeArea > form > .writeTable tbody tr:last-child th,
#nabyWrap .writeArea > form > .writeTable tbody tr:last-child td {border-bottom: 0;}
#nabyWrap .writeArea > form > .writeTable tr td:first-child,
#nabyWrap .writeArea > form > .writeTable tr th:first-child {border-left: 0;}
#nabyWrap .writeArea > form > .writeTable tr td:last-child,
#nabyWrap .writeArea > form > .writeTable tr th:last-child {border-right: 0;}

#nabyWrap .writeArea > form > .writeTable .formField {width: 100%; height: 40px; box-sizing: border-box; padding: 10px; border: 0; line-height: 20px; font-size: 16px; font-weight: 500; color: #444; background-color: #f9f9f9;}
#nabyWrap .writeArea > form > .writeTable .formField.phone-input {max-width: 120px;}
#nabyWrap .writeArea > form > .writeTable #phone01 {max-width: 120px; padding: 10px; line-height: 20px; font-size: 14px; font-weight: 500; border: 0px solid #ddd;}
#nabyWrap .writeArea > form > .writeTable #phone01:focus {font-size: 16px; font-weight: 500; padding: 8px; border: 2px solid #0060df; background-color: #FFF;} /* 포커스 시 흰색 배경 */

#nabyWrap .writeArea > form > .writeTable td label {margin-right: 10px;}
@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) {
	#nabyWrap .writeArea > form > .writeTable colgroup {display: none;}

	#nabyWrap .writeArea > form > .writeTable tbody tr:last-child th,
	#nabyWrap .writeArea > form > .writeTable tbody tr:last-child td {border-bottom: initial;}

	#nabyWrap .writeArea > form > .writeTable th,
	#nabyWrap .writeArea > form > .writeTable td {display: flex; align-items: center; width: 100%; height: 50px; text-align: left; border: 0; padding: 5px 0 4px; vertical-align: middle;}
	#nabyWrap .writeArea > form > .writeTable th {line-height: 40px; font-weight: 700; background-color: #FFF;}
	#nabyWrap .writeArea > form > .writeTable td {border-bottom: 1px solid #ddd;}
	#nabyWrap .writeArea > form > .writeTable td label {margin-right: 10px;} /* 라벨 간 간격 추가 */
	#nabyWrap .writeArea > form > .writeTable td input[type="radio"] {margin: 0;} /* 기본 여백 제거 */
	#nabyWrap .writeArea > form > .writeTable .formField.phone-input {max-width: 80px; margin-right: 10px;}

	#nabyWrap .writeArea > form > .writeTable th:before {
        content: "✔ "; /* 말머리 기호를 원하는 텍스트로 설정 */
        display: inline-block;
        margin-right: 5px; /* 말머리 기호와 텍스트 사이 간격 */
        color: #ff006a; /* 기호 색상 */
        font-weight: normal; /* 강조 효과 */
    }
	#nabyWrap .writeArea > form > .writeTable #phone01 {
		width: 80px; /* 너비 조정 */
	}
}

/* Write 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.category01 {width: 50%; box-sizing: border-box; padding-right: 10px;}
.writeArea > form > ul.writeLine > li > ul.infoUnit > li.category02 {width: 50%; box-sizing: border-box; padding-right: 10px;}


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