@charset 'utf-8';
.clearfix:after { content: ''; display: block; clear: both; }
legend, .blind, caption { position: absolute; top: 0; height: 0; font-size: 0; line-height: 0; text-indent:-9999em; overflow: hidden; }
.mobile-only { display: none !important; }
.pc-only { display: block !important; }
img { vertical-align: middle; }
hr { border: 0; border-top: 1px solid #e6e6e6; margin: 16px 0; }
input, select, textarea, button { font-family: 'Noto Sans KR', sans-serif; }
select[disabled] { background-color: #f6f6f6; cursor: not-allowed; color: #565656; }

.accordion { width: 100%; }
.border-top { border-top: 1px solid #e6e6e6; }
.border-bottom { border-bottom: 1px solid #e6e6e6; }
.not-border-bottom { border-bottom: 0 !important; }
.not-border-top { border-top: 0 !important; }
.t-underline { text-decoration: underline; }
.bgwhite { background-color: #fff; }
.icon-new { display: inline-block; vertical-align: middle; width: 31px; height: 14px; background: url(../../images/mobile/icon_new.png) center center no-repeat; background-size: contain; }
.icon-sold-out { width: 38px; height: 18px; background: url(../../images/mobile/icon_sold-out.png) center center no-repeat; background-size: contain; display: inline-block; }
.icon-sold-out span { display: none; }
.input-regular.btn-add { width: calc(100% - 72px); margin-right: 4px; }
.btn-regular { font-weight: 500; color: #767676; }
.btn-regular.gray-16-line { color: #161616; }
.btn-medium { font-weight: 500; }
.btn-large { font-weight: 500; }
.input-regular.unit-add { width: calc(100% - 24px); margin-right: 4px; }
.textarea-regular { display: inline-block; min-width: 200px; padding: 8px 12px; border: solid 1px #e9e9e9; background-color: #ffffff; font-size: 13px; font-weight: 400; text-align: left; color: #161616; letter-spacing: -0.65px; transition:all 0.5s; }
.lineh-15 { line-height: 1.5; }
.lineh-155 { line-height: 1.55; }
.margin-t28 { margin-top: 28px !important; }
.margin-t40 { margin-top: 40px !important; }
.padding-t40 { padding-top: 40px !important; }
.padding-b70 { padding-bottom: 70px !important;}
.width190 { width: 190px !important; }
.max-width img { max-width: 100%; }



.file-upload .gallery .delete { top: 2px; right: 2px; width: 20px; height: 20px; background: rgba(0,0,0,0.2) url(../../images/mobile/icon_close_white.png) center center no-repeat; background-size: contain; }
.file-upload .gallery .img-thumb { width: 76px; height: 76px; border-radius: 4px; overflow: hidden; }
.file-upload .gallery img { width: 100%; height: 100%; object-fit: cover; border-radius: 4px; }

.datepicker-here.icon-type { background: #ffffff url(../../images/component/icon_date.png) 5px center no-repeat; background-size: 24px 24px; padding-left: 37px; }

.btn-split2 { float:left; width: calc((100% - 8px)/2) !important; margin: 0; }
.btn-split2 + .btn-split2{ margin-left: 8px; }

.btn-split3 + .btn-split3 { margin-left: 8px; }
.btn-split3 { float:left; width: calc((100% - 16px)/3) !important; margin: 0; }

/*input-split*/
.input-split2 { float:left; min-width: calc((100% - 8px)/2) !important; width: calc((100% - 8px)/2) !important; margin: 0; }
.input-split2 + .input-split2 { margin-left: 8px; }
.input-split3 { float:left; min-width: calc((100% - 16px)/3) !important; width: calc((100% - 16px)/3) !important; margin: 0; }
.input-split3 + .input-split3 { margin-left: 8px; }
.input-split4 { float:left; min-width: calc((100% - 24px)/4) !important; width: calc((100% - 24px)/4) !important; margin: 0; }
.input-split4 + .input-split4 { margin-left: 8px; }

.align-left { text-align: left; }
.align-right { text-align: right; }
.align-center { text-align: center; }
.f-left { float: left; }
.f-right { float: right; }

.like > a { display: block; width: 32px; height: 32px; transition: all 0.5s; background: url(../../images/mobile/icon_heart_n.png) center center no-repeat; background-size: contain; transform: scale(1.0); }
.like > a.active { background: url(../../images/mobile/icon_heart_s.png) center center no-repeat; background-size: contain; }

input[type="checkbox"] { margin-top: -3px !important; }
input[type="radio"] { margin-top: -2px !important; }
input[type="checkbox"]:checked { background-color: #387df7; border: 1px solid #387df7; }
input[type="radio"]:checked:before { background: #387df7; }

.cart-list-quantity { display: block; width: 88px; margin: 0 auto; overflow: hidden; }
.cart-list-quantity .btn-minus { float: left; width: 24px; height: 24px; border: 0; transition: all 0.5s; margin: 0; }
.cart-list-quantity .btn-minus span { display: inline-block; width: 24px; height: 24px; margin: 0; vertical-align: middle; background: url(../../images/mobile/icon_minus.png) center center no-repeat; background-size: contain; text-indent:-5000px; }
.cart-list-quantity .input { float: left; width: 40px; height: 24px; line-height: 22px; font-size: 12px; margin: 0; padding: 0; text-align: center; border-top: 1px solid #e6e6e6; border-bottom: 1px solid #e6e6e6; }
.cart-list-quantity .btn-plus { float: left; width: 24px; height: 24px; border: 0; transition: all 0.5s; }
.cart-list-quantity .btn-plus span { display: inline-block; width: 24px; height: 24px; margin: 0; vertical-align: middle; background: url(../../images/mobile/icon_plus.png) center center no-repeat; background-size: contain; text-indent:-5000px; }

.img-list > ul { overflow: hidden; }
.img-list > ul > li { float: left; width: 80px; height: 80px; border-radius: 8px; overflow: hidden; background: url(../../images/mobile/no_image_type_a.png) center center no-repeat; background-size: contain; margin: 0 8px 0 0; }
.img-list > ul > li .img-popup { margin: 0; padding: 0; }
.img-list > ul > li .img-popup .inner-wrap { margin: 0; padding: 0; }
.img-list > ul > li img { width: 80px; height: 80px; }


input[type='text']::placeholder { color:#b6b6b6; letter-spacing:-1px;}
input[type='email']::placeholder { color:#b6b6b6; letter-spacing:-1px;}
input[type='password']::placeholder { color:#b6b6b6; letter-spacing:-1px;}
input[type='number']::placeholder { color:#b6b6b6; letter-spacing:-1px;}
input[type='tel']::placeholder { color:#b6b6b6; letter-spacing:-1px;}
input[type='button']::placeholder { color:#b6b6b6; letter-spacing:-1px;}
input[type='submit']::placeholder { color:#b6b6b6; letter-spacing:-1px;}
input[type='reset']::placeholder { color:#b6b6b6; letter-spacing:-1px;}
input[type='file']::placeholder { color:#b6b6b6; letter-spacing:-1px;}
input[type='search']::placeholder { color:#b6b6b6; letter-spacing:-1px;}
textarea::placeholder { color:#b6b6b6; letter-spacing:-1px;}


/*인덱스팝업*/
.index-popup {
	width: calc(100% - 48px) !important;/* max-width: calc(100% - 48px) !important;*/
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.8);
}
.index-popup .btn-split2 { width: 50% !important; }
.index-popup .btn-split2.btn-medium { border: 0 !important; border-top: 1px solid #e6e6e6 !important; border-radius: 0!important; }
.index-popup .btn-split2.btn-medium + .btn-split2.btn-medium { border-left: 1px solid #e6e6e6 !important; }
.index-popup .popup-content {background-color:#fff; border-top-left-radius:8px; border-top-right-radius:8px;}
.index-popup .popup-content img { width: 100%;height:100%;object-fit:contain; }


/*mobile용*/
.popup { /*min-width: calc(100% - 32px);*/ width: calc(100% - 32px); margin-top: 20px; }
.popup .inner-wrap { padding: 32px 16px 16px; }
.popup .inner-wrap .popup-header { margin-bottom: 18px; }
.popup .temp-content { padding: 0; height: 440px; }


.paginate-area { display: block; width: 226px; margin: 24px auto 0; }
.paginate-area ul li.on a { background: #387df7; border: 1px solid #387df7; }
.paginate-area ul li.on a:hover { background: #387df7; border: 1px solid #387df7; }


.btn-switch { width: 40px !important; height: 24px !important; border-radius: 20px; }
.btn-switch:after { width: 20px; height: 20px; box-shadow:0 1px 8px rgba(0,0,0,0.1); background:#fff; content:''; border-radius: 50vh; margin-top:-10px; right: 1px; }
.btn-switch.inactive:after { left: 1px !important; }


.app-setting { background-color: #fff; }
.app-setting > ul { overflow: hidden; }
.app-setting > ul + ul { border-top: 1px solid #e6e6e6; }
.app-setting > ul > li h1 { padding: 16px 16px; float: left; font-size: 14px; font-weight: 500;}
.app-setting > ul > li .switch-setting { padding: 10px 16px; float: right; text-align: right; }
.app-setting > ul > li p { clear: both; font-size: 11px; font-weight: normal; line-height: 1.55; letter-spacing: -0.7px; text-align: left; color: #767676; padding: 0 16px 12px; }


.category-slider { padding-left: 0; width: 100%; height: 40px; background: #fff; border: 0; }
.category-slider .swiper-container { width: 100%; height: 100%; }
.category-slider .swiper-container .swiper-wrapper { width: 100%; height: 100%; position: relative; }
.category-slider .swiper-container .swiper-wrapper .swiper-slide { width: 72px !important; text-align: center; }
.category-slider .swiper-container .swiper-wrapper .swiper-slide .category { display: inline-block; width: 100%; font-size: 13px; color: #161616; line-height: 38px; padding: 0; margin: 0; }
.category-slider .swiper-container .swiper-wrapper .swiper-slide .category.active { font-weight: bold; color: #387df7; border-bottom: 2px solid #387df7; }


.gray-76-font { color: #767676 !important; }
.gray-76-bg { background-color: #767676 !important; }
.gray-76-line { border-color: #767676 !important; }

/*======================================
1. 공통 요소 영역 (헤더/푸터/퀵메뉴 등)
======================================*/
html { width: 100%; }
body { width: 100%; height: 100%; padding: 0; margin: 0; background-color: #f3f3f3; }
#sb-site { width: 100%; }
#wrapper { width: 100%; height: 100%; padding: 44px 0 0; }
#header { position: fixed; top: 0; left: 0; width: 100%;  height: 44px; padding: 6px 0; background-color: #fff; border-bottom: 1px solid #e6e6e6; z-index: 10; }
#content { width: 100%; min-height: 400px; }
#footer { width: 100%; padding: 0 16px; }





body.fixed-bottom-btn-active #wrapper { padding-bottom: 76px; }
body.fixed-bottom-btn-active #footer { margin-top: 24px; }
body.not-footer #footer { display: none; }
body.wrapper-bottom-padding #wrapper { padding-bottom: 80px; }


/* 헤더 */
#header .left { float: left; height: 100%; }
#header .right { float: right; height: 100%; }
#header .right > a { margin-left: 8px; }
#header > h1 { display: none; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 144px; height: 32px; }
#header > h1 a { display: inline-block; width: 100%; height: 100%; background: url(../../images/mobile/logo.png) center center no-repeat; background-size: contain; text-indent: -5000px; }
#header > h1.active { display: inline-block; }
#header .back { display: inline-block; width: 48px; height: 28px; background: url(../../images/mobile/icon_back.png) center center no-repeat; background-size: contain; text-indent: -5000px; margin-top: 2px; }
#header .back.not { display: none; }
/*menu*/
#header .menu { display: block; width: 32px; height: 32px; background: url(../../images/mobile/icon_menu.png) center center no-repeat; background-size: contain; text-indent: -5000px; margin-right: 10px; }
#header .menu.not { display: none; }


/* 푸터 */
#footer .fnb { text-align: center; border-bottom: 1px solid #e9e9e9; padding: 16px 0; }
#footer .fnb ul { text-align: center; }
#footer .fnb ul li { display: inline-block; }
#footer .fnb ul li + li { margin: 0 0 0 14px; }
#footer .fnb ul li a { font-size: 11px; font-weight: normal; line-height: 1.55; letter-spacing: -0.55px; text-align: center; color: #b6b6b6; }
#footer > h1 { margin: 32px 0 0; opacity: 0.8; font-size: 12px; font-weight: 700; color: #ffffff; text-align: center; }
#footer .info { text-align: center; margin: 16px 0 0; }
#footer .info h1 { display: block; width: 104px; height: 24px; margin: 0 auto; }
#footer .info h1 img { width: 100%; height: 100%; }
#footer .info p { display: block; width: 100%; font-size: 11px; font-weight: normal; line-height: 1.55; letter-spacing: -0.55px; text-align: center; color: #868686; margin: 8px 0 0; }
#footer .copyright { font-size: 10px; font-weight: normal; line-height: 1.5; letter-spacing: normal; text-align: center; color: #d6d6d6; margin: 16px 0 24px; }



/* 메뉴레이어 */
.con_bg { display: none; position: absolute; width: 100%; height: 100%; background-color: rgba(0,0,0,0.4); text-indent: -5000px; z-index: 99;}
.con_bg.on {display: block; }
.sb-slidebar.sb-right { background: #fff; overflow: hidden; z-index: 100; }
.sb-slidebar .top { background: #9e292f; padding: 6px 8px; text-align: left; overflow: hidden; }
.sb-slidebar .top h1 { display: inline-block; width: 84px; height: 32px; }
.sb-slidebar .top h1 a { display: block; width: 100%; height: 100%; }
.sb-slidebar .top h1 a img { width: 100%; height: 100%; }
.sb-slidebar .top .sb-close { position: absolute; top: 8px; right: 8px; width: 28px; height: 28px; background: url(../../images/mobile/icon_close_white.png); background-size: contain; text-indent: -5000px; z-index: 10; }
.sb-slidebar .top .btn { padding: 16px 8px 8px; overflow: hidden; }
.sb-slidebar .top .btn .btn-regular { border: 0; line-height: 34px; }
.sb-slidebar .top .info-btn { overflow: hidden; }
.sb-slidebar .top .info-btn .info { float: left; }
.sb-slidebar .top .info-btn .info p { font-size: 14px; font-weight: 500; line-height: 1.43; letter-spacing: -0.7px; text-align: left; color: #ffffff; }
.sb-slidebar .top .info-btn .info p span { display: inline-block; margin: 0 0 0 2px; font-size: 12px; color: #ffffff;}
.sb-slidebar .top .info-btn .info a { display: block; font-size: 10px; font-weight: normal; line-height: 1.5; letter-spacing: -0.5px; text-align: left; color: #ffffff; margin: 2px 0 0; }
.sb-slidebar .top .info-btn .btn-small { float: right; width: 53px; height: 24px; line-height: 22px; background: none; border-radius: 4px; border: solid 1px #ffffff; padding: 3px 0; font-size: 10px; font-weight: normal; line-height: 1.5; letter-spacing: -0.5px; text-align: left; color: #ffffff; text-align: center; margin: 5px 0; }
.sb-slidebar .gnbWrap { height: 100%; overflow: auto; background: #fff; padding-bottom: 240px; }
.sb-slidebar .gnbWrap .gnbBox { margin: 0; padding: 0; border-top: 1px dotted #e6e6e6; }
.sb-slidebar .gnbWrap .gnbBox > li { margin: 0; padding: 0; list-style-type: none; border-bottom: 1px dotted #e6e6e6; }
.sb-slidebar .gnbWrap .gnbBox > li > a,
.sb-slidebar .gnbWrap .gnbBox > li .title { position: relative; display: block; padding: 14px 20px 14px 16px; height: auto; line-height: 1.47; font-size: 14px; color: #161616; font-weight: 500; background: #fff; }
.sb-slidebar .gnbWrap .gnbBox > li .title { background: #fff url(../../images/component/icon_accordion_arrow_down.png) right 10px center no-repeat; background-size: 28px 28px; }
.sb-slidebar .gnbWrap .gnbBox > li .title a { color: #464646; }
.sb-slidebar .gnbWrap .gnbBox > li ul { display: none; background: #f6f6f6; border-top: 1px dotted #e6e6e6; padding: 4px 4px 4px; margin: 0; }
.sb-slidebar .gnbWrap .gnbBox > li ul li a { display: block; font-size: 12px; line-height: 1.46; text-align: left; color: #868686; margin: 12px 0 12px 12px; }
.sb-slidebar .gnbWrap .gnbBox > li ul li a:before { content: " - "; }
.sb-slidebar .gnbWrap .gnbBox > li.on .title { background: #fff url(../../images/component/icon_accordion_arrow_up.png) right 10px center no-repeat; background-size: 28px 28px; }
.sb-slidebar .gnbWrap .gnbBox > li.on ul { display: block; }


/*========== 컨텐츠 공용 시작 ==========*/
/*swiper*/
.slider .swiper-container { height: auto; }
.swiper-container.main-visual .swiper-slide {max-height:420px;}
.swiper-container.main-visual .swiper-slide img { width: 100%;height:auto;object-fit:fill; }
.swiper-container-horizontal >.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction { left: auto !important; right: 16px; bottom: 8px; width: 65px; height: 25px; border-radius: 13px; background-color: rgba(0, 0, 0, 0.4); font-size: 11px; }
.swiper-pagination-bullet.swiper-pagination-bullet { width: 6px; height: 6px; }
.swiper-pagination-bullet.swiper-pagination-bullet-active { background: #387df7; }
.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 2px;}


.list-empty { background: #fff; padding: 40px 0 70px; text-align: center; }
.list-empty img { width: 60px; height: 60px; }
.list-empty p { font-size: 12px; font-weight: 400; color: #b6b6b6; text-align: center; margin: 10px 0 0; letter-spacing: normal; }
.list-empty.small { padding: 24px 0; }
.list-empty.large { padding: 160px 0 200px; }


/*서브타이틀*/
.sub-title-area h1 { position: fixed; top: 6px; left: 77px; width: calc(100% - 144px);  height: 32px; line-height: 32px; text-align: center; font-size: 15px; font-weight: 500; color: #161616; z-index: 100; }
.sub-title-area.type-b h1 { left: 45px; width: calc(100% - 90px); }


/*temp-content*/
.temp-content { position: fixed; left: 0; top: 44px; width: 100%; height: calc(100% - 44px); padding: 16px; background: #fff; }
.temp-content pre { padding: 16px; height: 100%; background-color: #fff; font-size: 13px; color: #a6a6a6; line-height: 1.5; overflow-x: hidden; overflow-y: auto; white-space: pre-line; border: 1px solid #e6e6e6; border-radius: 4px; }


/*결과*/
.result-area { background: #fff; padding: 145px 32px 48px; text-align: center; }
.result-area .logo img { display: block; margin: 0 auto; width: 190px; height: 72px; }
.result-area > h1 { font-size: 18px; font-weight: 500; line-height: 1.5; text-align: center; margin: 10px 0 0; }
.result-area > p { font-size: 11px; text-align: center; color: #b6b6b6; line-height: 1.55; letter-spacing: -0.55px; }


.member-out-radio li + li { margin: 8px 0 0; }


/*게시판 목록 공통*/
.board-list-area { background: #fff; padding: 18px 16px 0; border-bottom: 1px solid #e6e6e6; }
.board-list-area ul { display: table; width: 100%; }
.board-list-area ul li { display: table-cell; vertical-align: middle; }
.board-list-area ul li.num { width: 14%; }
.board-list-area ul li.date { width: 25%; }
.board-list-area ul li.state { width: 25%; }
.board-list-area ul li.price { width: 22%; }
.board-list-area ul li.split2 { width: 50%; }
.board-list-area ul li.split3 { width: 33.3%; }
.board-list-area ul li.split4 { width: 25%; }
.board-list-area ul li.split5 { width: 20%; }
.board-list-area ul li.split6 { width: 16.66%; }
.board-list-area ul li.split7 { width: 14.28%; }

.board-list-area .board-list-header ul li { padding: 10px 0; text-align: center; font-size: 10px; color: #a6a6a6; background: #f9f9f9; border-top: 1px solid #161616; }
.board-list-area .board-list-header > div { width: 100%; display: block; height: auto; background: #f9f9f9; padding: 0; }
.board-list-area .board-list-content > div { position: relative; width: 100%; display: block; height: auto; background: #fff; padding: 0; }
.board-list-area .board-list-content > div + div { border-top: 1px solid #e6e6e6; }
.board-list-area .board-list-content > div > ul > li { padding: 8px 0; height: 50px; font-size: 12px; line-height: 1.46; letter-spacing:-0.65px; text-align: center; color: #767676; }
.board-list-area .board-list-content > div > ul > li.subject { position: relative; text-align: left; padding-left: 8px; color: #464646; }
.board-list-area .board-list-content > div > ul > li.subject > a p { font-size: 12px; color: #161616; width: 95%; }
.board-list-area .board-list-content > div > ul > li.subject a:hover { text-decoration: underline; }
.board-list-area .board-list-content > div > ul > li.date { font-size: 12px; color: #868686; }
.board-list-area .board-list-content > div > ul > li.state span { font-size: 12px; color: #868686; font-weight: 500; }


/* faq */
.accordion.faq { background: #fff; width: 100%; padding: 8px 16px 0; border-bottom: 1px solid #e6e6e6; }
.accordion.faq .inner-wrap { border-top: 1px solid #161616; }
.accordion.faq .inner-wrap > ul > li .accordion-header { position: relative; height: auto; padding: 16px 30px; overflow: hidden; margin: 0 0 -4px; }
.accordion.faq .inner-wrap > ul > li .accordion-header:before { position: absolute; left: 14px; top: 16px; content: 'Q'; display: inline-block; font-size: 12px; font-weight: normal; line-height: 1.5; letter-spacing: -0.6px; text-align: center; color: #868686; }
.accordion.faq .inner-wrap > ul > li .accordion-header span { float: left; font-size: 12px; font-weight: normal; line-height: 1.5; letter-spacing: -0.6px; text-align: left; color: #868686; padding-left: 8px; }
.accordion.faq .inner-wrap > ul > li .accordion-header p { float: left; width: calc(100% - 60px); font-size: 12px; font-weight: normal; line-height: 1.5; letter-spacing: -0.6px; text-align: left; color: #161616; }
.accordion.faq .inner-wrap > ul > li .accordion-content { position: relative; background-color: #f9f9f9; padding: 0; border-top: 1px solid #e6e6e6; }
.accordion.faq .inner-wrap > ul > li .accordion-content img { max-width: 100%; margin: 16px 0 0; border-radius: 4px; }
.accordion.faq .inner-wrap > ul > li .accordion-content p { font-size: 12px; line-height: 1.5; letter-spacing: -0.6px; }
.accordion.faq .inner-wrap > ul > li:last-child .accordion-header { border-bottom: 0; }
.accordion.faq .inner-wrap > ul > li:last-child .accordion-content { border-top: 1px solid #e6e6e6; margin-top: 4px; border-bottom: 0; }



/*게시판 보기*/
.board-view-area { background: #fff; padding: 0 16px; overflow: hidden; border-bottom: 1px solid #e6e6e6; }
.board-view-area .header { position: relative; border-bottom: 1px solid #e6e6e6; display: inline-block; width: 100%; height: auto; padding: 16px 0; }
.board-view-area .header h1 { font-size: 14px; font-weight: 500; color: #363636; word-break: break-all; }
.board-view-area .header .info { margin: 10px 0 0; }
.board-view-area .header .info li { float: left; font-size: 11px; color: #868686; margin: 0 8px 0 0; }
.board-view-area .header .info li a { font-size: 11px; color: #868686; text-decoration: underline; }
.board-view-area .content { padding: 14px 0 24px; font-size: 13px; color: #161616; line-height: 1.4; min-height: 170px; word-break: break-all; }
.board-view-area .content img { max-width: 100%; margin: 16px 0 0; border-radius: 4px; min-height: 116px; }
.board-view-area .img img { max-width: 100%; height: auto; }
/*답변*/
.board-view-area .re-header { text-align: center; height: 32px; line-height: 32px; background-color: #f3f3f3; font-size: 12px; font-weight: 500; color: #767676; }


/*admin-re*/
.admin-re { border-top: 1px solid #e6e6e6; }
.admin-re > h1 { background-color: #f9f9f9; padding: 8px; font-size: 12px; font-weight: 400; color: #868686; text-align: center; }
.admin-re > div { font-size: 13px; color: #161616; padding: 24px 0; line-height: 1.46; min-height: 216px; }


/*table-type-area*/
.table-type-area > ul { border-top: 1px solid #e6e6e6; padding-top: 16px; }
.table-type-area > ul > li { display: table; width: 100%; margin: 0; height: 36px; }
.table-type-area > ul > li > * { display: table-cell; vertical-align: top; padding: 8px 0; }
.table-type-area > ul > li > .title { font-size: 12px; font-weight: bold; color: #868686; width: 100px; }
.table-type-area > ul > li > .title span { color: #c8242c; }
.table-type-area > ul > li > .con { text-align: left; font-size: 13px; }


/*block-type-area*/
.block-type-area { background: #fff; padding: 0 16px 24px; overflow: hidden; }
.block-type-area > ul > li { margin: 24px 0 0; }
.block-type-area > ul > li .title { font-size: 12px; font-weight: 600; color: #161616; overflow: hidden; }
.block-type-area > ul > li .title > span { font-weight: 600; color: #387df7; }
.block-type-area > ul > li .title .f-left { float: left; }
.block-type-area > ul > li .title .f-right { float: right; }
.block-type-area > ul > li .con { margin: 8px 0 0; font-size: 13px; }
.block-type-area > ul > li .con .unit-box .input-regular { width: calc(100% - 40px); }
.block-type-area > ul > li input[type="radio"] { vertical-align: middle; margin-top: -2px; }
.block-type-area > ul > li .con .search-date input.input-regular { width: calc(50% - 10px); }
.block-type-area > ul > li .con input[type="radio"] { margin-left: 0; }
.block-type-area > ul > li .con .btn-add + .btn-regular { padding:0 0; }
.block-type-area .help-text { font-size: 11px; font-weight: normal; line-height: 1.55; letter-spacing: -0.55px; text-align: left; color: #868686; margin: 8px 0 0; }


.push-list { margin: 16px 0 0; padding-bottom: 32px; border-bottom: 1px solid #e6e6e6; }
.push-list > ul > li { position: relative; }
.push-list > ul > li a { display: block; border: 1px solid #e6e6e6; border-radius: 4px; padding: 16px 40px 16px 16px; background: #fff; margin: 8px 0 0; }
.push-list > ul > li .date { font-size: 12px; color: #a6a6a6; }
.push-list > ul > li .con { font-size: 13px; color: #565656; margin: 8px 0 0; }
.push-list > ul > li .delete { position: absolute; top: 10px; right: 10px; display: block; width: 20px; height: 20px; background: url(../../images/component/icon_modal_close.png) center center no-repeat; background-size: contain; z-index: 1; }
.push-list > ul > li.read a { background: #f9f9f9; }
.push-list > ul > li.read .con { color: #a6a6a6; }


/* Login */
.login-area { background: #fff; padding: 96px 32px; text-align: center; }
.login-area h1 { margin: 0 0 16px; line-height: 1; text-align: center; }
.login-area h1 img { width: 192px; height: 72px; }
.login-area .input { width: 100%; height: 50px; border-radius: 4px; padding: 15px 16px; font-size: 14px; letter-spacing:-0.65px; }
.login-area li + li { margin-top: 8px; }
.login-area button[type="submit"] { }
.login-chk-link { margin-top: 24px; }
.login-chk-link:after { content: ''; display: block; clear: both; }
.login-chk-link .chk { float: left; }
.login-chk-link .chk > label { font-size: 11px; letter-spacing: -0.55px; cursor: pointer; color: #868686; }
.login-chk-link .chk input { margin: 0 4px 0 0; }
.login-chk-link .link { float: right; }
.login-chk-link .link a { font-size: 11px; color: #868686; text-decoration: underline; display: inline-block; margin-right: 8px; }
.login-area .login-join { text-align: center; margin: 40px 0 0; font-size: 12px; color: #868686; }
.login-area .login-join a { font-size: 12px; text-decoration: underline; display: inline-block; margin: 8px 0 0 12px; }

.login-area button[type="button"].sns { width: 100%; border-radius: 50vh; font-size: 14px; font-weight: 500; letter-spacing: -0.7px; text-align: center; color: #868686; margin: 8px 0 0; }
.login-area .kakaotalk:before { content: ''; display: inline-block; vertical-align: middle; margin: -2px 4px 0 0; width: 32px; height: 32px; background: url(../../images/mobile/icon_s_kakaotalk.png) center center no-repeat; background-size: contain; }
.login-area .naver:before { content: ''; display: inline-block; vertical-align: middle; margin: -2px 4px 0 0; width: 32px; height: 32px; background: url(../../images/mobile/icon_s_naver.png) center center no-repeat; background-size: contain; }
.login-area .facebook:before { content: ''; display: inline-block; vertical-align: middle; margin: -2px 4px 0 0; width: 32px; height: 32px; background: url(../../images/mobile/icon_s_facebook.png) center center no-repeat; background-size: contain; }
.login-area .google:before { content: ''; display: inline-block; vertical-align: middle; margin: -2px 4px 0 0; width: 32px; height: 32px; background: url(../../images/mobile/icon_s_google.png) center center no-repeat; background-size: contain; }
.login-area .apple:before { content: ''; display: inline-block; vertical-align: middle; margin: -2px 4px 0 0; width: 32px; height: 32px; background: url(../../images/mobile/icon_s_apple.png) center center no-repeat; background-size: contain; }


/*회원약관*/
.member-content { background: #fff; padding: 1px 16px 32px; }
.member-content .member-agree { margin: 24px 0 0; }
.member-content .member-agree h1 { font-size: 12px; }
.member-content .member-agree textarea.textarea-regular { height: 120px; border-radius: 8px; background-color: #f9f9f9; padding: 12px 16px; border: 0; font-size: 12px; color: #868686; margin: 8px 0 0; }
.member-content .member-agree label { display: block; margin: 8px 0 0; }
.member-content label span { font-size: 13px; color: #161616; }
.member-content label input { margin-top: 2px !important; }
.member-content .member-checked-all { margin: 24px 0 0; }
.member-content input[type="checkbox"] { margin-left: 0; }


/* 회원용 */
.member-write-area { background: #fff; overflow: hidden; width: 100%; padding: 24px 16px; }
.member-write-area > h1 { font-size: 18px; font-weight: 500; color: #161616; text-align: center; margin: 60px 0; }
.member-write-area label { display: block; font-size: 13px; color: #161616; margin: 24px 0 5px; }
.member-write-area label span { font-weight: bold; }
.member-write-area .btn-group-area { margin: 24px 0 0; text-align: center; }
.member-write-area .btn-group-area .btn-small { display: inline-block; width: calc((100% - 15px)/3); font-size: 13px; height: 36px; line-height: 34px; }
.member-write-area .btn-group-area .btn-small + .btn-small { margin-left: 4px; }
.member-write-area .member-guide-text { font-size: 15px; color: #161616; line-height: 1.8; margin: 48px 0; text-align: center; word-break: keep-all; }
.member-write-area .member-guide-text strong { font-weight: 900; }
.member-write-area .btn-regular { padding: 0; }

/*========== 컨텐츠 공용 끝 ==========*/


/*========== 컨텐츠 시작 ==========*/

.product-list { background: #fff; padding: 24px 16px 8px; margin: 8px 0 0; }
.product-list > ul { overflow: hidden; margin-top: -8px; }
.product-list > ul > li { float: left; width: calc((100% - 8px)/2); margin: 8px 8px 0 0; }
.product-list > ul > li:nth-child(2n) { margin-right: 0; }
.product-list > ul > li .pimg { position: relative; width: 100%; padding-bottom: 100%; height: 0; border-radius: 8px; overflow: hidden; }
.product-list > ul > li .pimg img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; z-index: 1; }

/*판매 완료*/
.product-list > ul > li .pimg .sale-completed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: 8px; background: rgba(0,0,0,0.5); z-index: 2; }
.product-list > ul > li .pimg .sale-completed p { font-size: 14px; font-weight: normal; line-height: 1.43; letter-spacing: -0.7px; text-align: center; color: #ffffff; position: absolute; top: 50%; left: 50%; display: block; width: 100%; transform: translate(-50%, -50%); }
.product-list > ul > li .info { padding: 16px 8px; }
.product-list > ul > li .info .title { height: 40px; font-size: 14px; font-weight: normal; line-height: 1.43; letter-spacing: -0.7px; text-align: left; color: #161616; }
.product-list > ul > li .info .price { margin: 8px 0 0; }
.product-list > ul > li .info .price strong { font-family: Lato; font-size: 16px; font-weight: 900; line-height: 1.19; letter-spacing: normal; text-align: left; }
.product-list > ul > li .info .price span { font-size: 12px; font-weight: bold; line-height: 1.5; letter-spacing: -0.6px; text-align: left; }
.product-list > ul > li .info .btn { margin: 8px 0 0; overflow: hidden; }
.product-list > ul > li .info .btn .btn-small { float: left; width: 60px; min-width: 60px; height: 23px; line-height: 21px; border-radius: 4px; font-size: 10px; padding: 0; font-weight: normal; }
.product-list > ul > li .info .btn > div { float: right; padding-bottom: 4px; line-height: 1.2; }
.product-list > ul > li .info .btn > div a { display: inline-block; font-size: 12px; font-weight: normal; letter-spacing: -0.6px; text-align: center; color: #767676; margin: 0 0 0 12px; }
.board-search { background: #fff; padding: 27px 16px; overflow: hidden; }
.search-medium > .btn-medium { width: 24px; height: 24px; margin-top: -10px; }

/* 16:9 비율맞춤*/
.slider .swiper-container.gallery-top{border:0px solid #000; padding-top: 56.25%; overflow:;}
.slider .swiper-container.gallery-top .swiper-wrapper{ position:absolute;top:0;left:0; }
/* 16:9 비율맞춤끝*/
.slider .swiper-container.gallery-top .swiper-slide { border-radius: 4px; overflow: hidden; }
.slider .swiper-container.gallery-thumb { width: 100%; height: 100%; margin-top: 8px; }
.slider .swiper-container.gallery-thumb .swiper-slide { width: 104px !important; height: 58px !important; border-radius: 4px; overflow: hidden; }
.slider .swiper-container.gallery-thumb .slider-btn-prev { width: 24px; height: 24px; margin-top: -12px; left: 0; }
.slider .swiper-container.gallery-thumb .slider-btn-next { width: 24px; height: 24px; margin-top: -12px; right: 0; }


.product-view { background: #fff; padding: 16px; }
.product-view .info { padding: 16px 0; overflow: hidden; }
.product-view .info > .id-tel { float: left; }
.product-view .info > .id-tel .id strong { display: inline-block; font-size: 14px; font-weight: 500; line-height: 1.43; letter-spacing: -0.7px; margin: 0 8px 0 0; }
.product-view .info > .id-tel .id span { display: inline-block; font-size: 12px; font-weight: normal; line-height: 1.5; letter-spacing: -0.6px; }
.product-view .info > .id-tel .tel span { display: inline-block; font-size: 11px; font-weight: 500; line-height: 1.55; letter-spacing: -0.55px; color: #868686; margin: 0 8px 0 0; }
.product-view .info > .btn { float: right; text-align: right; }
.product-view .info > .btn .btn-report { font-size: 11px; font-weight: 500; line-height: 1.55; letter-spacing: -0.55px; color: #868686; }
.product-view .info > .btn .btn-report:before { content: ''; display: inline-block; vertical-align: middle; margin: -4px 0 0; width: 24px; height: 24px; background: url(../../images/mobile/icon_report.png) center center no-repeat; background-size: contain; }
/*.product-view .info > .btn .btn-report.on:before { content: ''; display: inline-block; vertical-align: middle; margin: -4px 0 0; width: 24px; height: 24px; background: url(../../images/mobile/icon_report_on.png) center center no-repeat; background-size: contain; }*/
.product-view .minishop { text-align: center; padding: 32px 16px; border-bottom: 1px solid #e6e6e6; }
.product-view .minishop h1 { font-size: 18px; font-weight: 500; line-height: 1.5; letter-spacing: -0.9px; }
.product-view .minishop p { font-size: 13px; font-weight: normal; line-height: 1.46; letter-spacing: -0.65px; margin: 8px 0 0; }
.product-view .minishop .btn-minishop { display: inline-block; width: 63px; height: 28px; line-height: 26px; border: solid 1px #d6d6d6; background-color: #ffffff; border-radius: 4px; font-size: 10px; margin: 8px 0 0; }
.product-view .minishop .btn-minishop:before { content: ''; display: inline-block; vertical-align: middle; margin: -2px 0 0; width: 24px; height: 24px; background: url(../../images/mobile/icon_minishop.png) center center no-repeat; background-size: contain; }

.product-view .info > .btn .btn-small { float:left ; width: 60px; min-width: 60px; height: 23px; line-height: 21px; border-radius: 4px; font-size: 10px; padding: 0; font-weight: normal; }
.product-view .info > .btn > div { float:right ; padding-bottom: 4px; line-height: 1.2; }
.product-view .info > .btn > div a { display: inline-block; font-size: 12px; font-weight: normal; letter-spacing: -0.6px; text-align: center; color: #767676; margin: 0 0 0 12px; }




.map { position: relative; margin: 0 0 8px; }
.map .marker { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 1; }
.map .marker img { width: 19px; height: 27px; }


.fixed-bottom-btn { position: fixed; bottom: 0; left: 0; width: 100%; padding: 16px 24px; background: #f3f3f3; z-index: 100; }


/** 700px 폭제한 ************/
#header{ max-width:700px;margin:0 auto; left: 0;right: 0; }
#content{ max-width:700px;margin:0 auto; }
#footer{ max-width:700px;margin:0 auto; }
.main-visual{max-width:700px;}
.fixed-bottom-btn{max-width:700px;margin:0 auto;left: 0;right: 0;}
.popup{max-width:calc(700px - 32px); width: calc(100% - 32px); }
.index-popup {max-width:calc(700px - 48px);opacity:1; top:50px;}
.sub-title-area h1{max-width:calc(700px - 144px);border:0px solid #ccc;margin:0 auto; left: 0;right: 0;}
/** 700px 폭제한 End ************/