@charset "utf-8";

/* ----------------------------------------------------------- */
/* -------------------------- RESET -------------------------- */
/* ----------------------------------------------------------- */

/* 숨김요소 */
legend, .blind, caption{
	position:absolute;
	top: -1000px;
	overflow:hidden;	
	width:0px;
	height:0px;
	font-size:0;
	line-height:0;
	z-index: 10000;
	display: none;
}

/* 요소(element) 여백 초기화  */
html, body,
div, span,
dl, dt, dd, ul, ol, li,
h1, h2, h3, h4, h5, h6,
blockquote, p, address, pre, cite,
form, fieldset, input, textarea, select,
table, th, td {
	margin:0;
	padding:0;
}

/* 제목요소 */
h1, h2, h3, h4, h5, h6 {  
	font-size:100%;   
	font-weight:normal;   
} 

/* 테두리 없애기 */
fieldset, img, abbr, acronym { 
	border:0 none;
} 

/* 목록 */
ol, ul { list-style:none; }

caption,td {
	font-weight: normal;
}

/* 텍스트 관련 요소 초기화 */
address, caption,em,cite {
	font-weight:normal;
	font-style:normal;
}
ins { text-decoration:none; }
del { text-decoration:line-through; }

/* 인용문 */
blockquote:before, blockquote:after, q:before, q:after { content:""; }
blockquote,q { quotes:"" ""; }

/* 링크요소 */
a, a:link {
	color: #666;
	text-decoration:none;
} 
a:visited {
	color:#666;
	text-decoration:none;
}
a:hover {
	color: #FF6600;
	text-decoration:none;
}
a:focus {
	color: #FF6600;
	text-decoration:none;
}
a:active {
	color: #FF6600;
	text-decoration:none;
}

/* 세로정렬  */
label, select, input, textarea{
	vertical-align: middle;
}
img {
	max-width: 100%;
	height: auto;
	vertical-align: middle;
}

/* 숨김 요소 ------------------------ */
legend, .blind, caption{
	position:absolute;
	top: -1000px;
	overflow:hidden;	
	width:0px;
	height:0px;
	font-size:0;
	line-height:0;
	z-index: 10000;
	display: none;
}

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

/*  푬관련  */
input, textarea{
  -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;
}
::-webkit-input-placeholder {color: #6CC !important;}
::-moz-placeholder {  /* Firefox 19+ */color: #6CC !important;}
:-moz-placeholder { /* Firefox 18- */color: #6CC !important;}
:-ms-input-placeholder {  color: #6CC !important;}

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;
	border-radius:3px;
}
button::-moz-focus-inner,
input::-moz-focus-inner {
    border: 0;
    padding: 0;
}

/* ----------------------------------------------------------- */
/* ----------------- 마우스오버시 이미지확대 ------------------ */
/* ----------------------------------------------------------- */
.overZoomImg {
	display: block;
 	transform: scale(1);
 	transition: all 0.3s ease-in-out;
}
.overZoomImg:hover {
 	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;
}
/* ----------------------------------------------------------- */
/* ----------------------- 사용자 정의 ----------------------- */
/* ----------------------------------------------------------- */
.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: orange;
	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;
}
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: #008080;
}
.deleteBut:hover{
	background: #006666;
}
.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;
}
.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;
}
/* -------------- 확인버튼 ---------------- */
.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;
}
.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;
}
.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;
}
.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;
}
.zipSearchBut:hover{
	background: #333;
	border: 1px solid #000;
}
/* ------------  작은 동그라미 숫자버튼 영역  ----------- */
.btnNum {
	display:block;
	width:18px;
	height:18px;
	line-height:1.3;
	color:#FFF;
	border-radius: 18px;
}
.dotCircle {
	display:block;
	width:8px;
	height:8px;
	border-radius: 8px;
}
/* --- 다음주소 팝업-----*/
#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;
}
.imgDeleteIcon{
	padding: 2px 5px;
	font-size: 0.9em;
	color: #fff;
	border-radius: 3px;
	background: #666;
}
.newIcon{
	display: inline-block;
	padding: 2px 5px;
	font-size: 0.9em;
	color: #fff;
	border-radius: 3px;
	background: #339900;
}
.secretIcon{
	padding: 2px 5px;
	font-size: 0.9em;
	color: #fff;
	border-radius: 3px;
	background: #FF6600;
}
.replyIcon{
	padding: 2px 5px;
	font-size: 0.9em;
	color: #fff;
	border-radius: 3px;
	background: #0099FF;
}
.questionIcon{
	padding: 2px 5px;
	font-size: 0.9em;
	color: #fff;
	border-radius: 3px;
	background: #FF6600;
}
.memoDeleteBut{
	padding: 2px 5px;
	font-size: 0.9em;
	color: #fff;
	border-radius: 3px;
	background: #666;
	border: 1px solid #333;
}
.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;
}
.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;
}
.mobileMemoWriteBut:hover{
	background: #333;
	border: 1px solid #000;
}
.boardMoveBut{
	background: #666;
}
.boardMoveBut:hover{
	background: #333;
}

/* --------------------------- 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-family: 'Noto Sans KR', sans-serif;
	font-size: 18px;
	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-family: 'Noto Sans KR', sans-serif;
	font-size: 16px;
	color: #333;
}
.h3Text li {
	margin-bottom: 5px;
	padding: 5px 0;
	padding-left: 20px;
	background: url(../images/arrow_icon11.gif) no-repeat 0 11px;
}
h4.title {
	margin-bottom: 10px;
	padding: 5px 0;
	font-size: 1.6em;
	font-weight: bold;
	color: #669900;
}
.h4Text {
	text-align: justify;
	margin-bottom: 20px;
	font-family: 'Noto Sans KR', sans-serif;
	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-family: 'Noto Sans KR', sans-serif;
	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;
}