@charset "utf-8"; 

/*
 * --------------------------------------------------------------------------
 * descript : 게시판 테마
 * --------------------------------------------------------------------------
 * version	: 2.0.0
 * author	: Yoodaekyung
 * update	: 2018.08.17
 * email	: eorud0818@naver.com
 * --------------------------------------------------------------------------
 */

 
/* --------------------------------------------------------------------------
   검색
   -------------------------------------------------------------------------- */
.search-box{width:95%; height:35px; margin:0 auto;}
.search-box select, .search-box input, .search-box button{float:left; box-sizing:border-box; display:inline-block; height:45px; line-height:45px; font-size:16px;}
.search-box input[type="text"]{width:58%; margin:0 1%; border:1px solid #cfd1d4; text-align:left; padding:0 10px; background:url(/assets/img/board/search.png) no-repeat 98% center; background-size:20px;}
.search-box button{width:15%; background:#e86087; color:#fff; font-weight:700; cursor:pointer;}
.search-box select{width:25%; border:1px solid #cfd1d4; cursor:pointer; padding:0 10px; background-color:#fff;}

/* --------------------------------------------------------------------------
   공지사항
   -------------------------------------------------------------------------- */
#board{margin:0 0 5rem 0;}

/* 리스트 */
.board-notice-list{width:100%;}
.board-notice-list ul.full{border-top:2px solid #858585;}
.board-notice-list ul li{}
.board-notice-list ul li.no-data {padding:5rem 0; text-align:center; color:#666; border-bottom:1px solid #cfd1d4;}
.board-notice-list ul li a{display:block; padding:15px; border-bottom:1px solid #cfd1d4; color:#222; }
.board-notice-list ul li a:hover{text-decoration:none;}
.board-notice-list ul li a b{position:relative; display:block; font-size:1.1rem; padding:5px 0px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.board-notice-list ul li a b i.notice{left:0; top:0; display:inline-block; padding:5px 10px; background:#2ab3bc; color:#fff; font-size:11px; font-weight:700;}
.board-notice-list ul li a i.name{font-size:12px; color:#aaa;}
.board-notice-list ul li a i.date{font-size:12px; color:#aaa;}
.board-notice-list ul li a span.line{display:inline-block; font-size:11px; color:#ccc; padding:0 10px;}


/* 뷰 */
#board .board-notice-view{width:100%; }
#board .board-notice-view thead{background:#f8f8f8; border-top:2px solid #858585; border-bottom:1px solid #cfd1d4;}
#board .board-notice-view thead th{text-align:center; font-size:15px; font-weight:700; color:#222; padding:1rem 0;}

#board .board-notice-view tbody td{background:#fff; border-bottom:1px solid #cfd1d4; text-align:center; padding:1rem 0; font-size:14px; font-weight:300;}
#board .board-notice-view tbody td i.notice{display:inline-block; padding:5px; background:#172b4d; color:#fff; border-radius:2px; font-size:11px; font-weight:700;}
#board .board-notice-view tbody td.subject{padding-left:1rem; text-align:left; line-height:24px; font-weight:700;}
#board .board-notice-view tbody td.con{padding:1rem 1rem; line-height:1.8em; text-align:left;}
#board .board-notice-view tbody td.con img{max-width:100%;}
#board .board-notice-view tbody td a{color:#999;}
#board .board-notice-view .con img {width:auto !important; height:auto !important;}

/* 뷰 */
.board-notice-view{width:100%; }
.board-notice-view ul.full{border-top:2px solid #858585;}
.board-notice-view ul li{}
.board-notice-view ul li div.title{padding:15px; border-bottom:1px solid #cfd1d4; color:#222; background:#eee; font-size:1.2rem; line-height:1.5em; font-weight:700;}
.board-notice-view ul li p.info{position:relative;  padding:15px; border-bottom:1px solid #cfd1d4;}
.board-notice-view ul li p.info i.notice{left:0; top:0; display:inline-block; padding:5px 10px; background:#2ab3bc; color:#fff; font-size:11px; font-weight:700;}
.board-notice-view ul li p.info i.name{font-size:12px; color:#777;}
.board-notice-view ul li p.info i.date{font-size:12px; color:#777;}
.board-notice-view ul li p.info i.hit{font-size:12px; color:#777;}
.board-notice-view ul li p.info span.line{display:inline-block; font-size:11px; color:#ccc; padding:0 10px;}
.board-notice-view ul li.con{padding:15px; border-bottom:1px solid #cfd1d4; font-size:1em; line-height:1.5em;}
.board-notice-view ul li iframe{width:100% !important;}


.prev-next-list{width:100%;}
.prev-next-list ul{}
.prev-next-list ul li{background:#fff;  border-bottom:1px solid #cfd1d4; text-align:left; padding:20px 0; font-size:13px; line-height:13px;}
.prev-next-list ul li span{display:inline-block; float:left; width:70px; font-weight:700; text-align:center;}
.prev-next-list ul li a{display:inline-block; width:calc(100% - 100px); box-sizing:border-box; color:#222; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
/* --------------------------------------------------------------------------
   온라인 상담
   -------------------------------------------------------------------------- */
.inquire{margin:50px 0 100px 0;}

/* 리스트 */
.board-counsel-list{width:100%; border-top:2px solid #858585;}
.board-counsel-list ul li{position:relative;}
.board-counsel-list ul li.empty{text-align:center; padding:50px 0;}
.board-counsel-list ul li a{display:block; padding:15px; border-bottom:1px solid #cfd1d4; color:#222; }
.board-counsel-list ul li a:hover{text-decoration:none;}
.board-counsel-list ul li a b{position:relative; display:block;  padding:5px 100px 5px 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.board-counsel-list ul li a b i.notice{left:0; top:0; display:inline-block; padding:5px 10px; background:#2ab3bc; color:#fff; font-size:11px; font-weight:700;}
.board-counsel-list ul li a i.name{font-size:12px; color:#aaa;}
.board-counsel-list ul li a i.date{font-size:12px; color:#aaa;}
.board-counsel-list ul li a span.line{display:inline-block; font-size:10px; color:#ccc; padding:0 10px; vertical-align:2px;}
.board-counsel-list ul li div.answer{ position:absolute; top:50%; right:10px; transform:translate(0, -50%);}
.board-counsel-list ul li div.answer i.state{display:inline-block; padding:10px 20px; color:#fff; border-radius:25px; font-size:13px; font-weight:400;}
.board-counsel-list ul li div.answer i.com{background:#e86087; }
.board-counsel-list ul li div.answer i.ready{background:#cbcbcb; }


/* 뷰 */
.board-counsel-view{width:100%; border-top:2px solid #858585;}
.board-counsel-view ul li{position:relative;}

.board-counsel-view ul li div.title{padding:15px; border-bottom:1px solid #cfd1d4; color:#222; background:#eee; font-size:1em; line-height:1.5em; font-weight:700;}
.board-counsel-view ul li p.info{position:relative;  padding:20px 15px; border-bottom:1px solid #cfd1d4;}

.board-counsel-view ul li p.info span.answer{position:absolute; display:inline-block; top:50%; right:10px; transform:translate(0, -50%);}
.board-counsel-view ul li p.info i.state{display:inline-block; padding:10px 20px; color:#fff; border-radius:25px; font-size:13px; font-weight:400;}
.board-counsel-view ul li p.info i.com{background:#e86087; }
.board-counsel-view ul li p.info i.ready{background:#cbcbcb; }

.board-counsel-view ul li p.info i.notice{left:0; top:0; display:inline-block; padding:5px 10px; background:#005d99; color:#fff; font-size:11px; font-weight:700;}
.board-counsel-view ul li p.info i.name{font-size:12px; color:#777;}
.board-counsel-view ul li p.info i.date{font-size:12px; color:#777;}
.board-counsel-view ul li p.info i.hit{font-size:12px; color:#777;}
.board-counsel-view ul li p.info span.line{display:inline-block; font-size:10px; color:#ccc; padding:0 10px; vertical-align:2px;}


.board-counsel-view ul li.con{padding:15px; border-bottom:1px solid #cfd1d4; font-size:1em; line-height:1.5em;}



.board-counsel-content{padding:15px; font-size:1em; line-height:1.5em; border-bottom:1px solid #eee;}

.board-counsel-reply{padding:25px; background:#f4f4f4; border-top:1px solid #cfd1d4; border-bottom:1px solid #cfd1d4;}
.board-counsel-reply .reply-title{position:relative; display:inline-block; width:100%; height:30px; line-height:30px;  padding-left:100px; box-sizing:border-box; font-weight:700; margin-bottom:25px;}
.board-counsel-reply .reply-title i{position:absolute; left:0; top:0; display:inline-block; width:80px; height:30px; line-height:30px; text-align:center; color:#fff; background:#005d99; font-size:13px;}
.board-counsel-reply .reply-txt{font-size:13px; line-height:20px;}

/* 글쓰기 */
.board-cousel-form{width:100%; border-top:2px solid #858585; border-collapse: separate;}
.board-cousel-form input[type="text"],
.board-cousel-form input[type="password"],
.board-cousel-form select{height:35px; line-height:35px; box-sizing:border-box; border:1px solid #cacaca; padding:0 5px;}
.board-cousel-form select{min-width:80px;background:url(/assets/img/common/theme/btn_down.png) no-repeat 90% center;}
.board-cousel-form textarea{width:100%; max-width:100%; min-width:100%; height:150px; bbox-sizing:border-box; padding:5px; border:1px solid #cacaca; color:#222; font-size:12px; line-height:20px;}
.board-cousel-form input[element-name="제목"]{width:100%;}
.board-cousel-form input[element-name="연락처"]{width:25%;}

.board-cousel-form tbody{}
.board-cousel-form tbody th{width:70px; padding:10px 20px; text-align:left; background:#f8f8f8; border-bottom:1px solid #cfd1d4; font-size:13px; font-weight:700;}
.board-cousel-form tbody td{padding:10px; text-align:left; border-bottom:1px solid #cfd1d4;}
.board-cousel-form tbody td .addFile > label,
.board-cousel-form tbody td .addFile > input{display:none;}

.private-agree textarea{width:100%; max-width:100%; min-width:100%; height:150px; background:#f4f4f4; box-sizing:border-box; padding:25px; color:#222; font-size:12px; line-height:20px; margin:15px 0;}

#inquire .private-agree{}
#inquire .private-agree textarea{width:100%; max-width:100%; min-width:100%; height:200px; background:#fafafa; box-sizing:border-box; padding:25px; color:#222; font-size:13px; line-height:23px; margin:15px 0;}

/* 체크박스 및 라디오버튼 */
#inquire .private-agree{text-align:right;}
#inquire .private-agree input[type="checkbox"]{display:none;}
#inquire .private-agree input[type="checkbox"] + label{font-size:14px; position:relative; padding-left:30px; cursor:pointer; height:23px; line-height:23px;}
#inquire .private-agree input[type="checkbox"] + label::before{content:""; display:inline-block; left:0; top:0; border:1px solid #ddd; width:23px; height:23px; box-sizing: border-box;}
#inquire .private-agree input[type="checkbox"]:checked + label::after{content:""; display:inline-block; width:15px; height:15px; left:4px; top:4px; background:#e86087}

#inquire .private-agree input[type="radio"]{display:none;}
#inquire .private-agree input[type="radio"] + label{font-size:14px; position:relative; padding-left:30px; cursor:pointer; height:23px; line-height:23px;}
#inquire .private-agree input[type="radio"] + label::before{content:""; display:inline-block; left:0; top:0; border:1px solid #ddd; width:23px; height:23px; border-radius:23px; box-sizing: border-box;}
#inquire .private-agree input[type="radio"]:checked + label::after{content:""; display:inline-block; width:15px; height:15px; border-radius:15px; left:4px; top:4px; background:#e86087}

/* 비밀번호 */
#inquire .check-password{width:90%; max-width:640px; background:#eee; margin:50px auto; border:1px solid #333; text-align:center;}
#inquire .check-password h3{background:#333; color:#fff; padding:20px; font-size:15px; font-weight:700;}
#inquire .check-password p{font-size:13px; color:#777; padding:25px 0 10px 0; line-height:20px;}
#inquire .check-password input[type="password"]{width:50%; border:1px solid #ccc; box-size:border-box; padding:7px; background:#fff;}



/* --------------------------------------------------------------------------
   갤러리 (고객후기)
   -------------------------------------------------------------------------- */
#gallery{margin:50px 0 100px 0;}

/* 리스트 */
#gallery ul{display:inline-block; width:100%;}
#gallery li.item{position:relative; float:left; width:calc(50% - 10px); margin-bottom:20px; cursor:pointer; margin-right:20px;}
#gallery li.item:nth-child(2n + 2){margin-right:0;}
#gallery li.item{}
#gallery li.item a{position:relative; display:inline-block; width:100%; height:100%; background-size:cover; background-repeat:no-repeat; background-position:center center;}
#gallery li.item .thumbnail{height:250px; background:#f3f3f3 url(/assets/img/common/theme/logo.png) no-repeat center center;}
#gallery li.item .info{position:relative; box-sizing:border-box; height:160px; padding:30px 15px;  background:#fff; border-bottom:1px solid #ddd; border-left:1px solid #ddd; border-right:1px solid #ddd; box-sizing:border-box;}
#gallery li.item .info::before{position:absolute; display:inline-block; content:''; width:28px; height:4px; background:#e86087; left:-1px; top:-2px;}
#gallery li.item .info em{display:block; font-size:1.4em; font-weight:700; color:#222; line-height:1.4em; font-family:'NanumSquare', sans-serif; margin-bottom:10px; white-space: nowrap; overflow:hidden; text-overflow: ellipsis;}
#gallery li.item .info span.date{display:block; font-size:0.85em; color:#8c8c8a;}
#gallery li.item .info span.con{display:block; margin:15px 0; font-size:1em; line-height:1.5em; color:#222; height:3em; max-height:3em; overflow:hidden; text-overflow: ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; word-wrap:break-word;}

@media(max-width:640px){
	#gallery li.item{float:none; width:100%; margin-right:0;}
}


/* 글쓰기 */
#gallery .board-gallery-form{width:100%;}
#gallery .board-gallery-form input[type="text"],
#gallery .board-gallery-form input[type="password"],
#gallery .board-gallery-form select{min-width:100px; height:35px; line-height:35px; box-sizing:border-box; border:1px solid #cacaca; padding:0 5px;}
#gallery .board-gallery-form select{background:url(/assets/img/common/theme/btn_down.png) no-repeat 90% center;}
#gallery .board-gallery-form textarea{width:100%; max-width:100%; min-width:100%; height:150px; bbox-sizing:border-box; padding:5px; border:1px solid #cacaca; color:#222; font-size:12px; line-height:20px;}
#gallery .board-gallery-form input[data-name="제목"]{width:100%;}
#gallery .board-gallery-form input[data-name="연락처"]{width:100px;}

#gallery .board-gallery-form tbody{border-top:2px solid #858585;}
#gallery .board-gallery-form tbody th{text-align:center; font-size:15px; font-weight:700; color:#222; padding:20px 0; background:#f3f3f3; border-bottom:1px solid #cfd1d4;}
#gallery .board-gallery-form tbody td{padding:10px 20px; text-align:left; border-bottom:1px solid #cfd1d4;}
#gallery .board-gallery-form tbody td .addFile > input,
#gallery .board-gallery-form tbody td .addFile > label{display:none;}

/* --------------------------------------------------------------------------
   FAQ - 자주하는질문 (리스트)
   -------------------------------------------------------------------------- */
#board .board-faq-list{width:100%; border-top:2px solid #858585; }

#board .board-faq-list tbody th{position:relative; text-align:left; font-size:15px; line-height:20px; font-weight:700; color:#222; padding:20px 50px 20px 60px; border-bottom:1px solid #eee; cursor:pointer; background:url(/assets/img/common/theme/breadcrumb_down.png) no-repeat 97% 27px; background-size:15px;}
#board .board-faq-list tbody th.active{background:url(/assets/img/common/theme/breadcrumb_up.png) no-repeat 97% 27px; background-size:15px;}

#board .board-faq-list tbody td{position:relative; font-size:14px; line-height:20px; border-bottom:1px dashed #ccc; background:#fafafa; display:none;}
#board .board-faq-list tbody td{text-align:left; padding:15px 30px 15px 60px;}
#board .board-faq-list tbody td.no-data{color:#aaa; vertical-align:middle; padding:30px 0;}

#board .board-faq-list tbody th span.question{position:absolute; width:30px; line-height:30px; width:30px; border-radius:30px; text-align:center; font-size:20px; color:#fff; background:#132b88; left:20px; top:50%; transform:translate(0, -50%); font-weight:700;}
#board .board-faq-list tbody td span.answer{position:absolute; width:30px; line-height:30px; width:30px; border-radius:30px; text-align:center; font-size:20px; color:#fff; background:#0ba29a; left:20px; top:10px; font-weight:700;}

/* --------------------------------------------------------------------------
   공통
   -------------------------------------------------------------------------- */
select{background-image:url(/assets/img/common/theme/select_arrow.png) !important; background-repeat:no-repeat; background-position:90% center; background-size:15px !important; cursor:pointer;}
















.event-list{width:100%; display:inline-block; text-align:center; margin:50px 0 25px 0;}
.event-list ul{}
.event-list ul li.item{margin-bottom:25px;}
.event-list ul li.item img{width:100%;}
.event-list ul li.item div.event-list-info{position:relative; padding:50px 0 20px 0; background:#fff; border:1px solid #eee; border-top:0;}
.event-list ul li.item div.event-list-info i[data-sec="진행중"]{position:absolute; font-size:15px; font-weight:700; color:#fff; left:-1px; top:0; background:#111; padding:10px;}
.event-list ul li.item div.event-list-info i[data-sec="종료"]{position:absolute; font-size:15px; font-weight:700; color:#fff; left:-1px; top:0; background:#ddd; padding:10px;}
.event-list ul li.item div.event-list-info p.cap{font-size:15px; line-height:25px; color:#222; margin:5px 0;}
.event-list ul li.item div.event-list-info p.cap img{margin-right:5px;}
.event-list ul li.item div.event-list-info h6.tit{font-size:20px; line-height:25px; color:#222; font-weight:700;}
.event-list ul li.item div.event-list-info a.more{display:inline-block; width:110px; height:37px; line-height:37px; border-radius:37px; background:#e86087; color:#fff; font-weigth:700;}
/**********************************************************************/

.event-list-view{margin:50px 0;}
.event-list-view table{width:100%;}
.event-list-view th{padding:25px 0; text-align:center; background:#fafafa; border-top:2px solid #222; border-bottom:1px solid #ccc; font-weight:700; font-size:1.6em;}
.event-list-view td{padding:15px; border-bottom:1px solid #ddd;}
.event-list-view td.con{padding:35px 0; font-size:1em; line-height:1.6em; color:#222;}
.event-list-view td.con img{max-width:100%;}
.event-list-view td h6.tit{font-size:20px; line-height:30px; color:#222; font-weight:700;}
.event-list-view td p.cap{font-size:15px; line-height:25px; color:#222; margin:5px 0;}
.event-list-view td p.cap img{margin-right:5px;}
.event-list-view td i[data-sec="진행중"]{display:inline-block; width:100px; font-size:15px; font-weight:700; color:#fff; left:0; top:0; background:#e86087; padding:10px; text-align:center;}
.event-list-view td i[data-sec="종료"]{display:inline-block; width:100px; font-size:15px; font-weight:700; color:#fff; left:0; top:0; background:#ddd; padding:10px; text-align:center;}


#preview{margin:0 1rem 4.5rem; border-top:.2rem solid #be9e76;}
#preview .gallery-thumbs {margin-top:1rem; padding-top:1rem; border-top:1px dashed #dadada;}
#preview .gallery-thumbs img {display:block; position:relative; width:100%; z-index:0;}
#preview .gallery-thumbs .swiper-slide:before {content:""; display:block; position:absolute; top:0; left:0; right:0; bottom:0; border:0 solid #be9e76; transition:.3s all; -webkit-transition:.3s all; z-index:2;}
#preview .gallery-thumbs .swiper-slide-thumb-active:before {border-width:.4rem;}

.page-category {position:relative; margin:0 1rem 2rem; clear:both; }
.page-category button {display:block; width:100%; font-size:1.1rem; height:3.5rem; text-align:center; background: #a47649; color:#fff; font-weight:600;}
.page-category dd {display:none;}
.page-category dd a {display:block; font-size:1.1rem; padding:0 1rem; line-height:3.5rem; height:3.5rem; border:1px solid #dddddd; color:#333; font-size:1rem;}
.page-category dd li.on a {background:#cca682; border-color:#cca682; color:#fff;}
.page-category dd li + li a {border-top-width:0;}


/**********************************************************************
* Descript : 비포 엔 에프터 게시판 스타일
***********************************************************************/
.before-after{margin:1rem;}
.before-after li.item{position:relative; overflow:hidden; border:1px solid #dddddd;}
.before-after li.item span{position:relative; display:inline-block; float:left; width:50%; background-position:center center; background-repeat:no-repeat; background-color:#fafafa; background-size:cover;}
.before-after li.item span:before {content:""; display:block; position:relative; padding-top:66.66%;}
.before-after li.item span.full{width:100% !important;}
.before-after li.item span i{position:absolute; display:inline-block; width:6rem; height:2rem; line-height:2rem; text-align:center; color:#fff; font-weight:700; font-size:1rem;}
.before-after li.item span.before{}
.before-after li.item span.before i{right:0; bottom:0; background:#777777;}
.before-after li.item span.after{}
.before-after li.item span.after i{left:0; bottom:0; background:#a47649;}
.before-after li.item p{clear:both; padding:1rem; background:#ddd; font-size:1.2rem; color:#262626; text-align:center; font-weight:700; z-index:1;}


.before-after-thumb{display:block; overflow:hidden; margin:0 1rem;}
.before-after-thumb li.item{position:relative; float:left; width:49%; margin-bottom:1rem; border:1px solid #dddddd; box-sizing:border-box; cursor:pointer; background-size:cover;}
.before-after-thumb li.item::before{opacity:0; position:absolute; display:inline-block; content:''; width:100%; height:100%; left:0; top:0; background:rgba(0,0,0,0.7); z-index:2; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;}
.before-after-thumb li.item::after{opacity:0; position:absolute; display:inline-block; content:'자세히 보기'; padding:.5rem 1rem; top:50%; left:50%; transform: translate(-50%, -50%); text-align:center; background:#b9975e; color:#fff; font-weight:700; font-size:.95rem; z-index:3; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;}
.before-after-thumb li.item:nth-child(2n+2){margin-left:2%;}
.before-after-thumb li.item:hover::before,
.before-after-thumb li.item:hover::after{opacity:1;}
.before-after-thumb li.item span{position:relative; display:inline-block; float:left; width:50%;  height:5rem; background-size:cover; background-repeat:no-repeat; background-position:center center;}
.before-after-thumb li.item span.full{width:100% !important;}
.before-after-thumb li.item span i{position:absolute; display:inline-block; width:4rem; height:1.5rem; line-height:1.5rem; text-align:center; color:#fff; font-weight:700; font-size:.95rem;}
.before-after-thumb li.item span.before{}
.before-after-thumb li.item span.before i{right:0; bottom:0; background:#777777;}
.before-after-thumb li.item span.after{}
.before-after-thumb li.item span.after i{left:0; bottom:0; background:#a47649;}
.before-after-thumb li.item p{clear:both; padding:.5rem; background:#ddd; font-size:1rem; color:#262626; text-align:center; font-weight:700; z-index:1;}

/**********************************************************************/