@charset "utf-8";

.logostore{
	top: 46px;
}

.logo-jjang0u--store{
	width: 168px;
	height: 50px;
	background: url('img/logo_store.png') no-repeat 0 0;
}

.search-wrap-store{
	left: 230px;
}
.store-nav{
	position: relative;
	width: 1140px;
	height: 60px;
	margin: 0 auto;
	padding: 0 20px;
}
.store-nav ul::after{
	content: "";
	display: block;
	clear: both;
}
.store-nav li{
	float: left;
}
.store-nav a{
	position: relative;
	display: block;
	height: 100%;
	font-family: "Noto Sans KR", sans-serif;
	font-size: 14px;
	line-height: 58px;
	color: #333;
	font-weight: 400;
	margin: 0 15px;
}
.store-nav a.on{
	color: #0096ff;
}

.my-token{
	position: absolute;
	top: 22px;
	right: 20px;
	font-family: "Noto Sans KR", sans-serif;
	font-size: 14px;
}
.my-token > strong{
	color: #0096ff;
	padding-left: 4px;
}
.my-token > strong > img{
	vertical-align: top;
	margin-left: 4px;
	margin-top: -3px;
}

.store-wrap{
	font-family: "Noto Sans KR", sans-serif;
	font-size: 14px;
	font-weight: 400;
}
.store-wrap button{
	font-family: "Noto Sans KR", sans-serif;
}

/* store index event slider */
.store-event{
	margin-bottom: 20px;
}



.bx-viewport{
	border-radius: 10px;
	overflow: hidden;
}
.bx-wrapper .bx-prev:hover,
.bx-wrapper .bx-prev:focus {
	background: url('img/slider_left.png') no-repeat 0 0;
}

.bx-wrapper .bx-prev{
	background: url('img/slider_left.png') no-repeat 0 0;
}
.bx-wrapper .bx-next:hover,
.bx-wrapper .bx-next:focus {
	background: url('img/slider_right.png') no-repeat 0 0;
}

.bx-wrapper .bx-next{
	background: url('img/slider_right.png') no-repeat 0 0;
}
.bx-wrapper .bx-controls-direction a{
	margin-top: -20px;
	width: 40px;
	height: 40px;
}

.bx-wrapper .bx-pager, .bx-wrapper .bx-controls-auto{
	bottom: 15px;
}
.bx-wrapper .bx-pager.bx-default-pager a:hover, 
.bx-wrapper .bx-pager.bx-default-pager a.active, 
.bx-wrapper .bx-pager.bx-default-pager a:focus{
	background: #f4f4f4;
}
.bx-wrapper .bx-pager.bx-default-pager a{
	background: none;
	border: 1px solid #d8d8d8;
	box-sizing: border-box;
}
.bx-wrapper{
	margin-bottom: 0;
	height: 54px;
}

/* store index */
.store-component{
	position: relative;
	background: #fff;
	padding: 30px 16px;
	border-radius: 10px;
	margin-top: 20px;
}
.store-component:nth-of-type(1){
	margin-top: 0;
}
.store-component h2{
	font-size: 24px;
	font-weight: 500;
	color: #333
}
.store-component h2 > em{
	color: #0096ff;
}
.btn-con-more{
	position: absolute;
	top: 30px;
	right: 16px;
	font-size: 12px;
	color: #666;
}
.btn-con-more::after{
	content: "";
	display: inline-block;
	width: 6px;
	height: 9px;
	background: url('img/icon_con_more.png') no-repeat 0 0;
	margin-left: 6px;
}
.con-list{
	margin-top: 30px;
}
.con-list::after{
	content: "";
	display: block;
	clear: both;
}
.con-list > li{
	float: left;
	width: 168px;
	margin-right: 20px;
	margin-bottom: 20px;
}
.con-list > li:nth-of-type(6n){
	margin-right: 0;
}
.con-thumb{
	display: block;
	width: 168px;
	height: 168px;
	border-radius: 20px;
	overflow: hidden;
}
.con-thumb > img{
	width: 100%;
}
.con-title{
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	margin-top: 8px;
}
.btn-favorite{
	width: 30px;
	height: 30px;
	border-radius: 15px;
	vertical-align: middle;
	background: url('img/icon_favorite_off.png') no-repeat 0 0;
	background-size: 30px 30px;
	background-size: ;
	overflow: hidden;
	transition: ease 0.1s;
}
.btn-favorite.active{
	background-image: url('img/icon_favorite_on.png');
	transition: ease 0.1s;
}
.btn-modify{
	width: 28px;
	height: 28px;
	vertical-align: middle;
	background: url('img/icon_modify.png') no-repeat 0 0;
}

