@charset "utf-8";
/*  텍스트 말줄임  */
span.productName, span.modelName, h3.productName, .TextOverflowCutting {
	white-space:nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}

/*  푬관련  */
input, textarea:not([class*="webnote"]) {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}
input[type=text],input[type=password] {
	padding: 3px;
	color: #666;
	border: 1px solid #ccc;
}
input[type=file] {
	padding: 3px;
	cursor: pointer;
}
select {
	padding:3px;
	color: #666;
	border: 1px solid #ccc;
}
textarea {
	padding: 4px;
	color: #666;
	border: 1px solid #ccc;
}
button {
	background: none;
	border: none;
	padding: 0;
	font-size:inherit;
	font-family:'Nanum Gothic';
	cursor: pointer;
}
button::-moz-focus-inner,
input::-moz-focus-inner {
    border: 0;
    padding: 0;
}
/* ----------------------------------------------------------- */
/* ----------------- 마우스오버시 이미지확대 ----------------- */
/* ----------------------------------------------------------- */
.overZoomImg {
	display: block;
	-webkit-transform: scale(1);
 	-moz-transform: scale(1);
 	-ms-transform: scale(1);
 	-o-transform: scale(1);
 	transform: scale(1);

 	-webkit-transition: all 0.3s ease-in-out; /*부드러운 모션을 위해 추가*/
 	-moz-transition: all 0.3s ease-in-out;
 	transition: all 0.3s ease-in-out;
}
.overZoomImg:hover {
	-webkit-transform: scale(1.2);
  	-moz-transform: scale(1.2);
 	-ms-transform: scale(1.2);
 	-o-transform: scale(1.2);
 	transform: scale(1.2);
}
/* ----------------------------------------------------------- */
/* --------------------- 날짜 아이콘 ------------------------- */
/* ----------------------------------------------------------- */
.ui-datepicker-trigger {
	padding-left: 5px;
	cursor: pointer;
}
/* ----------------------------------------------------------- */
/* --------------------- INPUT STYLE ------------------------- */
/* ----------------------------------------------------------- */
span.inputWrap {
	display: block;
	border: 3px solid #ccc;
	padding: 5px;
}
input.borderNone {
	font-size: 1.2em;
	border: none;
}
select.borderNone {
	font-size: 1.2em;
	border: none;
}
/* ----------------------------------------------------------- */
/* --------------------------- BASE -------------------------- */
/* ----------------------------------------------------------- */
.displayBlock {
	display: block;
	width: 100%;
	height: 100%;	
}
.fullWidth {
	width: 100%;
}
.halfWidth {
	width: 50%;
}
.thertyWidth {
	width: 30%;
}
.autoWidth {
	width: auto;
}
.return {
	display: block;
}
.bold {
	font-weight: bold;
}
.baseColor {
	color: #FF0000;
}
.orangeColor {
	color: #FF6600;
}
.blueColor {
	color: #09C;
}
.greenColor {
	color: #690;
}
.purpleColor {
	color: #FF3366;
}
.grayColor333 {
	color: #333;
}
.grayColor666 {
	color: #666;
}
.grayColor999 {
	color: #999;
}
.grayColorccc {
	color: #ccc;
}
.blackColor {
	color: #000;
}
.whiteColor {
	color: #fff;
}
.redBgBut {
	background: #ff0000;
}
.blueBgBut {
	background: #2fb6bc;
}
.purpleBgBut {
	background: #FF3366;
}
.grayBgBut333 {
	background: #333;
}
.grayBgBut666 {
	background: #666;
}
.grayBgBut999 {
	background: #999;
}
.grayBgButccc {
	background: #ccc;
}
.blackBgBut {
	background: #000;
}
.greenBgBut {
	background: #66CC00;
}
.orangeBgBut {
	background: #FF6600;
}
.privateColor {
	color: #0066CC;
	font-weight: bold;
}
.privateColor:hover {
	color: #FF3300;
}
.center {
	text-align: center;
}
.left {
	text-align: justify;
}
.right {
	text-align: right;
}
/* ------------------------ 더보기 ---------------------- */
p.moreView {
	margin: 0;
	margin-top: 10px;
	position: relative;
	border-radius: 3px;
	background: #666;
	behavior: url(../scripts/PIE.htc);
}
p.moreView a{
	display: block;
	width: 100%;
	height: 100%;
	line-height: 3;
	text-align: center;
	color: #fff;
}
p.moreView a span.moreViewBut{
	padding-left: 15px;
	background: url(../images/info_plus.gif) no-repeat 0 center;
}
/* ------------------------ butList ---------------------- */
ul.butList{
	margin: 0 auto;
	margin-bottom: 10px;
}
ul.butList > li{
	float: left;	
}
.liBut{
	line-height: 2.5;
	color: #fff;
	font-size: 1.2em;
	font-weight: bold;
	text-align: center;
}
.listBut{
	background: #2fb6bc;
}
.listBut:hover{
	background: #0099CC;
}
.writeBut{
	background: #FF3366;
}
.writeBut:hover{
	background: #ff0042;
}
.modifyBut {
	background: #66CC00;
}
.modifyBut:hover{
	background: #669900;
}
.replyWriteBut{
	background: #FF6600;
}
.replyWriteBut:hover{
	background: #FF3300;
}
.deleteBut{
	background: #A3ABDC;
}
.deleteBut:hover{
	background: #6666CC;
}
.cansleBut{
	background: #A3ABDC;
}
.cansleBut:hover{
	background: #6666CC;
}
/* ------------------------ singleBut ---------------------- */
.but{
	padding: 4.5px 0;
	font-weight: bold;
	text-align: center;
	border-radius: 3px;
	vertical-align: middle;
	behavior: url(../scripts/PIE.htc);
}
.butInline{
	padding: 4.5px 10px;
}
.butWhite{
	color: #999;
	background: #fff;
	border: 1px solid #ccc;
}
.butWhite:hover{
	color: #FF6600;
	border: 1px solid #FF6600;
}
.butGray{
	color: #fff;
	background: #666;
	border: 1px solid #333;
}
.butGray:hover{
	background: #333;
	border: 1px solid #000;
}
.butBlue{
	color: #fff;
	background: #0099FF;
	border: 1px solid #0066CC;
}
.butBlue:hover{
	background: #0066CC;
	border: 1px solid #333;
}
.butGreen{
	color: #fff;
	background: #669900;
	border: 1px solid #6F8718;
}
.butGreen:hover{
	background: #6F8718;
	border: 1px solid #333;
}
.butOrange{
	color: #fff;
	background: #FF9900;
	border: 1px solid #FF6600;
}
.butOrange:hover{
	background: #FF6600;
	border: 1px solid #FF0000;
}
.butpurple {
	color: #fff;
	background: #FF3366;
	border: 1px solid #FF0042;
}
.butpurple:hover {
	background: #FF0042;
	border: 1px solid #CC0022;
}

