@charset "utf-8";
/* XEION CDN */
@import url('https://cdn.jsdelivr.net/npm/xeicon@2.3.3/xeicon.min.css');
/* Fontawesome 4.7 */
@import url('https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css');
/* Web Fonts - Play 영문폰트 */
@import url('https://fonts.googleapis.com/css2?family=Play:wght@400;700&display=swap');
/* font-family: 'Play', sans-serif; */

/* Google Icon Font : https://material.io/icons */
@import url("https://fonts.googleapis.com/icon?family=Material+Icons");
/* font-family: 'Material Icons'; */

/* Web Fonts - NoonNoo */
@font-face {
  font-family: 'NEXON Lv2 Gothic';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-04@2.1/NEXON Lv2 Gothic.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

/*  텍스트 말줄임  */
span.productName, span.modelName, h3.productName, span.productComment, p.modelName, p.productComment, p.brandName, .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;
}
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;
}

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

/* ----------------------------------------------------------- */
/* ----------------- 마우스오버시 이미지확대 ----------------- */
/* ----------------------------------------------------------- */
.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;
}
textarea.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%;
}
.thirtyWidth {
	width: 30%;
}

.seventyWidth {
	width: 70%;
}
.autoWidth {
	width: auto;
}
.return {
	display: block;
}
.bold {
	font-weight: bold;
}
.orangeColor {
	color: #FF6600;
}
.crimsonColor {
	color: crimson;
	display: block;
	font-size: 20px;
}
.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;
}
.privateColor {
	color: #000;
	font-weight: bold;
}
.privateColor:hover {
	color: #FF3300;
}
.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;
}
.center {
	text-align: center;
}
.left {
	text-align: justify;
}
.right {
	text-align: right;
}
.pointer {
	cursor:pointer;
}

/* ------------------------ 더보기 ---------------------- */
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.orderList{
	margin: 0 auto;
	margin-bottom: 10px;
}
ul.orderList > li{
	float: left;	
}
ul.butList{
	position: relative;
	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;
}
.changeBut{
	background: #FF9900;
}
.changeBut:hover{
	background: #FF6600;
}
.paymentBut{
	background: #2fb6bc;
}
.paymentBut:hover{
	background: #0099CC;
}
.companyJoinBut{
	background: #00CCFF;
}
.companyJoinBut:hover{
	background: #0099FF;
}
.individualJoinBut{
	background: #6699FF;
}
.individualJoinBut:hover{
	background: #6666FF;
}
/* ------------------------ 장바구니 PC ---------------------- */
span.Zx_Notify {
	display:block;
	position: absolute;
	width: 200px;
	padding: 30px;
	background: #fff;
	border: 1px solid #ccc;
	border-radius: 5px;
}
span.Zx_Notify span.message {
	display:block;
	margin-bottom: 20px;
	text-align: center
}
span.Zx_Notify span.cartGoBut {
	display:block;
	text-align: center
}
span.Zx_Notify span.cartGoBut a {
	padding: 7px 20px;
	font-size: 1.2em;
	font-weight: bold;
	color: #fff;
	background: #333;
	border-radius: 5px;
}
span.Zx_Notify span.cartGoBut a:hover {
	background: #000;
}
span.Zx_Notify span.arrow {
	display: block;
	width: 100%;
	position: absolute;
	bottom: -11px;
	left: 0;
	text-align: center;
}
/* ------------------------ 장바구니 PC ---------------------- */
span.Zx_NotifyPC {
	top: -130px;
	left: -50px;	
}
/* ------------------------ 장바구니 Mobile ---------------------- */
span.Zx_NotifyMobile {
	top: -130px;
	left: 0px;
	padding: 30px 10px;
}
span.Zx_NotifyMobile span.arrow {
	bottom: -10px;
	left: 50px;
	text-align: left;
}
/* ------------------------ 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;
}
/* -------------- 확인버튼 ---------------- */
.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;
}
/* -------------- 재등록버튼 ---------------- */
.addInsertBut{
	padding: 5px 20px;
	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);
}
.addInsertBut: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);
	cursor:pointer;
}
.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;
	text-align:center;
	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;
}
#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{
	background: #666;
}
.boardMoveBut:hover{
	background: #333;
}

.progressBut {
	font-size: 1.00em;
	padding: 2px 6px;
	padding-bottom: 3px;
	font-weight: bold;
	text-align: center;
	border-radius: 3px;
	color: #fff;
	cursor: pointer;
	background: #FF6600;
	width:100px;
}

/* ------------------------ 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;
}
/* -------------------------- table내 줄바꿈 ------------------------- */
span.tableReturn {
	display: block;
	margin-bottom: 3px;
}
span.tableReturn:last-child {
	margin-bottom: 0px;
}
/* --------------------------- blankDiv -------------------------- */
.blankDiv {
	clear: both;
	height: 0px;
}
/* --------------------------- loadingIcon -------------------------- */
#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_gray.png) no-repeat 0 7px;
}