.con-name{
	color: #333;
	padding-left: 10px;
}

.store-banner::after{
	content: "";
	display: block;
	clear: both;
}
.banner-item{
	display: block;
	float: left;
	width: 560px;
	height: 220px;
	margin-right: 20px;
	margin-top: 20px;
	border-radius: 10px;
}
.banner-item:nth-of-type(even){
	margin-right: 0;
}
.banner__text{
	display: block;
	margin: 40px 0 0 40px;
	font-size: 20px;
	line-height: 1.5em;
	color: #333;
	width: 280px;
	word-break: keep-all;
}
.banner__link{
	display: inline-block;
	margin: 30px 0 0 40px;
	font-size: 22px;
	color: #333;
	font-weight: 500;
}
.banner-item:hover .banner__link{
	text-decoration: underline;
}
.banner-item1{
	background: #acddfb url('img/img_banner3.png') no-repeat 92% 50%;
}
.banner-item2{
	background: #d1f3ed url('img/img_banner2.png') no-repeat 92% 50%;
}

/* token common section */
.store-common{
	font-family: "Noto Sans KR", sans-serif;
	font-size: 14px;
	font-weight: 400;
	padding: 50px 20px;
	background: #fff;
}
.store-banner > h2{
	font-size: 24px;
	font-weight: 500;
	color: #333
}
.store-common .store-banner{
	width: 1140px;
	margin: 0 auto;
}
.store-common .banner-item3{
	background: #ffd9f4 url('img/img_banner3.png') no-repeat 92% 50%;
}
.store-common .banner-item4{
	background: #a9cdff url('img/img_banner4.png') no-repeat 164% 8%;
}
.banner-item3 .banner__text{
	margin-top: 50px;
}
.banner-item4 .banner__text{
	margin-top: 50px;
}





.btn-con-list-more{
	width: 100%;
	height: 50px;
	text-align: center;
	background: #f8f8f8;
	border-radius: 10px;
}
.btn-con-list-more:hover{
	background: #f4f4f4;
}
.btn-con-list-more > span{
	width: 12px;
	height: 7px;
	background-position: -232px -13px;
	margin-left: 6px;
	vertical-align: middle;
}

.store__view::after{
	content: "";
	display: block;
	clear: both;
}

.store__product-img{
	position: relative;
	width: 580px;
	height: 580px;
	float: left;
	margin-right: 40px;
	background: #f8f8f8 url('img/no_image_product.png') no-repeat 50% 35%;
	border-radius: 20px;
	overflow: hidden;
}
.store__product-img img{
	width: 100%;
}
.store__product-desc{
	float: left;
	width: 488px;
}
.store__product-box > h2{
	font-size: 32px;
	font-weight: 500;
}
.store__product-box{
	position: relative;
	border-bottom: 1px solid #d8d8d8;
	padding-bottom: 30px;
	margin-bottom: 30px;
}
.store__product-box .btn-favorite{
	position: absolute;
	top: 0;
	right: 0;
}
.store__product-box .btn-modify{
	position: absolute;
	top: 0;
	right: 0;
}

.con-price{
	margin-top: 32px;
}
.con-price > strong{
	font-size: 20px;
	font-weight: 700;
}
.icon-price-con{
	display: inline-block;
	width: 21px;
	height: 21px;
	background: url('img/icon_pricecon.png') no-repeat 0 0;
	vertical-align: top;
	margin-left: 6px;
}

