@charset "utf-8";

:root {
	--point: #2DD4BF;
    --yellow: #ffe063;
    --green: #c6fc6f;
    --orange: #ff7e36;
    --tonedown: #8b97b0;
}

html, body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td, img { 
	margin:0; 
	padding:0; 
}

html, body { 
	width:100%; 
	height:100%;
	color:#eee; 
	background-color:#172032 !important; 
	font-family: 'Noto Sans KR', sans-serif;
	font-size:13px;
}

a { text-decoration:none !important; color:#eee; }
a:hover{ color:var(--yellow); }

select,textarea,input { 
	color:#111; 
}
select:disabled{ 
	color:#666; 
	background: #eee; 
}

.img-blur{
	-webkit-filter:blur(2px) !important;
	-moz-filter:blur(2px) !important;
	-o-filter:blur(2px) !important;
	-ms-filter:blur(2px) !important;
	filter:blur(2px)!important;
}

/* jconfirm */
.jconfirm-closeIcon{ color:#111; }
.jconfirm-title-c .jconfirm-title{ color:#e74c3c; }
.jconfirm .jconfirm-box.jconfirm-type-green .jconfirm-title{ color:#0eb856 !important; }
.jconfirm-content *{ color:#111; }

/* loading */
.loading-mask{ display:none;  position:fixed; left:0; top:0; right:0; bottom:0; background:rgba(0,0,0,0.4); z-index:399999; }
.loading-content{ display:none; width:600px; height:280px; position:fixed; top:50%; bottom:50%; left:50%; margin-top:-130px; margin-left:-300px; text-align:center;
	background:rgba(0, 0, 0,.7); border-radius:10px; 
	z-index:9999999; border:1px solid #333; }
.loading-content .msg{ display:block; padding:20px; box-sizing:border-box; }
.loading-content .loading{ position:relative; display:inline-block;width:120px;height:120px;animation:Spin 0.5s linear infinite}.loading::after{content:"";position:absolute;left:0px;top:0px;width:100%;height:50%;border-top-left-radius:60px;border-top-right-radius:60px;box-shadow:inset -3px 3px 0px #FFAA00, inset 0px 3px 0px #FA0;transform:translate3d(0,0,0)}@keyframes
Spin{from{transform:rotateZ(0deg)}to{transform:rotateZ(360deg)}}

.dots-flow:before {
	-webkit-animation: dots-flow .85s infinite ease;
	animation: dots-flow .85s infinite ease;
	border-radius: 100%;
	content: '';
	height: 16px;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -40px);
	transform: translate(-50%, -40px);
  	width: 16px;
}

@-webkit-keyframes dots-flow {
	0%, 100% {
		-webkit-box-shadow: -26px 32px 0px 0 white, 0px 32px 0 0 white, 26px 32px 0 0 white;
				box-shadow: -26px 32px 0px 0 white, 0px 32px 0 0 white, 26px 32px 0 0 white; }
	35% {
		-webkit-box-shadow: -26px 32px 0 4px purple, 0px 32px 0 0 white, 26px 32px 0 0 white;
				box-shadow: -26px 32px 0 4px purple, 0px 32px 0 0 white, 26px 32px 0 0 white; }
	50% {
		-webkit-box-shadow: -26px 32px 0 0 white, 0px 32px 0 4px purple, 26px 32px 0 0 white;
				box-shadow: -26px 32px 0 0 white, 0px 32px 0 4px purple, 26px 32px 0 0 white; }
	65% {
		-webkit-box-shadow: -26px 32px 0px 0 white, 0px 32px 0 0 white, 26px 32px 0 4px purple;
				box-shadow: -26px 32px 0px 0 white, 0px 32px 0 0 white, 26px 32px 0 4px purple; } }

@keyframes dots-flow {
	0%, 100% {
		-webkit-box-shadow: -26px 32px 0px 0 white, 0px 32px 0 0 white, 26px 32px 0 0 white;
				box-shadow: -26px 32px 0px 0 white, 0px 32px 0 0 white, 26px 32px 0 0 white; }
	35% {
		-webkit-box-shadow: -26px 32px 0 4px purple, 0px 32px 0 0 white, 26px 32px 0 0 white;
				box-shadow: -26px 32px 0 4px purple, 0px 32px 0 0 white, 26px 32px 0 0 white; }
	50% {
		-webkit-box-shadow: -26px 32px 0 0 white, 0px 32px 0 4px purple, 26px 32px 0 0 white;
				box-shadow: -26px 32px 0 0 white, 0px 32px 0 4px purple, 26px 32px 0 0 white; }
	65% {
		-webkit-box-shadow: -26px 32px 0px 0 white, 0px 32px 0 0 white, 26px 32px 0 4px purple;
				box-shadow: -26px 32px 0px 0 white, 0px 32px 0 0 white, 26px 32px 0 4px purple; } }


#header{ width:100%; height:80px; padding:0; margin:0; }
.header-logo-wrap{ 
	width:1200px; 
	height:80px; 
	margin:0 auto; 
	padding:0 0 0 0; 
	box-sizing:border-box; 
	position:relative; 
}
.header-logo{
	width : 570px;
	height : 80px;
	padding : 21px 0 0 0;
	box-sizing : border-box; 
}

.header-btn{ display:none; }

.header-search {
	width : 430px;
	height : 46px;
	position : absolute;
	top : 15px;
	right : 0;
	border : 3px solid #2DD4BF;
	border-radius : 23px;
	display : table;
	overflow : hidden;
}
.header-search ul{ 
	display:table-cell; 
	vertical-align:top; 
}
.header-search ul input{ 
	width:375px; 
	height:46px; 
	background:none; 
	border:none; 
	color:#fff; 
	padding-left:20px; 
	font-size:15px; 
}
.header-search-btn{ 
	width:50px; 
}
.header-search-btn button{ 
	width:40px; 
	height:46px; 
	background:none; 
	border:none; 
}
.header-search-btn button i{ font-size:20px; color:#2DD4BF; }
.header-search-btn button i:hover{ color:#fff; }

.gnb-wrap {
	width:100%; 
	height:45px; 
	background-color:#0b1323; 
	z-index:2999; 
	box-sizing:border-box;
}
.gnb {
	width:1200px; 
	margin:0 auto; 
	height:45px; 
	overflow:hidden; 
	position:relative;
	display:flex;
	align-items: center;
}
.gnb > .right { 
	margin-left:auto; 
}

.gnb > ul { 
	padding:0 20px 0 7px; 
	margin:0; 
	display:inline-block; 
	height:45px; 
	line-height:45px; 
}
.gnb > ul a{ 
	font-size:16px; 
	font-weight:700; 
}
.gnb > ul a:hover {
	color:var(--point);
}
.gnb > ul span.beta{ 
	font-size:12px; 
	font-weight:400; 
	color:#94ff6e; 
}

.gnb-menu{ }
.gnb-menu > ul {
	
}
.gnb-menu > ul > li{ display:inline-block !important; background-color:#0b1323; color:#fff; line-height:45px; padding:0 25px 0 5px; 
	font-family: 'Noto Sans KR', sans-serif;  font-size:16px;
}
.gnb-menu-right{ height:45px; float:right; color:#485672; }
.gnb-menu-right > span{ display:inline-block; height:45px; line-height:45px; }
.gnb-menu-right > span a{ color:#eee; }

#contents_wrap{  }
.contents-wrap{ width :1200px; margin:0 auto; min-height : calc(100% - 130px); box-sizing:border-box; }

.contents-wrap.side { display:table; }
.contents-wrap.side > ul{ display:table-cell; vertical-align:top; }
.contents-wrap.side > ul.left-ul{ width :300px; padding-left:20px; }

.new-comment{ background-color:#0b1323; border-radius:10px; margin-top:20px; box-sizing:border-box; }
.new-comment h1{ font-size:16px; padding:20px 20px 10px; }

.side-comment-list-wrap{ border-top:1px solid #202b41; }
.side-comment-list-wrap > ul{ border-bottom:1px solid #202b41; padding:10px 25px; }
.side-comment-list-wrap > ul:hover{ background-color:#1a263f; }
.side-comment-list-wrap > ul:hover a{
	color:var(--point);
}
.side-comment-prd-name{

}
.side-comment-prd-name a{ 
	font-size:13px; 
	line-height:135%; 
	color:#f7f7f7;
	overflow: hidden;
	text-overflow: ellipsis; 
	display: -webkit-box;
	-webkit-line-clamp: 1; /* 라인수 */
	-webkit-box-orient: vertical;
	word-wrap:break-word; 
}

.side-comment-body{ 
	margin-top:3px; 
}
.side-comment-body a {
	font-size:13px;
	line-height:135%;
	color:#d7dbe4;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2; /* 라인수 */
	-webkit-box-orient: vertical;
	word-wrap:break-word;
}

#footer { 
	width : 100%;
	height : 100px;
	margin-top : 20px;
	background-color : #0b1323;
	position:relative;
	color:#eee;
}
#footer_wrap { 
	width:1200px;
	height:70px;
	margin:0 auto;
	color:#ddd;
	text-align:left;
	box-sizing:border-box;
	padding-top:20px;
	position:relative;
}
#footer_social { 
	position:absolute; 
	top:20px; 
	right:0;  
}
#footer_social li { 
	width:25px; 
	height:25px; 
	float: right; 
	margin-left:5px; 
}
#footer_social li img{ 
	width:25px; 
}

/* page */
.page-title { 
	border-bottom : 1px solid #000 !important; 
	box-sizing : border-box; 
	margin-top : 15px; 
	padding : 0 0 15px 10px; 
}
.page-title h1{ 
	font-size : 25px; 
}
.page-title h1 a{ 
	color:#fff;
}

/* prd list */
.top-wrap { 
	width:100%;
	border-bottom:1px solid #000 !important;
	box-sizing:border-box;
	height:36px;
	margin-top:15px;
}
.total-count{ }
.total-count > ul{ height:36px; line-height:36px; color:#eee; padding-left:15px; }
.total-count > ul span{ color:var(--point); font-weight:bold; }

.prd-list-wrap { width:100%; font-size:0; margin-top:20px; vertical-align:top; }
.prd-list-wrap > ul{ width:25%; display:inline-block; box-sizing:border-box; margin-bottom:40px; vertical-align:top;  }
.prd-list-box{ display:table; } 
.prd-list-box ul.img{ width:90px; display:table-cell; vertical-align:top; position:relative; }
.prd-list-box ul.info{ display:table-cell; vertical-align:top; padding: 0 20px 0 0; box-sizing:border-box; }

.prd-list-box ul.img .thum{ width:85px; height:85px; overflow:hidden; border:3px solid #000; border-radius:10px; }
.prd-list-box ul.img .thum .thum-icon{ width:100%; }
.prd-list-box ul.img .thum .thum-no-icon{ width:180px; margin-top:-45px; margin-left:-45px; }

.prd-list-box ul.img .tier-icon{ position:absolute; width:22px; top:0; left:0; }
.prd-list-box ul.img .tier-icon img{ width:100%; }

.prd-list-box ul.info .pd-info{ padding:10px 0 0 5px; }
.prd-list-box ul.info .pd-name{ }
.prd-list-box ul.info .pd-name a{ font-size:14px; line-height:135%; color:#eee;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2; /* 라인수 */
	-webkit-box-orient: vertical;
	word-wrap:break-word; 
}
.prd-list-box ul.info .pd-brand-info{ padding-top:15px; line-height:120%;  }
.prd-list-box ul.info .pd-brand-info a{ font-size:13px; color:#798499; }

.tier-title{ text-align:center; padding:20px 0 0 0; }
.tier-title p{ margin-top:5px; font-size:19px; font-weight:700; }


/* Brand List */
.brand-list-wrap { width:100%; font-size:0; margin-top:20px; vertical-align:top; }
.brand-list-wrap > ul{ width:25%; display:inline-block; box-sizing:border-box; margin-bottom:40px; vertical-align:top; }
.brand-list-box{ display:table; } 
.brand-list-box ul.img{ width:90px; display:table-cell; vertical-align:top; position:relative; }
.brand-list-box ul.info{ display:table-cell; vertical-align:top; padding: 0 20px 0 0; box-sizing:border-box; }
.brand-list-box ul.img .thum{ width:85px; height:85px; overflow:hidden; border:3px solid #000; border-radius:10px; }
.brand-list-box ul.img .thum img{ width:100%; }
.brand-list-box ul.info .brand-info{ padding:12px 0 0 5px; }
.brand-list-box ul.info .brand-name-kr a{ font-size:16px; line-height:135%; color:#eee; }
.brand-list-box ul.info .brand-name-en{ padding-top:13px; line-height:120%;  }
.brand-list-box ul.info .brand-name-en a{ font-size:13px; color:#798499; }

/* Brand */
.brand-title{ text-align:center; padding:30px 0 0 0; }
.brand-title > div.brand-logo{ display:inline-block; vertical-align:top; width:130px; height:130px; overflow:hidden; border:3px solid #000; border-radius:10px; }
.brand-title > div.brand-logo img{ width:100%; }
.brand-title > div.brand-info{ display:inline-block; vertical-align:top; padding:10px 0 0 10px; text-align:left; }
.brand-title > div.brand-info > p.brand-name-kr{ font-size:25px; }
.brand-title > div.brand-info > p.brand-name-en{}

/* join */
.join-wrap{ width:500px; margin:0 auto; padding-top:50px; }
.join-logo{ width:100%;  }
.join-box{ width:100%; background-color:#fff; border:1px solid #000; border-radius:10px; margin-top:20px; 
	padding:50px; box-sizing:border-box; 
	text-align:center;
}

.join-title{ width:100%; margin:0 auto; color:#000; font-size:17px; text-align:left; height:30px; line-height:30px; }

.join-form{ width:100%; margin:0; padding:0; }
.join-form ul,
.login-form ul{ margin-bottom:6px; }

.join-form ul label,
.login-form ul label{ width:100%; height:40px; margin:0; padding-left:10px; box-sizing:border-box; border:1px solid #ddd; background-color:#f7f7f7; border-radius:6px; text-align:left; }

.join-form ul label i { color:#ddd; }
.join-form ul label i.i-check-on{ color:#0eb856; }

.join-form ul label input,
.login-form ul label input{ width:100%; height:38px; border:none; border-radius:6px; margin:0; padding:0 0 0 3px; background-color:#f7f7f7; }

.join-form ul label input::placeholder { font-weight:400; }

.join-form ul label input.ck-input{  width: calc(100% - 104px); }
.join-form ul label a{ display:inline-block !important; vertical-align:middle; }

.join-form ul .btn-s1.block,
.login-form ul .btn-s1.block{ width:100%; }

.login-link a{
	color:#333;
}

.join-copyright{ margin-top:10px; }

#join_step2{ display:none; }


/* Login */
.login-wrap{ width:500px; margin:0 auto; padding-top:50px; }
.login-logo{ width:100%;  }
.login-box{ width:100%; background-color:#fff; border:1px solid #000; border-radius:10px; margin-top:20px; 
	padding:50px; box-sizing:border-box; 
	text-align:center;
}


/* Mypage */
.u-wrap{ padding-bottom:15px; }
.u-layout{ width:100%; display:table; }
.u-layout > ul{ display:table-cell; vertical-align:top; }
.u-layout > ul.u-profile{ width:260px; }
.u-layout > ul.u-body{  padding:50px 0 0 0; }
.u-layout > ul.u-body .form-wrap{ width:600px; }

.profile-img{ padding-top:15px; }
.profile-box{ padding:10px; }
.profile-box b{ color:var(--point); }

/* User View */



/* Free market */

/* Free market List */
.user-market{}

.user-market .category span{ height:38px; line-height:36px; display:inline-block; background-color:#2d384a; margin:10px 0 5px; padding:0 15px; border:1px solid #121b29; border-radius:5px; }
.user-market .category span a{ color:#fff; }
.user-market .category span.active { background-color:var(--orange); }

.user-market > div.list { width:100%; font-size:0; margin-top:20px; vertical-align:top; }
.user-market > div.list > ul{ width:33.33%; display:inline-block; box-sizing:border-box; margin-bottom:40px; vertical-align:top; }
.user-market > div.list .list-box{ display:table; } 
.user-market > div.list .list-box ul.img{ width:120px; display:table-cell; vertical-align:top; position:relative; }
.user-market > div.list .list-box ul.info{ display:table-cell; vertical-align:top; padding: 0 20px 0 7px; box-sizing:border-box; }

.user-market > div.list .list-box ul.img .thum{ width:120px; height:120px;  overflow:hidden; border:3px solid #000; border-radius:10px; }
.user-market > div.list .list-box ul.img .thum img{ width:100%; }

.user-market > div.list .list-box ul.info .info-box{ padding:10px 0 0 5px; }
.user-market > div.list .list-box ul.info .subject{ }
.user-market > div.list .list-box ul.info .subject a{ font-size:15px; line-height:135%; color:#eee;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2; /* 라인수 */
	-webkit-box-orient: vertical;
	word-wrap:break-word; 
}

.user-market > div.list .list-box ul.info .prd{ display:none; padding:5px 0 0 0; font-size:12px; line-height:135%; color:#a2acbf;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 1; /* 라인수 */
	-webkit-box-orient: vertical;
	word-wrap:break-word; 
}
.user-market > div.list .list-box ul.info .writer{ padding:5px 0 0 0; }
.user-market > div.list .list-box ul.info .writer span{ font-size:13px; color:#a2acbf; }
.user-market > div.list .list-box ul.info .writer span .admin-icon{ display:inline-block; margin-right:3px;  }
.user-market > div.list .list-box ul.info .writer span .admin-icon img{ height:17px; vertical-align:middle; }
.user-market > div.list .list-box ul.info .price{ padding:3px 0 0 0; font-size:15px; }

.user-market .btn-wrap{ text-align:right; }
.user-market-btn{ display:inline-block; background-color:var(--orange); font-size:14px; width:120px; height:44px; line-height:44px; border-radius:22px; color:#fff; text-align:center; cursor:pointer; }
.user-market-btn:hover{ background-color:#3a7bd5; color:#fff; }


/* Free market View */
.free-market-view{ width:100%; display:table; margin-top:20px; }
.free-market-view > ul{ display:table-cell; vertical-align:top; box-sizing:border-box; }
.free-market-view > ul.img-wrap{ width:720px; }
.free-market-view > ul.info-wrap{ padding-left:20px; }

.pc-image-wrap{ width:720px; display:table; }
.pc-image-wrap > ul{ display:table-cell; vertical-align:top; }
.pc-image-wrap > ul.simg-wrap{ width:70px; }
.pc-image-wrap > ul.bimg-wrap{  }
.pc-image-wrap > ul.bimg-wrap img{ width:100%; }

.pc-image-wrap > ul.simg-wrap > div.unit{ width:50px; height:45px; background-repeat: no-repeat; background-position: center center; background-size:cover;
	cursor:pointer; box-sizing:border-box; border:2px solid #000; border-radius:4px; margin-bottom:6px;
}
.pc-image-wrap > ul.simg-wrap > div.unit:hover{ border:2px solid var(--orange); }
.pc-image-wrap > ul.simg-wrap > div.unit.active{ border:2px solid var(--orange); }

.image-empty{ text-align:center; color:var(--tonedown); }

.writer-wrap{ width:100%; padding:0 0 10px 10px; border-bottom:1px solid #2d384a; }
.writer-wrap > span{ display:inline-block; vertical-align:middle; }

.writer-wrap > span.profile-img{ width:35px; height:35px; line-height:35px; text-align:center; overflow:hidden; background-color:#485672; border-radius:50%; padding:0; }
.writer-wrap > span.profile-img i { font-size:20px; line-height:35px; color:#98a7c4; }
.writer-wrap > span.profile-img img{ width:100%; }

.writer-wrap > span a{ color:#fff; }

.board-contents-wrap{ width:100%; padding:10px 0 0 10px; }
.board-contents-wrap > ul.status{  }
.board-contents-wrap > ul.status.my{ padding:0 0 10px 0; }
.board-contents-wrap > ul.status p{ color:#737f97; }
.board-contents-wrap > ul.status select{ height:35px; color:#fff; background-color:#737f97; border:1px solid #000; border-radius:5px; padding:5px; }
.board-contents-wrap > ul.status > div.my-btn{ padding:3px 0 0 0; display:inline-block; float:right; }
.board-contents-wrap > ul.subject{ }
.board-contents-wrap > ul.subject p{ font-size:22px; }
.board-contents-wrap > ul.price{ padding:15px 0 0 0; }
.board-contents-wrap > ul.price span{ color:#737f97; }
.board-contents-wrap > ul.price p{ font-size:17px; }
.board-contents-wrap > ul.body{ padding:15px 0 0 0; }
.board-contents-wrap > ul.body > div.report{ margin:15px 0 0 0; }
.board-contents-wrap > ul.body > div.report span{ color:var(--tonedown); cursor:pointer; }
.board-contents-wrap > ul.body > div.report span:hover{ color:#fff; }
.board-contents-wrap > ul.option{ padding:15px 0 0 0; }
.board-contents-wrap > ul.option a.openchat{ display:inline-block; vertical-align:middle; color:#3b1e1e; background-color:#f9e000; padding:6px 25px; border-radius:8px; margin-right:5px; }
.board-contents-wrap > ul.option a.openchat img{ width:40px; }
.board-contents-wrap > ul.option p{ height:49px; display:inline-block; vertical-align:middle; border-radius:6px; border:1px solid #343f51; }
.board-contents-wrap > ul.option p.like{ width:49px; text-align:center; }
.board-contents-wrap > ul.option p.like i{ font-size:24px; color:#737f97; line-height:49px; }
.board-contents-wrap > ul.option p.report{ line-height:49px; padding:0 10px; }

/* Free market Reg */
.user-market-reg{ width:950px; margin:20px auto;  box-sizing:border-box; }

.img-upload-wrap{ width:100%; background-color:#080f1d; display:table; padding:20px; border-radius:10px;  }
.img-upload-wrap > ul{ display:table-cell;  vertical-align:top; }
.img-upload-wrap > ul:first-child{ width:150px; text-align:center;  }

.upload-wrap{ width:80px; height:80px; display:inline-block; border:1px solid #606a7b; border-radius:7px; overflow:hidden; box-sizing:border-box; position:relative; cursor:pointer; }
.upload-wrap input[type=file]{ width:100%; height:100%; position:absolute; top:0; left:0;
	filter:alpha(opacity=0);
	opacity:0;
	-moz-opacity:0;
	cursor:pointer; 
}
.upload-btn{}
.upload-btn > ul{ text-align:center; }
.upload-btn > ul.icon{ padding-top:18px; }
.upload-btn > ul.icon i{ font-size:24px; }
.upload-btn > ul.count{ padding-top:4px; font-size:12px; }

.upload-wrap:hover{ background-color: #000; }
#file_count{ color:#ff7e36; }

.preview-empty{ height:80px; line-height:80px; border-radius:7px; background-color:#0e192d; font-size:14px; color:#5d687c; box-sizing:border-box; padding-left:30px; }

ul.preview_files { margin:0; padding: 0; font-size:0; }
ul.preview_files li {display:inline-block; margin: 0 15px 20px; padding:0; width:120px; height:120px; position: relative; box-sizing:border-box; }
ul.preview_files li p { width:100%; height:100%; overflow:hidden; border: 1px solid #000; border-radius: 10px; background-color: #fff; }
ul.preview_files li p > img { width:100%; height:100%; }
ul.preview_files .ui-selected { background:red; }
ul.preview_files .highlight { border: 1px dashed #000; width: 120px; background-color: #ccc; border-radius: 5px;}

.preview-delete-btn { width:24px; height:24px; line-height:24px; display:block; text-align:center; border-radius:50%; background-color:#ff7e36; position: absolute; top: -12px; right: -14px; padding:0; }
.preview-delete-btn i{ font-size:18px; height:24px; line-height:24px;  color:#fff; }

.user-market-reg .form-wrap{ margin-top:20px; }

/* Reports */
.reports-wrap{ width:950px; margin:20px auto;  box-sizing:border-box; }

.mobile{ display:none; }
.mobile-inline{ display:none; }

/* Board */
.board-list-wrap{ width:800px; margin:0 auto;  }
.board-list{ width:100%; box-sizing:border-box; }
.board-list > ul{ border-bottom:1px solid #3c4457; padding:20px; }
.board-list > ul p.subject{ font-size:17px; font-weight:600; margin:3px 0; }
.board-list > ul p.date{ font-size:12px; color:#8e9cb7; }

.board-view-wrap{ width:800px; margin:20px auto;  }
.board-view{ width:100%; box-sizing:border-box; }
.board-view ul.subject{ font-size:17px; text-align:center; font-weight:600; border-bottom:1px solid #3c4457; border-top:1px solid #3c4457; padding:20px;}
.board-view ul.info{ padding:10px; }
.board-view ul.info p.date{ float:right; }
.board-view ul.body{ padding:20px; border-bottom:1px solid #3c4457; }
.board-view ul.btn-wrap{ padding:10px; text-align:center; }

/* Notice */
.notice-wrap{ background-color:#b1fcc3; color:#000; box-sizing:border-box; padding:15px; }
.notice-wrap a{ color:#000; }

.form-group {
    margin-bottom: 15px;
}

.form-group label{ 
	font-weight:400; 
	color:var(--tonedown); 
	display: inline-block;
    max-width: 100%;
    margin-bottom: 5px;
}

.form-group p.value{ width:100%; height:36px; line-height:34px; padding-left:13px; box-sizing:border-box; background:#060b16; border:1px solid #24314b; border-radius:4px; 
	color:#90a2c5; }

/* mobile */
@media(max-width:767px){

	.mobile{ display:block !important; }
	.mobile-inline{ display:inline-block !important; }
	.pc{ display:none !important; }

	/* loading */
	.loading-content{ width:70%; margin-left:-35%; }

	.menu-close{ position: absolute; top: 12px;right: 15px; text-align: center; }
	.menu-close i{ font-size:25px; color:#ffffff; }

	#header{ background-color:#0b1323; height:50px; position:fixed; z-index:299999;  top:0; }
	.header-logo-wrap{ width:100%; height:100%; margin:0; padding:0; }
	.header-logo{ width:195px; height:50px; padding:11px 0 0 0; margin:0 auto;  }
	.header-logo img{ height:23px; }

	.header-btn{ display:block; position:absolute; width:26px; height:26px; line-height:26px; top:12px;  font-size:18px; text-align:center; color:#fff;   }
	.header-btn.menu{ left:15px; }
	.header-btn.my{ right:15px; }
	.header-btn.search{ right:45px; }

	.header-search{ display:none; }

	.gnb-wrap{ 
		position:fixed; 
		z-index:300000; 
		width:100%; 
		height:100%; 
		padding:20px; 
		top:0; 
		left:-100%; 
		background:linear-gradient( to right, #051330, #0a1d43, #082051 ); 
	}

	.gnb{ 
		width:100%; 
		height:100%; 
		margin:0; 
		overflow:hidden; 
		position:relative;
		flex-direction: column;
		align-items: flex-start;
	}
	.gnb-logo{ 
		margin-bottom:20px; 
		padding:10px 0 0 10px; 
	}
	.gnb-logo img{ 
		height:32px; 
	}
	.gnb ul{ 
		padding:0 20px 0 15px; 
		margin:0; 
		display:block; 
		height:45px; 
		line-height:45px; 
	}

	#contents_wrap{ }
	.contents-wrap{ 
		width :100%;
		padding-top:50px;
	}
	.contents-wrap.side { 
		display:block;
	}
	.contents-wrap.side > ul{ 
		display:block;
	}
	.contents-wrap.side > ul.left-ul{ 
		width :100%;
		padding:20px;
	}

	#footer_wrap{ 
		width:100%;
		padding:20px 0 0 20px;
	}

	/* page */
	.page-title{
		margin-top:15px;
		padding:0 0 15px 20px;
	}
	.page-title h1{ 
		font-size:20px;
	}

	.prd-list-wrap{ 
		padding:0 10px;
	}
	.prd-list-wrap > ul{ 
		width:33.33%;
	}
	.prd-list-box{ display:block; } 
	.prd-list-box ul.img{ display:block; width:100%; text-align:center;  }
	.prd-list-box ul.info{ display:block; width:110px;  margin:0 auto; }

	.prd-list-box ul.img .thum{ margin:0 auto; width:100px; height:100px; }
	.prd-list-box ul.img .tier-icon{ position:absolute; width:24px; top:0; left:50%; margin-left:-50px; }

	.prd-list-box ul.info .pd-info{ padding:6px 0 0 5px; }

	.tier-title{ text-align:center; padding:20px 0 0 0; }
	.tier-title img{ width:40px; }
	.tier-title p{ margin-top:5px; font-size:19px; font-weight:700; }

	/* Brand List */
	.brand-list-wrap { padding:20px; }
	.brand-list-wrap > ul{ width:50%; }
	.brand-list-box ul.info .brand-info{ padding:5px 0 0 2px; }
	.brand-list-box ul.info .brand-name-kr a{ font-size:15px; line-height:120%; }
	.brand-list-box ul.info .brand-name-en{ padding-top:6px; }
	.brand-list-box ul.info .brand-name-en a{ font-size:11px; line-height:130%; }

	/* join */
	.join-wrap{ width:100%; padding:30px; }
	.join-box{ padding:30px 20px; }

	/* Login */
	.login-wrap{ width:100%; padding:30px; }
	.login-box{ padding:50px 30px; }

	/* Mypage */
	.u-wrap{ padding:15px 20px; }

	.u-layout{ width:100%; display:block; }
	.u-layout > ul{ display:block; vertical-align:top; }
	.u-layout > ul.u-profile{ width:100%; padding:10px 5px; }
	.u-layout > ul.u-body{  padding:30px 0 0 0; }
	.u-layout > ul.u-body .form-wrap{ width:100%; }

	.profile-img{ display:inline-block; vertical-align:top;width:100px; height:100px; overflow:hidden; border-radius:7px; padding:0; }
	.profile-img img{ width:100%; }
	.profile-box{ display:inline-block; vertical-align:top; padding:5px 0 0 13px; }

	/* Free market */

	/* Free market List */
	.user-market{ padding:0 16px; }

	.user-market > div.list > ul{ width:100%; display:block; padding-bottom:10px; margin-bottom:10px; border-bottom:1px solid #2d384a; }
	.user-market > div.list .list-box ul.img{ width:115px; display:table-cell; vertical-align:top; position:relative; }
	.user-market > div.list .list-box ul.img .thum{ width:108px; height:108px;  overflow:hidden; border:2px solid #000; border-radius:7px; }

	.user-market .btn-wrap{ position:fixed; bottom:20px; right:20px; z-index:399900; }

	/* Free market View */
	.free-market-view{ width:100%; display:block; margin-top:0; }
	.free-market-view > ul{ display:block; }
	.free-market-view > ul.img-wrap{ width:100%; }
	.free-market-view > ul.info-wrap{ padding:10px 20px 0 10px; }
	
	.swiper{ width:100vw; height:60vh; }
	.swiper-wrapper{ }
	.swiper-slide{ 
		background-repeat: no-repeat;
		background-position: center center;
		background-size:cover;
	}


	/* Free market Reg */
	.user-market-reg{ width:100%; margin:20px auto; }

	.img-upload-wrap{ padding:10px 0; height:106px; border-radius:0; }
	.img-upload-wrap > ul{  }
	.img-upload-wrap > ul:first-child{ width:90px; text-align:center; padding-top:8px; }
	
	.upload-wrap{ width:70px; height:70px; }
	.upload-btn > ul.icon{ padding-top:14px; }
	.upload-btn > ul.icon i{ font-size:20px; }

	.preview-wrap{ position:relative; overflow-y: hidden; overflow-x: scroll; }
	.upload-img-view-wrap{ position:absolute; top:8px; }
	
	.preview-empty{ width:100%; height:70px; line-height:70px; padding:0 20px; }
	
	ul.preview_files { white-space:nowrap; }
	ul.preview_files li { width:70px; height:70px; margin: 0 10px 0; }
	ul.preview_files li p { border-radius: 6px; }

	.preview-delete-btn { width:22px; height:22px; line-height:22px; top: -8px; right: -10px; }
	.preview-delete-btn i{ font-size:16px; height:22px; line-height:22px; }

	.user-market-reg .form-wrap{ padding:0 20px; }
	.user-market-reg .form-wrap .col-xs-4{ width:45%; }

	/* Reports */
	.reports-wrap{ width:100%; margin:20px auto; padding:0 20px; }

	/* Board */
	.board-list-wrap{ width:100%; margin:0 auto;  }

	.board-view-wrap{ width:100%; margin:20px auto;  }
}

/* paging */
/*
.paging { margin:0 auto; text-align:center; }
.paging a { display:inline-block; vertical-align:middle; width:30px; height:30px;  text-decoration:none; line-height:28px; padding:0; box-sizing:border-box; margin:0 2px; }
.paging a.side{ background:#222; border:1px solid #111; border-radius:3px; color:#ddd; }
.paging a.side-on{ background:#222; border:1px solid #111; border-radius:3px; color:#7b7b7b; }
.paging a.side-on:hover { background:#777777; border:1px solid #000000; color:#fff; }
.paging a.rest { border:1px solid #3f4654; border-radius:3px;  color:#eee; letter-spacing:-1px;}
.paging a.rest:hover { background:#777777; border:1px solid #000000; color:#fff; }
.paging a.now { font-weight:bold; background:#f1c100; border:1px solid #000; border-radius:3px; color:#000; }
.paging a.post { margin:0 9px 0 0; }
.paging a.next { margin:0 0 0 9px; }
*/

/* 기본 페이징 */
.pagination{
    margin: 0;
	padding:0 0 0;
}

.pagination ul {
    width:100%;
	list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
	align-items: center;
    justify-content: center;
    gap: 3px;
}

.pagination ul li {
    margin: 0;
    padding: 0;
}

.pagination ul li.first-page,
.pagination ul li.prev-page,
.pagination ul li.next-page,
.pagination ul li.last-page{
	/* display:none; */
}

.pagination ul li a {
    display: inline-block;
    padding: 5px 10px;
    text-decoration: none;
    color: #333;
	background-color:#fff;
    border: 1px solid #ddd;
    border-radius: 5px;
}

.pagination ul li.active a {
    background-color: #008976;
    color: #ffffff;
    border-color: #087365;
}