/* -------------- 기본버튼 ---------------- */
.btn_default {
	display: inline-block;
	padding: .4em .4em .2em .4em;
	border-radius: .3em;
	box-sizing: content-box;
	-moz-box-sizing: content-box;
	background: transparent;
	outline: 0;
	vertical-align: middle;
	font-family: inherit;
	font-size: 12px;
	text-decoration: none;
	white-space: nowrap;
	cursor: pointer;
	user-select: none;
	border: 1px solid #AAAAAA;
	letter-spacing: 1px;
}
.btn_default,
.btn_default:link,
.btn_default:visited {
	color: #000!important;
	background: #EFEFEF;
}

.btn_default:focus,
.btn_default:hover {
	background: #C0BDBD;
	color: #FFF!important;
}

.btn_default:active,
.btn_default.active {
	background: #3B6BB4;
}
/* -------------- 확인버튼 ---------------- */
.confirmBut{
	padding: 10px 0;
	font-size: 1.2em;
	font-weight: bold;
	text-align: center;
	color: #fff;
	border-radius: 3px;
	background: #0099FF;
	border: 1px solid #0066CC;
	behavior: url(../scripts/PIE.htc);
}
.confirmBut:hover{
	background: #0066CC;
	border: 1px solid #333;
}
/* -------------- 로그인버튼 ---------------- */
.loginBut{
	padding: 10px 0;
	font-size: 1.2em;
	font-weight: bold;
	text-align: center;
	color: #fff;
	background: #666;
	border-radius: 3px;
	border: 1px solid #333;
	behavior: url(../scripts/PIE.htc);
}
.loginBut:hover{
	background: #333;
	border: 1px solid #000;
}
/* -------------- 중복체크버튼 ---------------- */
.doubleChkBut{
	padding: 5px 10px;
	font-weight: bold;
	text-align: center;
	border-radius: 3px;
	color: #fff;
	vertical-align: middle;
	background: #666;
	border: 1px solid #333;
	behavior: url(../scripts/PIE.htc);
}
.doubleChkBut:hover{
	background: #333;
	border: 1px solid #000;
}
/* -------------- 우편번호찾기버튼 ---------------- */
.zipSearchBut{
	padding: 5px 10px;
	font-weight: bold;
	text-align: center;
	border-radius: 3px;
	color: #fff;
	vertical-align: middle;
	background: #666;
	border: 1px solid #333;
	behavior: url(../scripts/PIE.htc);
}
.zipSearchBut:hover{
	background: #333;
	border: 1px solid #000;
}
/* ------------  작은 동그라미 숫자버튼 영역  ----------- */
.btnNum {
	display:block;
	width:18px;
	height:18px;
	line-height:1.3;
	color:#FFF;
	border-radius: 18px;
}
/* --- 다음주소 팝업-----*/
#zip_layer{
	display:none;
	border:5px solid;
	position:fixed;
	width:300px;
	height:460px;
	left:50%;
	margin-left:-155px;
	top:50%;
	margin-top:-235px;
	overflow:hidden;-webkit-overflow-scrolling:touch;
	z-index:1000;
}
#btnCloseLayer{
	cursor:pointer;
	position:absolute;
	right:-3px;
	top:-3px;
	z-index:1;
}

