@font-face { font-family: 'HangeulNuriB'; src: url(/resource/font/HangeulNuriB.ttf) format('truetype'), url(/resource/font/HangeulNuriB.eot); }
@font-face { font-family: 'HangeulNuriR'; src: url(/resource/font/HangeulNuriR.ttf) format('truetype'), url(/resource/font/HangeulNuriR.eot); }
.font-nurib { font-family: 'HangeulNuriB', Arial, Helvetica, sans-serif; }
.font-nurir { font-family: 'HangeulNuriR', Arial, Helvetica, sans-serif; }
:root {
--font-nurib: HangeulNuriB;
--font-nurir: HangeulNuriR;
}

.text-blue { color: var(--blue) !important; }
a.text-blue:hover, a.text-blue:focus { color: var(--blue) !important; }
.hand { cursor: pointer; }
.card-img-inner { height: 183.33px; background-repeat: no-repeat; background-position: center; background-size: cover; }
.table { border-bottom: 1px solid #dee2e6; }
.btn { font-size: .8rem; }
.badge-award { color: #212529; background-color: gold;}

header { display: flex; flex-direction: column; }
header .main_img { width: 100%; }
.hd-menu { font-size: 14px; background-color: #f9e8d2; }
.hd-menu > div { max-width: 1200px; margin: auto; }
.hd-menu a { color: #888;  }
.hd-menu a:hover { text-decoration: none; }
.hd-menu-left, .hd-menu-right { width: 100%; }
.hd-menu-left { display: flex; align-items: center; text-align: center; }
.hd-menu-left .text-blue { font-size: 20px; }
.hd-menu-left a { color: #000; }
.hd-menu-right ul { list-style: none; display: table; margin: 0; float: right; }
.hd-menu-right li { border-right: 1px solid #0002; height: 60px; display: table-cell; padding: 5px; width: 100px; vertical-align: middle; text-align: center; font-size: 12px; }
.hd-menu-right li:first-child { border-left: 1px solid #0002; }
#hd-mobile-link { max-width: 1200px; margin: 0 auto; width: 100%; }
#hd-mobile-link a { float: right; margin: .5rem; width: 120px; }
#hd-search { max-width: 1200px; margin: 0 auto; display: flex; width: 100%; justify-content: space-between; }
#hd-mobile-link img, #hd-search img { width: 100%; }
.main-icon { width: 65px; }
.main-icon img { box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); position: relative; top: -5px; left: 1rem; width: 100%;}
#hd-search .app-link { width: 120px; margin: 0 .5rem; border: 1px solid #0003; border-radius: .5rem; padding: .5rem; }

footer { display: none; width: 100%; }
.ft-wrap { border-top: 1px solid #0001; border-bottom: 1px solid #0001; margin-bottom: 1rem; }
.ft-menu { max-width: 1200px; margin: 1rem auto; font-size: 12px; }
.ft-menu li { cursor: pointer; }
.ft-info { font-size: 12px; max-width: 1200px; margin: 0 auto; }
.ft-info p { margin-bottom: .25rem; }
.footer { font-size: 10px; color: #0005; text-align: right; }

.sec { background-color: #e8f0f3; }
.con { max-width: 1200px; margin: 0 auto; position: relative; }

/* 카테고리 */
#category { background-color: #e8f0f3; }
.btn-category { max-width: 1200px; margin: 0 auto; border-radius: 0; }
#category-menu { max-width: 1200px; margin: 0 auto; position: relative; font-size: .75rem; }
#category-menu div.wrap { position: absolute; background: #e8f0f3; z-index: 10; top: -38px; max-width: 1200px; width: 100%; }
#category-menu .card-group { margin-bottom: 1rem; }

.con-title { text-align: center; padding-top: .5rem; }
.con-body { background-color: #fff; padding: .25rem; }
.con-body .con-list { margin-left: 0; margin-right: 0; }
.con_tit { border-bottom: 2px solid #444; display: flex; align-items: center; justify-content: space-between; }
.con_tit span { display: inline-block; padding: 7px 10px 5px; color: #fff; background-color: #444; font-size: .75rem; font-family: HangeulNuriB; }
.con_tit div > span:nth-child(1) { background-color: var(--info); }

#con1 .nav-pills .nav-link.active,
#con1 .nav-pills .show > .nav-link { background-color: #17a2b8; }

.con-list .card-body { height: 130px; }
.con-list .card-text { font-size: 80%; max-height: 4.5em; white-space: normal; -webkit-line-clamp: 3; -webkit-box-orient:vertical; display:-webkit-box; overflow: hidden; text-overflow: ellipsis; }
/* .con .card-body span { font-size: 70%; } */
.item-title { text-align: center; }
.item-sns a { opacity: .4; }
.item-sns a:hover { opacity: 1; }
.item-info .nav-link { font-size: 80%; color: #000; }
.item-info .nav-link.active { background-color: #dee2e6; font-family: var(--font-nurib); }
.item-info-text { margin: 0 auto; width: 100%; max-width: 800px; padding: 1rem; min-height: 400px; }
.item-info-text img { max-width: 100%; height: auto; }
.item-menu { position: fixed; right: 0; bottom: 0; left: 0; z-index: 1030; background-color: #eee; padding: 5px; }


.bg-jikjang { min-height: 100vh; }
.login-info { text-align: center; }
.login-info a { color: #000; font-size: 1.5rem; }
.login-info > div { display: flex; }
.login-info img { height: 100px; margin: 0 auto; display: block; border-radius: 50%; }
#login form { margin: 0 auto; max-width: 460px; background: #fff; padding: 40px 40px 30px; box-shadow: 0px 0px 13px rgba(0, 0, 0, 0.2); -webkit-box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 13px; -moz-box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 13px; }
#login label { font-size: .75rem; color: #777; margin: 10px 0; display: inline-block; }
#login .login-input { display: block; margin-bottom: 5px; padding: 0; width: 100%; background: url(/resource/img/input-rq.gif) no-repeat bottom right #fff !important; border: 0; border-bottom: 2px solid #000; height: 40px; line-height: 40px; font-size: 1rem; font-family: var(--font-family-sans-serif); }
#join input:invalid, #find-id input:invalid, .bg-jikjang input:invalid, #vm input:invalid { border-color: #f006; }
#join select:invalid, #find-id select:invalid, .bg-jikjang select:invalid, #vm select:invalid { border-color: #f006; }
#join textarea:invalid, #find-id textarea:invalid, .bg-jikjang textarea:invalid, #vm textarea:invalid { border-color: #f006; }
#join .btn-captcha, #find-id .btn-captcha { height: 31px; margin-left: 4px; }

#daum-post-wrap { display: none; border: 1px solid; width: 500px; height: 272px; margin: 0; position: absolute; z-index: 1; }

.bg-jikjang > div { margin: 0 auto; max-width: 800px; background: #fff; padding: 1rem; box-shadow: 0px 0px 13px rgba(0, 0, 0, 0.2); -webkit-box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 13px; -moz-box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 13px; }
.bg-jikjang > div .title { background-color: #343a40; padding: 1rem; color: #f8f9fa; text-align: center; }
.bg-jikjang .preview, #vm .preview { width: 100%; max-width: 180px; }

#con2 .con-list { overflow-x: hidden; height: calc( 100vh - 170px ); }

.dialog-button, .dialog-sure-button, .dialog-cancel-button { cursor: pointer; }

.con .btn-search-focus { display: none; }

/* 리스트 트랜지션 */
.slide-up-enter-active { transition: all .3s ease; }
.slide-up-leave-active { transition: all .8s cubic-bezier(0.68, -0.55, 0.27, 1.55); }
.slide-up-enter, .slide-up-leave-to { transform: translateY(60px); opacity: 0; }

.slide-left-enter-active { transition: 2s; }
.slide-left-leave-active { transition: .8s; }
.slide-left-enter { transform: translateX(1168px); opacity: .5; }
.slide-left-leave-to { transform: translateX(-1168px); opacity: .5; }

/* 모바일 */
.mobile-head .jikjang-icon { position: absolute; width: 15%; max-width: 60px; bottom: 15px; left: 15px; box-shadow: 0 8px 8px 0px rgba(0, 0, 0, 0.3); }


/* 지도 */
#map { height: calc(100vh - 215px); }

/* 모바일이 아닐때 */
@media (min-width: 576px) {
	.btn { font-size: 1rem; }
	.btn-sm, .btn-group-sm > .btn { font-size: .875rem; }
	.con-title { padding-top: initial; }
	.con-body { padding: 1rem; }
	#category { padding: .5rem 0 1px; }
	.btn-category { border-radius: .25rem; }
	.sec { padding: .5rem 0;  }
	#con2 .con-list { min-height: 950px; overflow-x: unset; height: auto; }
	.item-menu { position: initial; right: initial; bottom: initial; left: initial; z-index: initial; background-color: initial; padding: initial; }
	footer { display: block; }
	.bg-jikjang { background-color: #efefef; padding: 3rem 0; }
	/* 찾기포커스 버튼 */
	.con .btn-search-focus { display: initial; position: absolute; right: -40px; top: 0px; }
	.con .btn-search-focus:nth-of-type(2) { top: initial; bottom: 0px; }
	#map { height: calc(100vh - 340px); }
}

/* 결제화면보이기 */
#inicisModalDiv.fade:not(.show) { opacity: initial; }

/* sidepanel */
.sidepanel { height: 100vh; width: 200px; position: fixed; z-index: 10; top: 0; right: -200px; background-color: #343a40; overflow-x: hidden; padding-top: 60px; transition: 0.5s; }
.sidepanel .list-group-item { background-color: #343a40; border-bottom: 2px solid #666; }
.sidepanel a { padding: 8px 8px 8px 16px; text-decoration: none; color: #eee; display: block; }
.sidepanel .closebtn { position: absolute; top: -10px; right: 0; font-size: 30px; margin-left: 50px; }
