@charset "utf-8";

* { font-family: 'Pretendard', 'Noto Sans KR', sans-serif; }

body {background: #fff;}
.wrapper {height: auto !important;}

.display-none {display:none;}

@font-face{font-family: 'GmarketSans'; src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansLight.woff') format('woff'); font-weight: 300; font-style: normal}
@font-face{font-family: 'GmarketSans'; src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff'); font-weight: 500; font-style: normal}
@font-face{font-family: 'GmarketSans'; src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansBold.woff') format('woff'); font-weight: 700; font-style: normal}

._blind{position:absolute !important; top:-1px !important; left:-1px !important; width:1px !important; height:1px !important; overflow:hidden !important; clip:rect(0 0 0 0) !important; word-break:keep-all}

@media screen and (max-width:767px){
}
@media screen and (min-width:768px) and (max-width:1280px){
	section.container-lg{max-width: 600px; margin:0 auto}
}
@media screen and (max-width:1280px){
	.inner{padding:0 3vw}
	section.container-lg{padding:50px 3vw 50px}
}
@media screen and (min-width:1281px){
	.inner{width:1200px; margin-left:auto; margin-right:auto}
}

@media screen and (min-width:1281px) and (max-width:1399px){
	section.container-lg{max-width: 768px; margin:0 auto; padding: 125px 20px 200px}
}
@media screen and (min-width:1400px) and (max-width:1919px){
	section.container-lg{width: 100%; max-width: 1360px; margin:0 auto; padding: 125px 20px 200px}
}
@media screen and (min-width:1920px){
	section.container-lg{width: 1700px; margin: 0 auto; padding: 125px 20px 200px}
}
/* 인풋 */
input:disabled{color:var(--color-text)}
form.inputDefault label{display: block; font-weight:500}
form.inputDefault input[type="text"]{width: 100%; margin-bottom: 10px; box-sizing: border-box; border-radius: 500px; border: 1px solid var(--color-border-deep)}
form.inputDefault input[type="text"].input-primary{background-color: var(--color-background-primary)}
form.inputDefault input[type="text"].input-secondary{background-color: #fff}
div.inputWrap{display: flex}
form.inputDefault .divide{display: flex}
button.btn-input{border: 1px solid; background-color: var(--color-secondary); color: #fff; border-radius: 500px; flex-shrink: 0}
button.btn-input.delete{border: 1px solid var(--color-text-deep); background-color: var(--color-text-deep); color: #fff; border-radius: 500px; flex-shrink: 0}

div.gallary-input{display: flex}
div.gallary-input div.img{flex-shrink:0; background-color: #fff; border: 1px solid var(--color-border-deep); border-radius: 10px; background-image: url(../image/gallary-input.png); background-repeat: no-repeat; background-position: center}
button.gallary-btn-primary{border-radius: 500px; border: 1px solid var(--color-primary); color: var(--color-primary)}
button.gallary-btn-secondary{border-radius: 500px; border: 1px solid var(--color-text-deep); color: var(--color-text-date)}
div.gallary-input div.right div.info span{word-break:keep-all; display: flex; align-items: flex-start; color: var(--color-text-deeper)}
div.gallary-input div.right div.info span svg{fill: var(--color-icon-fill-lightest)}

form.inputDefault select.select-primary{width: 100%; margin-bottom: 10px; box-sizing: border-box; border-radius: 500px; border: 1px solid var(--color-border-deep); background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%235400FF' viewBox='0 0 9.98 5.99'%3E%3Cpath d='M5,6a1,1,0,0,1-.71-.3l-4-4A1,1,0,0,1,1.69.28L5,3.57,8.28.28a1,1,0,0,1,1.41,0,1,1,0,0,1,0,1.38l-4,4A1,1,0,0,1,5,6Z'/%3E%3C/svg%3E"); background-color: var(--color-background-primary); background-repeat:no-repeat}
form.inputDefault select.select-secondary{width: 100%; margin-bottom: 10px; box-sizing: border-box; border-radius: 500px; border: 1px solid var(--color-border-deep); background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%235400FF' viewBox='0 0 9.98 5.99'%3E%3Cpath d='M5,6a1,1,0,0,1-.71-.3l-4-4A1,1,0,0,1,1.69.28L5,3.57,8.28.28a1,1,0,0,1,1.41,0,1,1,0,0,1,0,1.38l-4,4A1,1,0,0,1,5,6Z'/%3E%3C/svg%3E"); background-color: #fff; background-repeat:no-repeat}

input[type="file"]{position: absolute; width: 0; height: 0; padding: 0; overflow: hidden; border: 0}
input.file-input{display: inline-block; margin-bottom: 10px; box-sizing: border-box; border-radius: 500px; border: 1px solid var(--color-border-deep)}
label.file-button{display: inline-block !important; vertical-align: middle; cursor: pointer; box-sizing:border-box; border: 1px solid; background-color: var(--color-secondary); text-align:center; color: #fff; border-radius: 500px; flex-shrink: 0}
div.inputDefault div.alarm{display: flex; align-items: center; color: var(--color-text-date)}
div.inputDefault div.alarm i svg{fill: var(--color-text-date)}

form.inputDefault div.selectinput{display: flex; background: #fff; margin: 5px; border-radius:500px; border: 1px solid var(--color-border-deep); width: 100%}
form.inputDefault div.selectinput select.select-secondary{max-width: 180px; border: 0; margin:0}
form.inputDefault div.selectinput input.input-secondary{border: 0; margin:0; padding-left:0}

form.inputDefault textarea {
    width: 100%;
    border: 1px solid var(--color-border-deep);
    border-radius: 20px;
    box-sizing: border-box;
    font-family: 'pretendard', 'Noto Sans KR', sans-serif
}

form.inputDefault div.line{height: 1px; width: 100%; background-color: var(--color-border-deep); margin: 50px 0}

@media screen and (max-width:428px){
	form.inputDefault .divide{flex-wrap:wrap}
	form.inputDefault .divide button.btn-input{width: -webkit-fill-available}
	
	div.gallary-input{flex-wrap: wrap}
	div.gallary-input div.right{width:100%; margin-top: 30px}
}
@media screen and (min-width:429px) and (max-width:1280px){
	form.inputDefault{margin:0 -5px}
	form.inputDefault.divide{display: flex}
	div.inputDefault{flex: 1; padding: 0 5px}
	div.gallary-input div.right{margin-left: 30px}
}
@media screen and (max-width:1280px){
	form.inputDefault label{font-size:1.07rem; margin-bottom: 0.62rem}
	div.inputDefault{margin-bottom: 1.25rem}
	form.inputDefault input[type="text"]{font-size: 1rem; padding: 1rem 1.25rem}
	form.inputDefault .divide{margin:-5px}
	form.inputDefault .divide input{margin:5px}
	form.inputDefault .divide select{margin:5px}
	form.inputDefault .divide button.btn-input{margin: 5px}
	
	button.btn-input{width: 6.67rem; font-size: 1rem; margin: 0 0 0.67rem 0.67rem; padding: 1rem 1.25rem}
	
	div.gallary-input div.img{width: 9.33rem; height:9.33rem}
	div.gallary-input div.right div.button{margin: 0 -4px 15px}
	button.gallary-btn-primary{font-size:1rem; padding: 10px 20px; margin: 0 4px}
	button.gallary-btn-secondary{font-size:1rem; padding: 10px 20px; margin: 0 4px}
	div.gallary-input div.right div.info span{margin-bottom: 8px}
	div.gallary-input div.right div.info span svg{width: 14px; margin: 2px 9px 0 0}
	
	form.inputDefault select.select-primary{font-size: 1rem; padding: 1rem 1.25rem; background-size:8px; background-position:calc(100% - 1.25rem) center}
	form.inputDefault select.select-secondary{font-size: 1rem; padding: 1rem 1.25rem; background-size:8px; background-position:calc(100% - 1.25rem) center}
	
	input.file-input{width:calc(100% - 7.59rem); font-size: 1rem; padding: 1rem 1.25rem}
	label.file-button{width: 6.67rem; font-size: 1rem; margin: 0 0 0.67rem 0.67rem; padding: 1rem 1.25rem}
	div.inputDefault div.alarm i svg{width:12px}
	
	form.inputDefault textarea{height: 200px; font-size: 1rem; padding: 1rem 1.25rem}
}
@media screen and (min-width:1281px){
	form.inputDefault{margin:}
	form.inputDefault.divide{display: flex}
	form.inputDefault label{font-size:1.13rem; margin-bottom: 0.94rem}
	div.inputDefault{flex: 1; padding: 0 5px; margin-bottom: 1.87rem}
	form.inputDefault input[type="text"]{font-size: 1.06rem; padding: 1.25rem 1.56rem}
	form.inputDefault .divide{margin:-5px}
	form.inputDefault .divide input{margin:5px}
	form.inputDefault .divide select{margin:5px}
	form.inputDefault .divide button.btn-input{margin: 5px}
	
	button.btn-input{width: 7.5rem; font-size: 1.06rem; margin: 0 0 0.62rem 0.62rem; padding: 1.25rem 1.56rem}
	
	div.gallary-input{align-items: flex-end}
	div.gallary-input div.img{width: 11.87rem; height:11.87rem}
	div.gallary-input div.right{margin-left: 40px}
	div.gallary-input div.right div.button{margin: 0 -4px 15px}
	button.gallary-btn-primary{font-size:1rem; padding: 10px 20px; margin: 0 4px}
	button.gallary-btn-secondary{font-size:1rem; padding: 10px 20px; margin: 0 4px}
	div.gallary-input div.right div.info span{margin-bottom: 8px}
	div.gallary-input div.right div.info span svg{width: 14px; margin: 3px 9px 0 0}
	
	form.inputDefault select.select-primary{font-size: 1.06rem; padding: 1.25rem 1.56rem; background-size: 10px; background-position:calc(100% - 1.56rem) center}
	form.inputDefault select.select-secondary{font-size: 1.06rem; padding: 1.25rem 1.56rem; background-size: 10px; background-position:calc(100% - 1.56rem) center}
	
	input.file-input{width: calc(100% - 8.37rem); font-size: 1.06rem; padding: 1.25rem 1.56rem}
	label.file-button{width: 7.5rem; font-size: 1.06rem !important; margin: 0 0 0.62rem 0.62rem; padding: 1.25rem 1.56rem}
	div.inputDefault div.alarm i{margin:0 10px}
	div.inputDefault div.alarm i svg{width:14px}
	
	form.inputDefault textarea{height: 300px; font-size: 1.06rem; padding: 1.25rem 1.56rem}
}


/* 버튼 */

div.btn-wrap{display: flex; justify-content: flex-end}
div.btn-wrap button{width: 100%}
button.btn-primary{background-color: var(--color-button-background); color: #fff; border-radius: 500px}
button.btn-secondary{background-color: var(--color-button-background-secondary); color: var(--color-text-date); border-radius: 500px}
button.btn-line-primary{background-color: #fff; color: var(--color-primary); border: 1px solid var(--color-primary); border-radius: 500px}
@media screen and (max-width:1280px){
	div.btn-wrap{margin: 3.33rem -0.33rem 0}

	button.btn-primary{padding: 1rem 0.67rem; font-size:1.07rem}
	button.btn-secondary{padding: 1rem 0.67rem; font-size:1.07rem}
	button.btn-line-primary{padding: 1rem 0.67rem; font-size:1.07rem}
	div.btn-wrap button{flex: 1 1 auto; margin:0 0.33rem}
}
@media screen and (min-width:1281px){
	div.btn-wrap{margin: 3.12rem -0.31rem 0}

	button.btn-primary{padding: 1.25rem 0.62rem; font-size:1.13rem}
	button.btn-secondary{padding: 1.25rem 0.62rem; font-size:1.13rem}
	button.btn-line-primary{padding: 1.25rem 0.62rem; font-size:1.13rem}
	div.btn-wrap button{max-width: 200px; margin: 0 0.31rem}
}

/* 마우스커서
@media screen and (min-width:1281px){
	div.mouse__cursor{position: absolute; left: 0; top: 0; width: 6px; height: 6px; z-index: 9999; border-radius: 50%; background-color:rgb(0 242 184); user-select: none; pointer-events: none; transition: transform 0.3s}
	div.mouse__cursor2{position: absolute; left: 0; top: 0; width: 30px; height: 30px; z-index: 9999; border-radius: 50%; background-color:rgb(0 242 184 / 15%); user-select: none; pointer-events: none; transition: transform 0.3s}
	div.mouse__cursor.active{display:none}
	div.mouse__cursor2.active{width: 70px; height: 70px; background-color:rgb(0 242 184 / 10%);}
} */

/* 더알아보기 */

div.more{display: flex; justify-content: center}
button.more{text-align: center}
button.more i.icon{display: block; transition:.3s}
button.more i.icon svg{fill: var(--color-icon-fill-primary)}

@media screen and (max-width:1280px){
	button.more{margin-top: 3.33rem; font-size: 15px}
	button.more i.icon{margin-top: 0.67rem}
	button.more:hover i.icon{margin-top: 1.33rem}
	button.more i.icon svg{width: 0.8rem}
}
@media screen and (min-width:1281px){
	button.more{height: 3.87rem; margin-top: 4.37rem; font-size: 1.13rem}
	button.more i.icon{margin-top: 0.94rem}
	button.more:hover i.icon{margin-top: 1.25rem}
	button.more i.icon svg{width: 1rem}
}

/* 사이트 이동 경로 (BreadcrumbList) */
ul.pageNav{display: flex; align-items: center}
li.pageNav-li{display: flex; align-items: center}
a.pageNav-li-a{display: block; color: var(--color-text-date)}
a.pageNav-li-a.home{background-color: var(--color-primary); aspect-ratio: 1 / 1; border-radius: 500px; display: flex; justify-content: center}
a.pageNav-li-a.home i.ic_home{display: flex; justify-content: center}
a.pageNav-li-a.home i.ic_home svg{fill: #fff}
li.pageNav-li:last-child a.pageNav-li-a{color:var(--color-text); font-weight:700}
li.pageNav-li:last-child i.arrow-next{display:none}
li.pageNav-li i.arrow-next svg{fill: var(--color-text-deep)}
@media screen and (max-width:1280px){
	div.pageNav{display:none}
}
@media screen and (min-width:1281px){
	div.pageNav{margin-bottom: 50px}
	a.pageNav-li-a{font-size: 15px}
	a.pageNav-li-a.home{width: 22px}
	a.pageNav-li-a.home i.ic_home svg{width: 11px}
	li.pageNav-li i.arrow-next{margin:0 10px}
	li.pageNav-li i.arrow-next svg{width: 5px}
}

ol.breadcrumb-lists{display:flex; align-items:center}
li.breadcrumb-list{display:flex; align-items:center}
a.breadcrumb-link{display:block; color:var(--color-text-date)}
a.breadcrumb-link.home{display:flex; justify-content:center; align-items:center; aspect-ratio:1 / 1; border-radius:500px; background-color:var(--color-primary)}
a.breadcrumb-link.home svg{display:block; fill:#fff}
li.breadcrumb-list:last-child a.breadcrumb-link{color:var(--color-text); font-weight:700}
li.breadcrumb-list:last-child i.arrow-next{display:none}
li.breadcrumb-list i.arrow-next svg{fill: var(--color-text-deep)}
@media screen and (max-width:1280px){
	nav.breadcrumb{display: none;}
	a.breadcrumb-link.home{width:1.375rem}
	a.breadcrumb-link.home svg{width:0.625rem; height:0.625rem}
	li.breadcrumb-list i.arrow-next{margin:0 0.625rem}
	li.breadcrumb-list i.arrow-next svg{width:0.3125rem}
}
@media screen and (min-width:1281px){
	a.breadcrumb-link{font-size:1rem}
	a.breadcrumb-link.home{width:1.375rem}
	a.breadcrumb-link.home svg{width:0.625rem; height:0.625rem}
	li.breadcrumb-list i.arrow-next{margin:0 0.625rem}
	li.breadcrumb-list i.arrow-next svg{width:0.3125rem}
}
/* 사이트 이동 경로 (BreadcrumbList) */

/* 정렬기준 (order) */
div.order-select{position:relative; display:flex; align-items:center}
select.order{font-weight:300; flex:1}
i.order-select-icon{position:absolute; top: 50%; transform: translate(0, -40%)}
i.order-select-icon svg{fill:var(--color-icon-fill-primary)}
@media screen and (max-width:1280px){
	div.order-select{width:100px; padding: 2.5rem 3vw 1.25rem;}
	select.order{font-size:15px; padding:0 10px 0 0}
	i.order-select-icon{right:10px}
	i.order-select-icon svg{width:11px}
}
@media screen and (min-width:1281px){
	div.order-select{width:6.875rem}
	select.order{font-size:1rem; padding:0 0.625rem 0 0}
	i.order-select-icon{right:0.625rem}
	i.order-select-icon svg{width:0.75rem}
}
/* 정렬기준 (order) */

/* listOption */

@media screen and (max-width:1280px){
	button.listOption{width:1.33rem}
	button.listOption svg{fill: var(--color-icon-fill-lightest)}
}
@media screen and (min-width:1281px){
	button.listOption{display:none}
}




/* 주소 찾기 */
#postcode-layer[open] {display: flex; flex-direction: column; border:none; outline: none; padding: 0; width: 500px; height: 556px; box-shadow: 0 0 18px 2px rgba(0,0,0,.3);}
.postcode-header {display: flex; align-items: center; justify-content: space-between; height: 56px; padding-left: 20px; background: #eee; border-bottom: 1px solid #222;}
.postcode-title {font-size: 20px;}
.postcode-close {cursor: pointer; width: 56px; aspect-ratio: 1/1; box-sizing: border-box; font-size: 20px; display: flex; justify-content: center; align-items: center;}
.postcode-close:hover {background: #f00; color: #fff;}
#postcode-daum {flex: 1; width: 100%; height: 100%; }

@media screen and (min-width: 1281px) {
}
@media screen and (max-width: 1280px) {
	#postcode-layer[open] {width: 100%; height: 100%; margin: 0; max-width: 100%; max-height: 100%;}	
}