/* 게시판 비밀글/답변글/새글 아이콘 및 댓글삭제/쓰기버튼 , 파일선택버튼, 이전/다음버튼, 로그인버튼 */
.noticeIcon{
	padding: 2px 5px;
	font-size: 0.9em;
	color: #fff;
	border-radius: 3px;
	background: #0099CC;
	behavior: url(../scripts/PIE.htc);
}
.imgDeleteIcon{
	padding: 2px 5px;
	font-size: 0.9em;
	color: #fff;
	border-radius: 3px;
	background: #666;
	behavior: url(../scripts/PIE.htc);
}
.newIcon{
	padding: 2px 5px;
	font-size: 0.9em;
	color: #fff;
	border-radius: 3px;
	background: #339900;
	behavior: url(../scripts/PIE.htc);
}
.secretIcon{
	padding: 2px 5px;
	font-size: 0.9em;
	color: #fff;
	border-radius: 3px;
	background: #FF6600;
	behavior: url(../scripts/PIE.htc);
}
.replyIcon{
	padding: 2px 5px;
	font-size: 0.9em;
	color: #fff;
	border-radius: 3px;
	background: #0099FF;
	behavior: url(../scripts/PIE.htc);
}
.questionIcon{
	padding: 2px 5px;
	font-size: 0.9em;
	color: #fff;
	border-radius: 3px;
	background: #FF6600;
	behavior: url(../scripts/PIE.htc);
}
.memoDeleteBut{
	padding: 2px 5px;
	font-size: 0.9em;
	color: #fff;
	border-radius: 3px;
	background: #666;
	border: 1px solid #333;
	behavior: url(../scripts/PIE.htc);
}
.memoDeleteBut:hover{
	background: #333;
	border: 1px solid #000;
}
.memoWriteBut{
	padding: 4px 10px;
	font-size: 0.9em;
	color: #fff;
	border-radius: 3px;
	background: #666;
	border: 1px solid #333;
	behavior: url(../scripts/PIE.htc);
}
.memoWriteBut:hover{
	background: #333;
	border: 1px solid #000;
}
.mobileMemoWriteBut{
	display: block;
	padding: 10px 0;
	font-size: 1.2em;
	color: #fff;
	border-radius: 3px;
	background: #666;
	border: 1px solid #333;
	behavior: url(../scripts/PIE.htc);
}
.mobileMemoWriteBut:hover{
	background: #333;
	border: 1px solid #000;
}
.boardMoveBut{
	padding: 5px 10px;
	font-size: 1.2em;
	font-weight: bold;
	text-align: center;
	color: #fff;
	border-radius: 3px;
	background: #666;
	border: 1px solid #333;
}
.boardMoveBut:hover{
	background: #333;
	border: 1px solid #000;
}
.confirm_key {
	padding: 4px 10px;
	font-size: 0.9em;
	color: #333;
	border-radius: 3px;
	background: #eee;
	border: 1px solid #ccc;
	behavior: url(../scripts/PIE.htc);
}