.store__product-box > dl::after{
	content: "";
	display: block;
	clear: both;
}
.store__product-box > dl > dt{
	float: left;
	width: 90px;
	line-height: 30px;
	font-size: 14px;
}
.store__product-box > dl > dd{
	float: left;
	width: calc(100% - 90px);
	line-height: 30px;
	font-size: 14px;
}
.store__product-box > dl > dd > a{
	color: #0096ff;
}
.btn-shortcut{
	width: 22px;
	height: 22px;
	border: 1px solid #d8d8d8;
	border-radius: 11px;
	margin-left: 6px;
}
.btn-shortcut .ico-pc{
	width: 6px;
	height: 12px;
	background-position: -288px -178px;
	margin-bottom: -1px;
}
.store__tips > li{
	position: relative;
	padding: 4px 0 4px 10px;
	font-size: 14px;
	line-height: 1.5em;
}
.store__tips > li::before{
	content: "";
	display: inline-block;
	position: absolute;
	top: 14px;
	left: 0;
	margin-top: -1px;
	width: 2px;
	height: 2px;
	background: #333;
}
.store__btn-box{
	font-size: 0;
}
.store__btn-box > button{
	
}
.btn-active{
	width: 70%;
	height: 40px;
	margin-right: 5px;
	background: #0096ff;
	color: #fff;
	border-radius: 2px;
}
.btn-inactive{
	width: calc(30% - 5px);
	height: 40px;
	border: 1px solid #d8d8d8;
	background: #f8f8f8;
	border-radius: 2px;
}
.store__connection{
	position: relative;
	margin-top: 50px;
}
.store__connection .btn-con-more{
	top: 10px;
}

.store__connection > h2 > em{
	font-size: 14px;
	color: #888;
	font-weight: 300;
	padding-left: 10px;
}

.register-header{
	margin-top: 20px;
	background: #fff;
	border-bottom: 1px solid #d8d8d8;
}
.register__write-index{
	position: relative;
	width: 1140px;
	margin: 0 auto;
	padding: 60px 20px;
	text-align: center;
	font-family: "Noto Sans KR", sans-serif;
}
.register__write-index > p{
	font-size: 26px;
	line-height: 38px;
	margin-bottom: 40px;
	font-weight: 500;
}
.btn-con-write{
	width: 300px;
	height: 50px;
	border: 2px solid #333;
	border-radius: 2px;
	font-family: "Noto Sans KR", sans-serif;
	font-size: 14px;
}
.btn-con-write:hover{
	color: #fff;
	background: #333;
	transition: ease 0.2s;
}
.register__body{
	background: #fbfbfb;
}
.register__body-wrap{
	position: relative;
	width: 1140px;
	margin: 0 auto;
	padding: 60px 20px;
	font-family: "Noto Sans KR", sans-serif;
}
.register__info::after{
	content: "";
	display: block;
	clear: both;
}
.register__info > li{
	float: left;
	width: 360px;
	margin-right: 30px;
}
.register__info > li:nth-last-of-type(1){
	margin-right: 0;
}
.register__info > li > img{
	display: block;
}
.register__info > li > p{
	margin-top: 30px;
	font-size: 16px;
	line-height: 1.5em;
}
.register__body-wrap > h2{
	font-size: 24px;
	font-weight: 500;
	color: #333;
	margin-top: 60px;
	padding-top: 60px;
	margin-bottom: 30px;
	border-top: 1px solid #d8d8d8;
}
.store__product-box--write > dl{
	margin-bottom: 10px;
}
.write-box{
	min-height: 33px;
	border: 1px solid #d8d8d8;
	padding: 0 10px;
	border-radius: 2px;
}
.write-box input,
.write-box textarea{
	font-family: "Noto Sans KR", sans-serif;
	width: 100%;
	height: 100%;
	resize: none;
	line-height: 1.5em;
	overflow: auto;
}
.product-price input{
	text-align: right;
}
.product-price{
	position: relative;
	padding-right: 30px;
}
.product-price .icon-token{
	position: absolute;
	top: 50%;
	right: 4px;
	margin-top: -8px;
	width: 16px;
	height: 16px;
}
.product-price .icon-token > img{
	vertical-align: top;
}
.write-box--field{
	height: 100px;
	padding: 4px 10px;
}
.store__btn-box .btn-con-write{
	display: block;
	width: 100%;
	text-align: center;
	line-height: 48px;
	cursor: pointer;
}
.con-thumb-wrap > input[type='radio'] + label > img{
	width: 100%;
}
.con-thumb-wrap > input[type='radio']:checked + label{
	border: 3px solid #0096ff;
	box-sizing: border-box;
}
.con-thumb-wrap::after{
	content: "";
	display: block;
	clear: both;
}
.uploading-con{
	display: block;
	position: relative;
	float: left;
	width: 196px;
	height: 196px;
	margin-right: 32px;
	margin-top: 30px;
}
.uploading-con:nth-of-type(5n){
	margin-right: 0;
}
.btn-con-delete{
	display: none;
	position: absolute;
	top: 5px;
	right: 5px;
	width: 26px;
	height: 26px;
	border-radius: 13px;
	background: rgba(0,0,0,0.3);
	z-index: 99;
}
.btn-con-delete:hover{
	background: rgba(0,0,0,0.4);
}
.btn-con-delete::before{
	content: "";
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -6px;
	margin-left: -1px;
	width: 2px;
	height: 12px;
	background: #fff;
	transform: rotate(45deg);
}
.btn-con-delete::after{
	content: "";
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -6px;
	margin-left: -1px;
	width: 2px;
	height: 12px;
	background: #fff;
	transform: rotate(-45deg);
}