h3.title {
	margin-bottom: 10px;
	padding: 5px 0;
	font-size: 1.8em;
	font-weight: bold;
	color: #333;
}
h3.title:before {
	content:"\f260";
	font-family: fontawesome;
	color: #999;
}
.h3Text {
	text-align: justify;
	margin-bottom: 20px;
	color: #666;
	font-size: 1.2em;
}
.h3Text li {
	margin-bottom: 5px;
	padding: 5px 0;
	padding-left: 20px;
	background: url(../images/arrow_18.gif) no-repeat 0 7px;
}
h4.title {
	margin-bottom: 10px;
	padding: 5px 0;
	font-size: 1.4em;
	font-weight: bold;
	color: #666;
}
.h4Text {
	text-align: justify;
	margin-bottom: 20px;
	color: #666;
	font-size: 1.2em;
}
.h4Text li {
	margin-bottom: 5px;
	padding: 2px 0;
	padding-left: 10px;
	background: url(../images/arrow_5.gif) no-repeat 0 7px;
}
h5.title {
	margin-bottom: 10px;
	padding: 5px 0;
	font-size: 1.2em;
	font-weight: bold;
	color: #333;
}
.h5Text {
	text-align: justify;
	margin-bottom: 20px;
	color: #666;
	font-size: 1.2em;
}
.h5Text li {
	margin-bottom: 5px;
	padding: 2px 0;
	padding-left: 10px;
	background: url(../images/arrow_8_gray.gif) no-repeat 0 7px;
}
/* ----------------------------------------------------------- */
/* ----------------------- layot 영역  ---------------------- */
/* ----------------------------------------------------------- */
#header {
	visibility: hidden;
}
#visual {
	visibility: hidden;
}
#contents {
	visibility: hidden;
}
#footer {
	visibility: hidden;
}
.siteWidthLayer {
	position: relative;
	width: 1211px;
	margin: 0 auto;
}
@media screen and (max-width: 800px) {
	.siteWidthLayer {
		width: 100%;
	}
}
/* ----------------------------------------------------------- */
/* ----------------------- pg_css 영역  ---------------------- */
/* ----------------------------------------------------------- */
#pg_css {
	position: relative;
}
/* ------------------------ topMoveBut ---------------------- */
#topMoveBut {
	position: fixed;
	width: 51px;
	height: 47px;
	bottom: 0;
	left: 0;
	z-index: 9999;
}
/* ------------------------ searchForm ---------------------- */
div.searchBox {
	position: relative;
	margin-bottom: 10px;
}
div.searchBox input[type=text]{
	width: 180px;
	padding-left: 5px;
	padding-right: 5px;
}
.searchBut{
	padding: 4px 10px;
	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);
}
.searchBut:hover{
	background: #333;
	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 ----------------------- */
.paging {
	margin: 20px 0px;
	text-align: center;
}
.paging a {
}
.paging span.arrow{
	padding: 3px 10px;
	font-size: 1.0em;
	font-weight: bold;
	text-align: center;
	border-radius: 3px;
	color: #999;
	background: #fff;
	border: 1px solid #ccc;
	behavior: url(../scripts/PIE.htc);
}
.paging a span.arrow:hover{
	color: #FF6600;
	border: 1px solid #FF6600;
}
.paging  a span.arrowTab{
	color: #fff;
	background: #666;
	border: 1px solid #333;
}
.paging a span.arrowTab:hover{
	background: #333;
	border: 1px solid #000;
}
.paging a span.circle{
	padding: 14px 10px;
	color: #999;
	background: url(../images/circle_bg1.png) no-repeat center center;
}
.paging a span.circle:hover{
	color: #fff;
	font-weight: bold;
	background: url(../images/circle_bg2.png) no-repeat center center;
}
.paging a.strong span.circle{
	color: #fff;
	font-weight: bold;
	background: url(../images/circle_bg2.png) no-repeat center center;
}
/* ----------------------------------------------------------- */
/* ----------------------- 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;
}
span.bigSize {
	font-size: 2.4em;
}
span.middleSize {
	font-size: 1.6em;
}
table.roundTable {
	margin-bottom: 30px;
	width: 100%;
	border: 1px solid #ccc;
	border-spacing: 10px;
	border-radius: 5px;
}
table.roundTable th, table.roundTable td{
	margin: 5px;
	padding: 5px 10px;
	border: 1px solid #ccc;
	text-align: center;
	border-radius: 5px;
}
table.roundTable th{
	font-weight: bold;
	background: #666;
	color: #fff;
	border: 1px solid #666;
}
table.roundTable td{
	background: #f9f9f9;
}
.tableScroll {
	width: 100%;
	overflow: hidden;
	overflow-x: auto;
}
table.base {
	width: 100%;
	margin-bottom: 30px;
	border: 1px solid #ccc;
	border-left: none;
}
table.base th, table.base td {
	border-bottom: 1px solid #ccc;
	border-left: 1px solid #ccc;
	padding: 8px 10px;
	text-align: center;
	font-size: 1.2em;
	word-wrap: break-word;
}
table.base thead th {
	font-weight: bold;
	color: #fff;
	background: #333;
}
table.base tbody th {
	font-weight: bold;
	background: #F9F9F9;
}
table.base tbody tr:last-child th, table.base tbody tr:last-child td{
	border-bottom: none;
}
table.base tbody th.borderBottomNone, table.base tbody td.borderBottomNone {
	border-bottom: none;
}
table.mobileBase {
	width: 100%;
	margin-bottom: 20px;
	border: 1px solid #ccc;
	border-left: none;
	white-space:nowrap;
    border-collapse:collapse;
}
table.mobileBase th, table.mobileBase td {
	border-bottom: 1px solid #ccc;
	border-left: 1px solid #ccc;
	padding: 4px 5px;
	text-align: center;
}

/* Table Scroll */
@media screen and (max-width: 800px) {
	table {
    /* white-space: nowrap; */
  }

  .tableScroll {
    overflow: hidden;
    overflow-x: auto;
  }
}
/* ▦▦▦▦▦▦▦▦▦ 통합검색 ▦▦▦▦▦▦▦▦▦ */
.Detail_Search_selector {
}
.Detail_Search_selector > span {
	display: block;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	right: -76px;
	width: 70px;
	height: 39px;
	line-height: 39px;
	border-radius: 5px;
	text-align: center;
	background-color: #333;
	color: #fff;
	transition: .3s;
	cursor: pointer;
}
.Detail_Search_selector > span:hover {
	background-color: #000;
}
.detail_search {
}
.detail_search table th, .detail_search table td {
	padding: 5px;
}
.detail_search table th {
	text-align: left;
	font-size: 14px;
}
.detail_search table th span {
	position: relative;
	padding-left: 20px;
}
.detail_search table th span:before {
	content: "\ea50";
	font-family: 'Material Icons';
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	left: 0;
	font-size: 16px;
}
.detail_search table td select, .detail_search table td input {
	width: 100%;
}
.detail_search .butWrap {
	margin-top: 10px;
	text-align: center;
}
.detail_search .butWrap button {
	padding: 8px 30px;
	background-color: #333;
	transition: .3s;
	font-size: 16px;
	color: #fff;
}
.detail_search .butWrap button:hover {
	background-color: #000;
}

/* ▦▦▦▦▦▦▦▦▦ Slick Slide ▦▦▦▦▦▦▦▦▦ */
.photo-slider {
	margin-bottom: 30px;
	padding: 20px 50px;
}
.photo-slider a {
	margin: 10px 5px;
	border-radius: 5px;
	overflow: hidden;
	transition: .3s;
}
.photo-slider a:hover {
	transform: translateY(-5px);
	box-shadow: 0 0 5px black;
}
.photo-slider a span {
	display: block;
	padding: 7px 0;
	background-color: darkblue;
	color: #fff;
	text-align: center;
	font-size: 14px;
}
/* Next Prev */
.photo-slider .slick-prev,
.photo-slider .slick-next {
  width: 50px;
  height: 50px;
	z-index: 1;
}
.photo-slider .slick-prev {
  left: 0;
}
.photo-slider .slick-next {
  right: 0;
}
.photo-slider .slick-prev:before,
.photo-slider .slick-next:before {
  content:"\e93b";
  font-family: xeicon;
  color: #999;
  font-size: 50px;
  opacity: 1;
  transition: .3s;
}
.photo-slider .slick-next:before {
  transform: rotateY(180deg);
  display: block;
}
.photo-slider .slick-prev:hover:before,
.photo-slider .slick-next:hover:before {
  text-shadow: 0 0 5px black;
  color: crimson;
}
.photo-slider .slick-dots {
	display: block;
	width: calc(100% - 100px);
}
.photo-slider .slick-dots li.slick-active button:before {
	color: crimson;
}
/* ▦▦▦▦▦▦▦▦▦ Scroll Reveal CSS Animation ▦▦▦▦▦▦▦▦▦ */
.ltr {
	animation: ltr 0.5s linear both;
}
.rtl {
	animation: rtl 0.5s linear both;
}
.utd {
	animation: utd 0.5s linear both;
}
.dtu {
	animation: dtu 0.5s linear both;
}
.zoom {
	animation: zoom 3s linear both;
}
@keyframes ltr {
	0% {
		transform: translateX(-100px);
		opacity: 0;
	}
	100% {
		transform: translateX(0);
		opacity: 1;
	}
}
@keyframes rtl {
	0% {
		transform: translateX(100px);
		opacity: 0;
	}
	100% {
		transform: translateX(0);
		opacity: 1;
	}
}
@keyframes utd {
	0% {
		transform: translateY(-100px);
		opacity: 0;
	}
	100% {
		transform: translateY(0);
		opacity: 1;
	}
}
@keyframes dtu {
	0% {
		transform: translateY(100px);
		opacity: 0;
	}
	100% {
		transform: translateY(0);
		opacity: 1;
	}
}
@keyframes zoom {
	0% {
		transform: scale(1)
	}
	100% {
		transform: scale(1.1)
	}
}