/* --------------------------- blankDiv -------------------------- */
.blankDiv {
	clear: both;
	height: 0px;
}
#LoadingIcon {
	width: 100%;
	height: 100%;
	text-align: center;
	-webkit-overflow-scrolling: touch;
}
.zoomImgWrap {
	margin-bottom: 20px;
	text-align: center;
}
.zoomImg {
	padding: 2px 5px;
	font-size: 0.9em;
	color: #fff;
	border-radius: 3px;
	background: #666;
	border: 1px solid #333;
	cursor: pointer;
}
/* --------------------------- H/P/UL -------------------------- */
h1.title {
	padding: 10px 0;
	font-size: 1.2em;
	font-weight: bold;
	color: #fff;
	margin-bottom: 20px;
	text-align: center;
	background: #666;
}
.h2Text {
	text-align: justify;
	margin-bottom: 20px;
	font-size: 1.2em;
	color: #333;
}
.h2Text li {
	margin-bottom: 5px;
	padding: 5px 0;
	padding-left: 20px;
	background: url(../images/arrow_icon.gif) no-repeat 0 9px;
}

h3.title {
	margin-bottom: 10px;
	padding: 5px 0;
	font-size: 1.8em;
	font-weight: bold;
	color: #333;
}
.h3Text {
	text-align: justify;
	margin-bottom: 20px;
	font-size: 1.2em;
	color: #333;
}
.h3Text li {
	margin-bottom: 5px;
	padding: 5px 0;
	padding-left: 20px;
	background: url(../images/arrow_icon11.gif) no-repeat 0 7px;
}
h4.title {
	margin-bottom: 10px;
	margin-left: 20px;
	padding: 5px 0;
	font-size: 1.6em;
	font-weight: bold;
	color: #333;
}
.h4Text {
	text-align: justify;
	margin-bottom: 20px;
	font-size: 1.2em;
	color: #666;
}
.h4Text li {
	margin-bottom: 5px;
	padding: 2px 0;
	padding-left: 15px;
	background: url(../images/arrow_18.gif) no-repeat 0 7px;
}
h5.title {
	margin-bottom: 10px;
	margin-left: 35px;
	padding: 5px 0;
	font-size: 1.4em;
	font-weight: bold;
	color: #333;
}
.h5Text {
	text-align: justify;
	margin-bottom: 20px;
	font-size: 1.2em;
	color: #666;
}
.h5Text li {
	margin-bottom: 5px;
	padding: 2px 0;
	padding-left: 15px;
	background: url(../images/arrow_9.gif) no-repeat 0 7px;
}
/* ----------------------------------------------------------- */
/* ----------------------- layot 영역  ---------------------- */
/* ----------------------------------------------------------- */
#header {
	visibility: hidden;
}
#visual {
	visibility: hidden;
}
#contents {
	visibility: hidden;
}
#footer {
	visibility: hidden;
}
.siteWidthLayer {
	position: relative;
	margin: 0 auto;
}
/* ----------------------------------------------------------- */
/* ----------------------- pg_css 영역  ---------------------- */
/* ----------------------------------------------------------- */
#pg_css {
	position: relative;
}
/* ------------------------ topMoveBut ---------------------- */
#topMoveBut {
	position: fixed;
	width: 51px;
	height: 47px;
	bottom: 0;
	left: 0;
	z-index: 9999;
}
/* ------------------------ searchForm ---------------------- */
#pg_css div.searchBox {
	position: relative;
	margin-bottom: 10px;
}
#pg_css div.searchBox input[type=text]{
	width: 200px;
	padding-left: 5px;
	padding-right: 5px;
}
.searchBut{
	padding: 4px 10px;
	padding-bottom: 5px;
	font-weight: bold;
	text-align: center;
	border-radius: 3px;
	color: #fff;
	background: #666;
	border: 1px solid #333;
	behavior: url(../scripts/PIE.htc);
}
.searchBut:hover{
	background: #333;
	border: 1px solid #000;
}
.reloadBut{
	padding: 4px 10px;
	padding-bottom: 5px;
	font-weight: bold;
	text-align: center;
	border-radius: 3px;
	color: #333;
	background: #fff;
	border: 1px solid #333;
	behavior: url(../scripts/PIE.htc);
}
.reloadBut:hover{
	background: #333;
	color: #fff;
	border: 1px solid #000;
}
.searchCancleBut{
	padding: 4px 10px;
	padding-bottom: 5px;
	font-weight: bold;
	text-align: center;
	border-radius: 3px;
	color: #333;
	cursor: pointer;
	background: #fff;
	border: 1px solid #ccc;
	behavior: url(../scripts/PIE.htc);
}
.searchCancleBut:hover{
	color: #fff;
	background: #FF6600;
	border: 1px solid #FF3300;
}
/* -------------------------- pageNo ----------------------- */
#pg_css .paging {
	margin-top: 20px;
	margin-bottom: 20px;
	text-align: center;
}
#pg_css .paging a {
}
#pg_css .paging span.arrow{
	padding: 5px 14px;
	font-size: 1.2em;
	font-weight: bold;
	text-align: center;
	border-radius: 3px;
	color: #999;
	background: #fff;
	border: 1px solid #ccc;
	behavior: url(../scripts/PIE.htc);
}
#pg_css .paging a span.arrow:hover{
	color: #FF6600;
	border: 1px solid #FF6600;
}
#pg_css .paging  a span.arrowTab{
	color: #fff;
	background: #666;
	border: 1px solid #333;
}
#pg_css .paging a span.arrowTab:hover{
	background: #333;
	border: 1px solid #000;
}
#pg_css .paging a span.circle{
	padding: 14px 10px;
	color: #999;
	background: url(../images/circle_bg1.png) no-repeat center center;
}
#pg_css .paging a span.circle:hover{
	color: #fff;
	font-weight: bold;
	background: url(../images/circle_bg2.png) no-repeat center center;
}
#pg_css .paging a.strong span.circle{
	color: #fff;
	font-weight: bold;
	background: url(../images/circle_bg2.png) no-repeat center center;
}
/* ------------------------ file_Upload ---------------------- */
.fileUpLoadBut{
	padding: 4px 6px;
	padding-bottom: 5px;
	font-weight: bold;
	text-align: center;
	border-radius: 3px;
	color: #fff;
	cursor: pointer;
	background: #666;
	border: 1px solid #333;
	behavior: url(../scripts/PIE.htc);
}
.fileUpLoadBut:hover{
	background: #333;
	border: 1px solid #000;
}
.imageViewBut{
	padding: 4px 6px;
	padding-bottom: 5px;
	font-weight: bold;
	text-align: center;
	border-radius: 3px;
	color: #fff;
	cursor: pointer;
	background: #00CCFF;
	border: 1px solid #0099FF;
	behavior: url(../scripts/PIE.htc);
}
.imageViewBut:hover{
	background: #0099FF;
	border: 1px solid #0066CC;
}
.imageDeleteBut{
	padding: 4px 6px;
	padding-bottom: 5px;
	font-weight: bold;
	text-align: center;
	border-radius: 3px;
	color: #fff;
	cursor: pointer;
	background: #66CC00;
	border: 1px solid #669900;
	behavior: url(../scripts/PIE.htc);
}
.imageDeleteBut:hover{
	background: #669900;
	border: 1px solid #666600;
}
input.uploadName {
	display: inline-block;
	width: 40%;
	padding: 4px 10px;  /* label의 패딩값과 일치 */
  	font-size: inherit;
  	font-family: inherit;
  	line-height: normal;
  	vertical-align: middle;
  	background-color: #f5f5f5;
  	border: 1px solid #ebebeb;
  	border-bottom-color: #e2e2e2;
  	border-radius: .25em;
  	-webkit-appearance: none; /* 네이티브 외형 감추기 */
  	-moz-appearance: none;
  	appearance: none;
}
/* ----------------------------------------------------------- */
/* ----------------------- user 영역  ------------------------ */
/* ----------------------------------------------------------- */
.borderWrap {
	margin-bottom: 20px;
	padding: 20px;
	border-radius: 5px;
	border: 1px solid #ccc;
	background: #F2F2F2;
}
.borderWrap p, .borderWrap ul {
	margin-bottom: 0px;
}
.borderWrapBN {
	margin-bottom: 20px;
	padding: 20px;
	border-radius: 5px;
	border: 1px solid #ccc;
	background: #fff;
}
.borderWrapBN p, .borderWrapBN ul {
	margin-bottom: 0px;
}
p.h2Img {
	margin-bottom: 20px;
}
span.bigSize {
	font-size: 2em;
	font-weight: bold;
}
p.h2Img img {
	border: 3px solid #ccc;
}
ul.imgList {
}
ul.imgList li {
	float: left;
}
ul.imgList li span {
	display: block;
	text-align: center;
}
ul.imgList li span.title {
	margin-top: 5px;
	font-size: 1.2em;
	font-weight: bold;
}


/* ----------------------------------------------------------- */
/* ------------------- hsp 영역 시작  ------------------------ */
/* ----------------------------------------------------------- */
.circle_question{
	padding: 14px 10px;
	color:#F00;
	font-weight: bold;
	background: url(../images/circle_bg1.png) no-repeat center center;
	cursor:pointer;
}
.circle_question:hover{
	color: #fff;
	font-weight: bold;
	background: url(../images/circle_bg2.png) no-repeat center center;
	cursor:pointer;
}
/* ----------------------------------------------------------- */
/* ------------------- hsp 영역 종료  ------------------------ */
/* ----------------------------------------------------------- */