.uploading-con:hover .btn-con-delete{
	display: block;
}

#upload-con + .uploading-con{
	background: #f8f8f8;
	color: #aaa;
	font-weight: bold;
	cursor: pointer;
	border: 1px solid #e7e7e7;
	box-sizing: border-box;
	background: #f8f8f8 url('img/no_image_product.png') no-repeat 50% 35%;
	-webkit-background-size: 100px 85px;
	background-size: 100px 85px;
}
#upload-con + .uploading-con em{
	display: inline-block;
	position: absolute;
	top: 70%;
	left: 50%;
	transform: translateX(-50%);
}
#upload-con + .uploading-con:hover{
	background: #f4f4f4 url('img/no_image_product.png') no-repeat 50% 35%;
	-webkit-background-size: 100px 85px;
	background-size: 100px 85px;
}

.store__write-terms{
	margin-top: 30px;
}
#chk-terms + label .terms-chk{
	display: inline-block;
	width: 32px;
	height: 32px;
	background: url('img/icon_terms.png') no-repeat 0 0;
	border: 0;
}
#chk-terms:checked + label .terms-chk{
	background-position: 0 -32px;
}
#chk-terms:checked + label .terms-chk::after{
	content: "";
	display: none;
}
#chk-terms + label + a{
	color: #0096ff;
	display: inline-block;
	margin-left: 10px;
}
.store__btn-wrap{
	margin-top: 50px;
}
.store__btn-wrap::after{
	content: "";
	display: block;
	clear: both;
}
.store__btn-wrap .left{
	float: left;
}
.store__btn-wrap .right{
	float: right;
}
.btn-default{
	height: 43px;
	min-width: 80px;
	padding: 0 20px;
	border: 1px solid #d8d8d8;
}
.btn-default.active{
	border-color: #0096ff;
	background: #0096ff;
	color: #fff;
}
.store__btn-wrap .btn-default{
	margin-right: 4px;
}
.store__btn-wrap .btn-default:nth-last-of-type(1){
	margin-right: 0;
}



/* store popup */
.store-pop{
	z-index: 100;
	font-family: "Noto Sans KR", sans-serif;
	display: none;
}
.store-pop *{
	font-family: "Noto Sans KR", sans-serif;
}
.pop-container{
	position: fixed;
	top: 100px;
	left: 50%;
	overflow: hidden;
	margin-left: -374px;
	background: #fff;
	border-radius: 10px;
	z-index: 11;
}
.dimmed{
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0,0,0,0.3);
	z-index: 1;
}
.pop-header{
	min-height: 50px;
}
.btn-pop-close{
	position: absolute;
	top: 15px;
	right: 15px;
	width: 20px;
	height: 20px;
}
.btn-pop-close > span{
	width: 20px;
	height: 20px;
	background-position: -276px -153px;	
}
.pop-contents{
	position: relative;
	width: 716px;
	max-height: calc(100vh - 300px);
	padding: 0 16px 70px;
	overflow: auto;
}
.pop-container h1{
	font-size: 20px;
	text-align: center;
	padding: 30px 0;
}
.pop-terms h2{
	font-size: 14px;
	font-weight: 500;
}
.pop-terms h3{
	font-size: 13px;
	font-weight: 300;
	margin-bottom: 10px;
	margin-top: 30px;
}
.pop-terms p{
	font-size: 13px;
	font-weight: 300;
	margin-bottom: 10px;
	line-height: 1.5em;
}
.pop-terms ol,
.pop-terms ul{
	margin-bottom: 20px;
}
.pop-terms li{
	font-size: 13px;
	font-weight: 300;
	padding: 3px 0;
	line-height: 1.5em;
}
.btn-pop-terms-agree{
	position: absolute;
	bottom: 0;
	width: 100%;
	height: 50px;
	background: #0096ff;
	color: #fff;
	border-radius: 0 0 10px 10px;
}

.pop-contents .store-component{
	padding: 0;
}
.pop-contents .store__product-img{
	width: calc(50% - 40px);
	position: relative;
	overflow: hidden;
	height: auto;
	border-radius: 20px;
}
.pop-contents .store__product-img::after{
	content: "";
	display: block;
	padding-bottom: 100%;
}
.store__product-img__box{
	position: absolute;
	width: 100%;
	height: 100%;
}
.pop-contents .store__product-desc{
	width: 50%;
}
.pop-contents .con-list{
	display: flex;
	flex-wrap: wrap;
}
.pop-contents .con-list > li{
	width: 20%;
	margin-right: 0;
	float: none;
	padding: 10px;
	box-sizing: border-box;
	margin-bottom: 0;
}
.pop-contents .con-thumb{
	width: 100%;
	height: auto;
	border-radius: 20px;
}


/* 2021-02-03 */
.my-box--con{
	min-height: 600px;
}
.list-con-thumb{
	width: 76px;
	height: 76px;
	border-radius: 10px;
	overflow: hidden;
	display: inline-block;
}
.list-con-thumb > img{
	width: 100%;
}
.buy-list{
	text-align: center;
}
.buy-list td{
	padding: 10px 0;
}
.sell-list{
	text-align: center;
}
.sell-list td{
	padding: 10px 0;
}
.btn-inner--product{
	border: 1px solid #d8d8d8;
	border-radius: 2px;
	min-width: 52px;
	padding: 0 12px;
	height: 33px;
	margin-left: 4px;
}
.btn-inner--product:nth-of-type(1){
	margin-left: 0;
}

.btn-inner--product__positive{
	border-color: #798892;
	background: #798892;
	color: #fff;
}
.btn-inner--product__negative{
	border-color: #f04040;
	background: #f04040;
	color: #fff;
}
.btn-inner--product__active{
	border-color: #0096ff;
	background: #0096ff;
	color: #fff;
}


/* page comment con style */

.btn-con{
	min-width: 60px;
	height: 31px;
	border-radius: 2px;
	padding: 0 5px;
	background: #edeef0;
	margin-left: 10px;
}
.btn-con.active{
	border: 1px solid #0096ff;
	color: #0096ff;
}
.commenting-util{
	position: relative;
}
.con-wrap{
	display: none;
	position: absolute;
	top: 50px;
	left: -1px;
	border: 1px solid #d8d8d8;
	border-radius: 4px;
	width: 496px;
	background: #fff;
	z-index: 100;
}
.con-wrap.active{
	display: block;
}
.con__header{
	padding: 10px 0;
}
.bx-controls-direction{
	position: relative;
	width: 496px;
	margin-top: -54px;
}
.con__header .bx-wrapper .bx-controls-direction a{
	width: 54px;
	height: 54px;
	top: 0;
	margin-top: 0;
}
.con__header .bx-wrapper .bx-prev{
	background: url('img/slider_left2.png') no-repeat 0 0;
	left: 10px;
}
.con__header .bx-wrapper .bx-next{
	background: url('img/slider_right2.png') no-repeat 0 0;
	right: 10px;
}
.con__header .bx-viewport{
	border-radius: 0;
	margin-left: 71px;
}
.con__latest > li{
	border-radius: 5px;
	overflow: hidden;
	cursor: pointer;
}
.con__title{
	margin: 0 0 10px 10px;
	font-weight: bold;
}
.con__title--body{
	margin-left: 0;
}
.con__body{
	padding: 10px;
	border-top: 1px solid #d8d8d8;
}
.con__wrapper{
	max-height: 232px;
	overflow: auto;
}
.con__wrapper::after{
	content: "";
	display: block;
	clear: both;
}
.con__wrapper > li{
	float: left;
	margin-right: 12px;
	margin-bottom: 12px;
	width: 105px;
}
.con__wrapper > li:nth-of-type(4n){
	margin-right: 0;
}
.con__wrapper > li > a{
	display: block;
	border-radius: 12px;
	overflow: hidden;
}
.con__wrapper > li > a > img{
	vertical-align: top;
	width: 100%;
}
.con__body--none{
	display: none;
	text-align: center;
	min-height: 120px;
}
.con__body--none > p{
	margin-top: 30px;
}
.con__body--none > a{
	display: inline-block;
	border-radius: 2px;
	padding: 8px 20px;
	border: 1px solid #0096ff;
	color: #0096ff;
	margin-top: 14px;
}
.con__body--none > a:hover{
	color: #fff;
	background: #0096ff;
	transition: ease 0.2s;
}
.con__latest--none{
	display: none;
	height: 54px;
	line-height: 54px;
	text-align: center;
}

.con__item-wrap{
	display: none;
}
.con__item-wrap__header{
	height: 30px;
	margin-bottom: 10px;
}
.btn-con-back{
	display: inline-block;
	color: #333;
}
.btn-con-back > div{
	display: inline-block;
	width: 30px;
	height: 30px;
	border-radius: 4px;
	text-align: center;
	line-height: 36px;
	vertical-align: middle;
	margin-right: 10px;
}
.btn-con-back:hover > div{
	background: #f8f8f8;
}
.btn-con-back .ico-pc{
	width: 10px;
	height: 18px;
	background-position: -410px 0;
}


/* navigation modify */
.nav-list > li > a{
	margin: 0 13px;
}


.upload-cover{
	display: block;
	position: relative;
	width: 100%;
	height: 100%;
	cursor: pointer;
}
.upload-cover em{
	display: inline-block;
	position: absolute;
	top: 68%;
	left: 50%;
	transform: translateX(-50%);
	color: #aaa;
	font-weight: bold;
}
.upload-cover:hover{
	background: #f4f4f4 url('img/no_image_product.png') no-repeat 50% 35%;
}

.img-con-cover{
	position: absolute;
	top: 0;
	left: 0;
	width: 580px;
	height: 580px;
	z-index: 10;
}
.img-con-cover img{
	width: 100%;
}
.img-con-cover .btn-con-delete{
	display: block;
}

.bx-wrapper .bx-controls-direction a.disabled{
	display: block;
}