@charset "utf-8";
/* CSS Document */

/* 헤더 */
header { background-color: rgba(255,255,255,1); position: fixed; width: 100%; top: 0; left: 0; z-index: 555;}
header .wrap { height: 90px; }

/* 헤더 - 탑 서브 메뉴 */
#top_sub_menu a { position: relative; z-index: 2; }
#top_sub_menu a { color: #fff; text-align: center; font-size: 18px; font-weight: 600; flex: 3; height: 60px; line-height: 60px; }
	#top_sub_menu a:nth-of-type(1) { background-color: #243436; }
	#top_sub_menu a:nth-of-type(2) { background-color: #285C57; color: #FFF8BA;}
	#top_sub_menu a:nth-of-type(2) span { display: block; animation:pulse 3s infinite ease-in-out alternate; }
	#top_sub_menu a:nth-of-type(3) { background-color: #3A856C; }	
	#top_sub_menu a:nth-of-type(4) { background-color: #589480; }
@keyframes pulse {
  0%,30% { transform: scale(1); }
  10% { transform: scale(1.2);  }  
}

/* 헤더 로고 */
header .logo { display: inline-flex; position: relative; z-index: 1000; width: 24%; min-width: 100px; max-width: 120px; }
header .logo svg { width: 100%; }
header .logo svg * { fill: #a78e68; transition: opacity 0.1s ease-out; }
header.active .logo svg * { fill: #a78e68; }

/* 헤더 메뉴 */
#menu_container .menu_list { display: flex; }
	#menu_container .menu_list::before { content: ''; opacity: 0; position: absolute; width: 100%; height: 0; }
#menu_container .menu_list .menu_submenu { display: none; }
#menu_container .menu_list li.accordion_toggle { z-index: 3; }
#menu_container .menu_list li.accordion_toggle .menu_link { margin-right: 80px; font-size: 18px; font-weight: 600; color: #181818; text-shadow: -1px 0px #fff, 0px 1px #fff, 1px 0px #fff, 0px -1px #fff; }
	#menu_container .menu_list li.accordion_toggle .menu_link:hover { color: #285C57; }
	#menu_container .menu_list li.accordion_toggle:last-of-type .menu_link { margin-right: 0; }

/* 헤더 - 스크롤 내렸을때 */
header.active { background-color: #ffffff; position: fixed; width: 100%; top: 0; left: 0; z-index: 555; border:none; border-bottom: solid 1px #e6e6e6; }

/* 헤더 메뉴 - 오버 */
@media only screen and ( min-width: 900px ) and ( hover: hover ) {
	header:hover #menu_container .menu_list li.accordion_toggle .menu_link { color: #181818; }
	header:hover #menu_container .menu_list .menu_submenu { display: inline-block; border-left: solid 1px #e6e6e6; height: 370px; position: absolute; top: 150px; z-index: 2; width: 20%; text-align: center; padding-top: 70px; border-bottom: solid 1px #e6e6e6; }
		header:hover #menu_container .menu_list .menu_submenu::before { text-align: center; position: absolute; left: 0; font-size: 20px; width: 100%; top: 40px; opacity: 0.25 }
		header:hover #menu_container .menu_list .menu_submenu:nth-of-type(1) { left: 0%; }
			header:hover #menu_container .menu_list .menu_submenu:nth-of-type(1)::before { content: '렉시퀸'; }
		header:hover #menu_container .menu_list .menu_submenu:nth-of-type(2) { left: 20%; }
			header:hover #menu_container .menu_list .menu_submenu:nth-of-type(2)::before { content: '무료체험 안내'; }
		header:hover #menu_container .menu_list .menu_submenu:nth-of-type(3) { left: 40%; }
			header:hover #menu_container .menu_list .menu_submenu:nth-of-type(3)::before { content: 'Real 체험후기'; }
		header:hover #menu_container .menu_list .menu_submenu:nth-of-type(4) { left: 60%; }
			header:hover #menu_container .menu_list .menu_submenu:nth-of-type(4)::before { content: '고객센터'; }
		header:hover #menu_container .menu_list .menu_submenu:nth-of-type(5) { left: 80%; }
			header:hover #menu_container .menu_list .menu_submenu:nth-of-type(5)::before { content: '사은품 신청'; }
		header:hover #menu_container .menu_list .menu_submenu:last-of-type { border-right: none; }
	header:hover #menu_container .menu_list::before { content: ''; height: 520px; background-color: #fff; left: 0; top: 0; z-index: 1; transition: opacity 0.1s ease-out; opacity: 1; }
	header:hover #menu_container .menu_list::after{ content: ''; position: absolute; width: 100%; height: 1px; background-color: #e6e6e6; top: 150px; left: 0; z-index: 2; }
	header:hover #menu_container .menu_list .menu_submenu li a { display: inline-block; color: #181818; padding-top: 20px; font-weight: 600; }
		header:hover #menu_container .menu_list .menu_submenu li a:hover {color: #285C57; }
}

/* 퀵 메뉴 */
#quick_menu { position: fixed; right: 20px; top: 52%; transform: translateY(-50%); width: 150px; z-index: 444; }
	#quick_menu a { color: #285C57; border: solid 1px #285C57; background-color: #fff; line-height: 52px; width: 100%; display: flex; justify-content: center; border-radius: 500px; margin-bottom: 10px; font-size: 16px; font-weight: 700; box-shadow: 5px 5px 12px 0 rgb(0 0 0 / 20%); }
		#quick_menu a:hover { background-color: #285C57; color: #fff; }
	#quick_menu a.quick_point{ background-color: #2D86FF; border: 1px solid #00000033; color: #fff; animation:btn_bounce 1500ms infinite ease-in-out alternate;}
	#quick_menu a.quick_point:hover{ background-color: #1269DF; }
	#quick_menu a.top { background-color: #243436; border: none; color: #fff; width: 44px; height: 44px; line-height: 44px; display: flex; align-items: center; justify-content: center; margin: 20px auto 0; }
	#quick_menu a:nth-of-type(2) { background-color: #FF5D85; color: #fff; border: solid 1px rgba(255,255,255,0); }
	#quick_menu a:nth-of-type(2):hover { background-color: #de4369; }
@keyframes btn_bounce {
  0%,30% { transform: scale(1); }
  10% { transform: scale(1.1);  }   
}

#quick_today{  width: 100%; margin: 0 auto 10px ; padding:0; background-image: linear-gradient(90deg #ffffff 0%, #efefef 100%); border-radius: 0.5rem; overflow: hidden; box-shadow: 5px 5px 12px 0 rgb(0 0 0 / 20%);}
#quick_today .tit{font-size: 15px; background-color:#2D86FF; padding: 8px 0 5px; color: #ffffff; border-radius: 0.5rem 0.5rem 0 0;  }
#quick_today .cont{font-size: 13px; background-color: #fff; padding: 8px 0px; flex-wrap: wrap;}
#quick_today .cont > span {padding: 0 5px}
#quick_today .cont > span span {font-size: 17px; font-weight: bold; color:#2D86FF; }



/* 푸터 */
footer { border-top: solid 1px #e6e6e6; }
footer .wrap { display: flex; justify-content: space-between; padding: 5rem 0; }
footer #footer_info { width: 80%; }
footer #footer_info #footer_nav a { color: #181818; font-weight: 600; font-size: 17px; border-right: solid 1px rgba(24,24,24,0.3); margin-right: 14px; padding-right: 16px; }
	footer #footer_info #footer_nav a:last-of-type { border-right: none; margin-right: 0; padding-right: 0; }
footer #footer_info p { font-size: 16px; }
footer #footer_info .txt_01 { margin: 20px 0 20px; }
footer #footer_customer { width: 20%; }
footer #footer_customer .txt_01 { font-weight: 600; }
footer #footer_customer .txt_02 { margin-top: 10px; font-size: 16px; }
footer #footer_customer .tel { font-size: 26px; font-weight: bold; color: #285C57; display: inline-flex; align-items: center; }
	footer #footer_customer .tel i { font-size: 20px; margin-right: 8px; }

/* 인풋 */
input, textarea, select { width: 100%; border: solid 1px #e6e6e6; padding: 0.85rem; border-radius: 0.3rem!important; font-size: 18px; height: auto!important; }
input[type="checkbox"] { -webkit-appearance: button!important; width: 17px; height: 17px; margin: 0; }
textarea { min-height: 200px; }
select { background-color: #fff; color: inherit; }

/* 인풋 - 포커스 */
form fieldset:focus-within input, form fieldset:focus-within textarea, form fieldset:focus-within select { border: solid 1px #285C57!important; /* box-shadow: 0 0 12px 0 rgba(40,92,87,0.25); */ transition: all 0.3s ease-out!important; outline: none; }
form fieldset:focus-within label { color: #285C57!important; transition: all 0.3s ease-out; }

/* 폼 */
form fieldset, form #announcement { margin-bottom: 30px; }
form fieldset { display: inline-block!important; width: 100%; }
form fieldset label { display: inline-block ; color: #888; margin-bottom: 10px; width: 100%; line-height: 1; font-weight: 600; text-align: left; }
form .fieldset_wrap { display: flex; justify-content: space-between; }
	form .fieldset_wrap fieldset:nth-of-type(2) { margin-left: 20px; }

/* 폼 - 연락처 */
form #tel_fieldset select, form #tel_fieldset input { width: 30%!important; }
form #tel_fieldset span { display: flex; align-items: center; }

/* 폼 - 주소 */
#address_fieldset .flexwrap { width: 49%!important; float: left; }
#address_fieldset .flexwrap input { width: 80%; }
#address_fieldset .flexwrap button { width: 18%; height: auto; font-weight: normal; font-size: 0.9em; line-height: inherit; }
#address_fieldset #u_add_02 { width: 49%; float: right; }
#address_fieldset #u_add_03 { margin-top: 10px; }

/* 폼 - 통화희망시간*/
#time_fieldset .flexwrap select{ width: 47.5%; color: #747474; }
#time_fieldset .flexwrap span { width: 5%; }

/* 폼 - 약관 텍스트 박스 */
form #terms_fieldset textarea { background-color: #f7f7f7; border: none; padding: 1.5rem; font-size: 0.9em; margin: 5px 0 15px; }
	form #terms_fieldset:focus-within textarea { border: none!important; }
form #terms_fieldset label p { margin: 0 0 0 10px; font-weight: normal; color: #285C57; }

/* 폼 - 개인정보취급방침 동의 */
#agree_area { margin-top: 30px; }
#agree_area label p { line-height: 1; margin: 0 10px; }
#agree_area a { color: inherit; font-weight: 700; }

/* 폼 - 버튼 */
.btn_wrap  {margin-top: 60px;}
.btn_wrap > button + button, .btn_wrap > button + form{margin-left: 2%}
.form_btn {/* width: 30%;*/ /*margin: 60px 2% 30px 0!important;*/ display: flex; align-items: center; justify-content: center; }
	.form_btn:last-child{ /*margin: 60px 0 30px 0!important;*/ }
.form_btn + .form_btn {margin-left: 2%}
/* 폼 - 자동등록방지 */
#captcha {margin-top: 45px; background-color: transparent; width: 100%;  text-align: center;}
.g-recaptcha{margin: 0 auto; max-width: 300px; height: 74px;}

/* 섹션 - 패딩 */
section[id*="_sec"] { padding: 120px 0; }

/* 비주얼 */
#sub_visual { height: 460px; background-color: #555; color: #fff; display: flex; align-items: center; margin-top: 150px; background-image: url(../images/visual_bg.jpg); background-position: center; background-size: cover; background-repeat: no-repeat; }
#sub_visual .wrap { text-align: center; }
#sub_visual .txt_01 { font-weight: 700; font-size: 56px; margin: 0 0 30px; line-height: 1; }

/* 보드 검색창 */
.search_box { background-color: rgb(247, 247, 247); width: 340px; padding: 0 25px; margin-bottom: 60px; border-radius: 500px; float: right; display: flex; align-items: center; justify-content: space-between; position: relative; clear: both; }
.search_box input { outline: none; border: none; background-color: rgba(255,255,255,0); height: 60px; }
.search_box button { display: flex; align-items: center; justify-content: center; width: 24px; height: 24px; }
.search_box button span { color: #181818; }

/* 카테고리 탭 */
.category_tab { display: flex; align-items: center; justify-content: center; margin-bottom: 60px; color: #181818; }
.category_tab .tablinks { font-weight: 600; margin-right: 20px; border: solid 1px #181818; border-radius: 500px; padding: 14px 36px; transition: 0.2s ease-in-out; color: #181818; }
	.category_tab .tablinks:last-of-type { margin-right: 0px; }
.category_tab .tablinks:hover, .category_tab .tablinks.on { background-color: #333; color: #fff; }

/* 페이지 네이션 */
.pagination { margin-top: 80px; }
.pagination * { color: #181818; }
.pagination, .pagination .num_list, .pagination a, .pagination a span { display: flex; align-items: center; justify-content: center; }
.pagination .num_list { margin: 0 20px; }
.pagination .num_list a { width: 40px; height: 40px; line-height: 40px; font-weight: 600; }
.pagination .num_list a.on { background-color: #333; color: #fff; border-radius: 500px;}

/* 리스트형 게시판 */
.list_board_table { width: 100%; }
.list_board_table * { text-align: center; }
.list_board_table tr { height: 86px; border-bottom: solid 1px #e5e5e5; transition: 0.3s ease-in-out; }
	.list_board_table tr:hover:not(.list_board_table tr:first-of-type) { background-color: rgba(247, 247, 247, 0.5); cursor: pointer; }
	.list_board_table tr:first-of-type { border-top: solid 1px #181818; }
.list_board_table tr th { text-align: center!important; font-weight: 700; }

.list_board_table tr .number, .list_board_table tr .status { width: 12%; }
.list_board_table tr .number .notice_icon {margin-top: 8px; transform-origin: top center; animation: swing 2s ease infinite;}

@keyframes swing {
	20% { transform: rotate(15deg); }	
	40% { transform: rotate(-10deg); }
	60% { transform: rotate(5deg); }	
	80% { transform: rotate(-5deg); }	
	100% { transform: rotate(0deg); }
}

.list_board_table tr .title { width: 59%; padding: 0 60px; text-align: left; }
	.list_board_table tr span.material-symbols-outlined { font-size: 18px; position: relative; top: 3px; margin-left: 5%; }
.list_board_table tr .writer { width: 12%; }
.list_board_table tr .data { width: 12%; }

/* 리스트형 게시판 - 공지사항 */
.list_board_table tr.notice * { font-weight: 600; }
.list_board_table tr.notice td.number .material-symbols-outlined { font-variation-settings: 'FILL' 1;}

/* 뱃지 */
.badge, span[class*="status_badge_"] { display: inline-block; color: #fff; border-radius: 500px; padding: 4px 14px; font-size: 15px; font-weight: normal!important;}
.badge { background-color: #3A856C;  }
td.title > span[class*="status_badge_"] { /*width: 76px;*/ margin-left: 5px; }
	.status_badge_01 { background-color: #285C57; }
	.status_badge_02 { background-color: #3A856C; }
	.status_badge_03 { background-color: #66AE74; }
	.status_badge_04 { background-color: #fff; color: #3A856C!important; padding: 0!important; margin-left: 0px; }
	.status_badge_04 .material-symbols-outlined { font-size: 18px; }

.status_badge_ready{background-color: #285C57;}
.status_badge_talk{background-color: #66AE74;}
.status_badge_use{background-color: #FF5D85;}
.status_badge_buy{background-color: #1973E8;}



/*별점*/
.star_rate {display: inline-flex; color: #EDC000; margin-top: 10px; margin-bottom:3px}
.star_rate > i {font-size: 0.85em; display: inline-block; margin-right: 2px; color: #FFBE00;}

/* 게시판 공통 */
table { overflow-x: hidden; }
table tr td {  white-space:nowrap; word-wrap: break-word; text-overflow:ellipsis; -o-text-overflow:ellipsis; overflow:hidden; }

/* 갤러리형 게시판 */
.gallery_board_table { width: 100%; }
.gallery_board_table tbody {display: flex; flex-wrap: wrap;}
.gallery_board_table tr { display: inline-block; transition: 0.1s ease-in-out; width: 22.75%; float: left; margin-right: 3%; cursor: pointer; }
	.gallery_board_table tr:nth-of-type(4n+0) { margin-right: 0; }
	.gallery_board_table tr:nth-of-type(n+5) { margin-top: 45px; }
.gallery_board_table tr td { display: block; width: 100%; white-space: normal;  }
.gallery_board_table tr .title { display: flex; align-items: center; font-weight: 700; font-size: 18px; margin: 0px 0 5px; }
.gallery_board_table tr .title .badge { margin-right: 10px; }
.gallery_board_table tr .title .real_title { max-width: 70%; display: inline-block; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }
.gallery_board_table tr .thumbnail { overflow: hidden; width: 318px; height: 318px; position: relative; /*border: 1px solid #0000001a;*/}
.gallery_board_table tr .thumbnail .thumbnail_icon { position: absolute; top:5px; left: 5px; color: #fff; font-size: 18px; z-index: 100 }
.gallery_board_table tr .thumbnail img { display: block; width: 100%; height: 100%; object-fit: cover; transition: 0.3s ease-in-out; }
	.gallery_board_table tr:hover .thumbnail img { transform: scale(1.2); }
.gallery_board_table tr .info { font-size: 16px; color: #777; margin: 5px 0 8px; }
.gallery_board_table tr .info .writer { margin-right: 15px; }
.gallery_board_table tr .cont_article { margin-top: 5px; line-height: 1.2; font-size: 0.8em; text-overflow: ellipsis; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3;} 

/*갤러리형 게시판 동영상+베스트 섹션*/
.gallery_board_table_video,.gallery_board_table_best{margin-bottom: 50px; border-bottom: 1px solid #dddddd;}
.gallery_board_table_video tbody,.gallery_board_table_best tbody{margin-bottom: 50px; display: flex; justify-content: space-between;}
.gallery_board_table_video tr, 
.gallery_board_table_best tr { width: 19.5%; margin: 0!important; }

/* 슬라이드 */
.owl-carousel { display: none; width: 100%; -webkit-tap-highlight-color: transparent; position: relative; z-index: 1; }
.owl-carousel .owl-stage { position: relative; -ms-touch-action: pan-Y; touch-action: manipulation; -moz-backface-visibility: hidden; /* fix firefox animation glitch */ }
	.owl-carousel .owl-stage:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
.owl-carousel .owl-stage-outer { position: relative; overflow: hidden; /* fix for flashing background */ -webkit-transform: translate3d(0px, 0px, 0px); }
.owl-carousel .owl-wrapper, .owl-carousel .owl-item { -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); }
.owl-carousel .owl-item { position: relative;/* min-height: 1px;*/ float: left; -webkit-backface-visibility: hidden; -webkit-tap-highlight-color: transparent; -webkit-touch-callout: none; }
.owl-carousel .owl-item img { display: block; width: 100%; }
.owl-carousel .owl-nav.disabled, .owl-carousel .owl-dots.disabled { display: none; }
.owl-carousel .owl-nav .owl-prev, .owl-carousel .owl-nav .owl-next, .owl-carousel .owl-dot { cursor: pointer; cursor: hand; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
.owl-carousel .owl-nav button.owl-prev, .owl-carousel .owl-nav button.owl-next, .owl-carousel button.owl-dot { background: none; color: inherit; border: none; padding: 0 !important; font: inherit; }
.owl-carousel.owl-loaded { display: block; }
.owl-carousel.owl-loading { opacity: 0;  display: block; }
.owl-carousel.owl-hidden { opacity: 0; }
.owl-carousel.owl-refresh .owl-item { visibility: hidden; }
.owl-carousel.owl-drag .owl-item { -ms-touch-action: none; touch-action: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
.owl-carousel.owl-grab { cursor: move; cursor: grab; }
.owl-carousel.owl-rtl { direction: rtl; }
.owl-carousel.owl-rtl .owl-item { float: right; }

/* No Js */
.no-js .owl-carousel { display: block; }

/* Owl Carousel - Animate Plugin */
.owl-carousel .animated { animation-duration: 1000ms; animation-fill-mode: both; } 
.owl-carousel .owl-animated-in { z-index: 0; } 
.owl-carousel .owl-animated-out { z-index: 1; } 
.owl-carousel .fadeOut { animation-name: fadeOut; } 
@keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; } }

/* Owl Carousel - Auto Height Plugin */
.owl-height { transition: height 500ms ease-in-out; }

/* Owl Carousel - Lazy Load Plugin */
.owl-carousel .owl-item .owl-lazy { opacity: 0; transition: opacity 400ms ease; }
.owl-carousel .owl-item img.owl-lazy { transform-style: preserve-3d; }

/* Owl Carousel - Video Plugin */
.owl-carousel .owl-video-wrapper { position: relative; height: 100%; background: #000; }
.owl-carousel .owl-video-play-icon { position: absolute; height: 80px; width: 80px; left: 50%; top: 50%; margin-left: -40px; margin-top: -40px; background: url("{$owl-image-path}owl.video.play.png") no-repeat; cursor: pointer; z-index: 1; -webkit-backface-visibility: hidden; transition: transform 100ms ease; }
.owl-carousel .owl-video-play-icon:hover { -ms-transform: scale(1.3, 1.3); transform: scale(1.3, 1.3); }
.owl-carousel .owl-video-playing .owl-video-tn, .owl-carousel .owl-video-playing .owl-video-play-icon { display: none; }
.owl-carousel .owl-video-tn { opacity: 0; height: 100%; background-position: center center; background-repeat: no-repeat; background-size: contain; transition: opacity 400ms ease; }
.owl-carousel .owl-video-frame { position: relative; z-index: 1; height: 100%; width: 100%; }

/* owl nav */
.owl-prev span, .owl-next span { }
	.owl-prev span:hover, .owl-next span:hover { color: #8199A3; }
.owl-prev, .owl-next { position: absolute; top: 35%; transform: translateY(-50%); height: 100%; width: 44px!important; height: 44px!important; box-shadow: 0px 0px 10px 0 rgb(0 0 0 / 40%)!important; border-radius: 500rem!important; display: flex!important; align-items: center!important; justify-content: center!important; background-color: #fff!important; color: #285C57!important; }
.owl-prev { left: -22px; }
.owl-next { right: -22px; }

/* removing blue outline from buttons */
button:focus, button:active { outline: none; }

/* 카테고리 선택 */
.category_select { display: block; margin: 0 auto 60px; max-width: 700px; text-align: center; }
.category_select p { color: #888; font-weight: 600; margin-bottom: 10px; }

/* 게시물 작성 페이지 - 파일 업로드 */
[v-cloak] { display: none; }
#upload_fieldset .upload_box { background-color: #f8f8f8; text-align: center; border: dotted 3px #ddd; transition: 0.3s ease-in-out; border-radius: 0.5rem; }
	#upload_fieldset .upload_box:hover { background-color: #f1f1f1; }
#upload_fieldset .upload_box input { display: none; }
#upload_fieldset .upload_box label { padding: 60px; text-align: center; color: #181818; margin-bottom: 0!important; }
#upload_fieldset .upload_box label .txt_01 { font-size: 1.2em; font-weight: bold; margin: 30px 0 15px; }
#upload_fieldset .upload_box label .txt_02 { font-size: 0.9em; font-weight: normal; }
#upload_fieldset .upload_box label .icon { font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 48; font-size: 3em; }
#upload_fieldset .upload_box ul { padding: 0 40px 40px 40px; }
#upload_fieldset .upload_box ul::after { content: ''; display: block; clear: both; }
#upload_fieldset .upload_box ul li { background-color: #fff; border-radius: 0.5rem; margin-bottom: 20px; padding: 15px; display: flex; align-items: center; justify-content: space-between; font-size: 0.9em; width: 49%; float: left; color: rgba(24,24,24,0.65); }
	#upload_fieldset .upload_box ul li:nth-of-type(2n+0) { float: right; }
	#upload_fieldset .upload_box ul li:last-of-type {   }
#upload_fieldset .upload_box ul li button { display: inline-flex; align-items: center; justify-content: flex-end; padding: 0!important; }
#upload_fieldset .upload_box ul li button .icon { color: rgba(24,24,24,0.65); }

/* 게시물 작성 페이지 - 평점 */
#rating_fieldset { margin: 4rem 0; }
#rating_fieldset > label { text-align: center; font-size: 1.2em; color: #181818; }
.rating { margin-top: 20px; border: none; display: flex; align-items: center; justify-content: center; flex-direction: row-reverse; }
.rating > label { color: #ddd; width: auto; margin: 0; }
.rating > label:before { margin: 5px; font-size: 2em; font-family: FontAwesome; content: "\f005"; display: inline-block; }
.rating > input { display: none; }
.rating > input:checked ~ label, 
.rating:not(:checked) > label:hover, 
.rating:not(:checked) > label:hover ~ label { color: #F79426; }
.rating > input:checked + label:hover, 
.rating > input:checked ~ label:hover, 
.rating > label:hover ~ input:checked ~ label, 
.rating > input:checked ~ label:hover ~ label {/* color: */ }

/* 게시물 뷰 페이지 - 헤더 */
.board_view .view_header { text-align: center; border-top: solid 1px #181818; padding: 30px; }
.board_view .view_header .tit { font-weight: bold; font-size: 1.5em; }
.board_view .view_header .data { color: #888; }
.board_view .view_header > div {font-size: 1.15em; align-items: stretch}
.board_view .view_header > div > .star_rate{margin: 0 15px 0 0; padding-right: 15px; border-right: 1px solid #ddd; }
.board_view .view_header > div > .star_rate > i {display: inline-flex; align-items: center; justify-content: center;}
.board_view .view_header > div > .data{padding-left: 15px; margin-left: 15px; border-left: 1px solid #ddd;}

/* 게시물 뷰 페이지 - 내용 */
.board_view .view_contents { text-align: center; border-top: solid 1px #e5e5e5; border-bottom: solid 1px #e5e5e5; padding: 40px 0 80px; display: flex; flex-direction: column; }
/*.board_view .view_contents .view_contents_cont {color: #285C57; }*/

.board_view .view_contents_tit{font-weight:normal; color:#3A856C; order: 2;}
.board_view .view_contents_tit .material-symbols-outlined{font-size: 32px; }
.board_view .view_contents_tit2{font-weight:bold; font-size:1.15em; color:#3A856C; margin-bottom: 20px; order: 3;}
.board_view .view_contents_cont{order: 4;}
.board_view .view_contents_down {margin-top: 30px; order: 5;}
.board_view .view_contents_down > a {display: flex; align-items: center; justify-content: center; color: #333; background-color: #E9F3F2; padding: 15px; border-radius: 10px; font-size: 0.9em; width: fit-content; margin: auto; text-align: left;}
.board_view .view_contents_down > a:hover { background-color: #D4EBE8; }
.board_view .view_contents_down > a > span:last-child{display: flex; align-items: center; justify-content: center; margin-left: 15px; font-weight: 600; color: #3A856C; }
.board_view .view_contents_img {order: 1;}
.board_view .view_contents img { max-width: 1100px; margin-top: 30px; margin-bottom: 60px; }

/*답글*/
.board_view .view_contents_reply{ padding: 80px; color: #285C57; background-color:#E9F3F2; border-top: none;}	
.board_view .view_contents_reply .view_contents_cont { margin-top: 1rem;}
.view_reply { padding:1.5rem; background-color:#f7f7f7;}
.view_reply textarea{width:88.5%; }
.reply_btn{ font-size: 0.95em; height: 60.84px; width: auto; padding: 0 25px; display: flex; align-items: center; justify-content: center; border-radius: 0.5rem; }
/*댓글*/
.view_comment_list {border-bottom: solid 1px #e5e5e5; padding:2.5rem; color: #285C57; background-color:#E9F3F2 }
.view_comment_list > p {justify-content: center}
.view_comment_list > p.view_contents_tit {margin-bottom: 20px;}
.view_comment_list > p > span.material-symbols-outlined{margin-right: 10px;}
.view_comment { border-bottom: solid 1px #e5e5e5; padding:1.5rem; background-color:#f7f7f7;}
.view_comment input {width:88.5%; }
.comment_name{margin-right:5px; font-weight:bold;}
.comment_btn { font-size: 0.95em; height: 60.84px; width: auto; padding: 0 25px; display: flex; align-items: center; justify-content: center; border-radius: 0.5rem; }
.view_comment_list_wait { color: #BC6C82; background-color:#F9EEF1; }
/* 게시물 뷰 페이지 - 뷰 네비게이션 */
.view_nav * { display: flex; align-items: center; }
.view_nav .btn { border-bottom: solid 1px #e5e5e5; height: 78px; transition: 0.3s ease-in-out; }
	.view_nav .btn:hover { background-color: rgba(247, 247, 247, 0.5); }
.view_nav .btn .nav_header { padding: 0 40px 0 20px; color: #888; }
.view_nav .btn .nav_tit { color: #181818; }

/* FAQ */
.blind { display: none; }
#faq { width: 100%; }
	#faq:before,#faq:after{ display: block; content: ''; clear: both; }
.qna_list { border-top: 2px solid #333; }
.qna_item { border-bottom: 1px solid #e6e6e6; background-color: #fff; }
	.qna_item:hover { background: #f7f7f7; }
.qna_item .question_article { padding: 0 20px; border-bottom: 0; }
.qna_item:first-child .question_article { border-top: 0; }
.qna_item.on .question_article { border-bottom: 0; }
.qna_item.on + .qna_item .question_article { border-top: 0; }
.qna_item .question { width: 100%; display: inline-flex; align-items: center; justify-content: space-between; color: #000; -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -o-transition:all 0.3s ease; -ms-transition:all 0.3s ease; transition:all 0.3s ease; font-size: 1.1em; line-height: 78px; text-align: left; cursor: pointer; font-weight: 600; }
.qna_item.on .question { font-size: 1.1em; color: #285C57; text-align: left;}
.qna_item .question .txtwrap { display: inline-flex; align-items: center; }
.question .fa-chevron-down { float: right; line-height: 65px; color: #b7b7b7; }
	.qna_item.on .question .fa-chevron-down { transform: rotate(180deg); transition:all 0.3s ease; }
.qna_item .question span.q { margin-right: 10px; display: inline-block; font-weight: bold; color: #285C57; }
.qna_item .answer_article a:hover { text-decoration: underline; }
.qna_item .answer_article { display: none; padding: 80px; border: 0; background: #f7f7f7; color: #666; line-height: 24px; border-top: 1px solid #e6e6e6; }
.qna_item .answer_article strong { font-weight: normal; }

/* ==================== 모바일 레이아웃 ==================== */

@media ( max-width: 900px ) {
	
	/* 헤더 */
	header { z-index: 9999; height: 70px; }
	header.active { height: 70px; }
	header .wrap { height: 70px; }
	
	/* 헤더 - 탑 서브 메뉴 */
	#top_sub_menu a { display: none; }
	
	/* 헤더 메뉴 */
	#menu_wrapper { overflow: hidden; max-width: 100%; cursor: pointer; }
	#menu_wrapper #hamburger_menu { position: relative; width: 25px; height: 20px; }
	#menu_wrapper #hamburger_menu span { opacity: 1; left: 0; display: block; width: 100%; height: 2px; border-radius: 10px; color: black; background-color: #181818; position: absolute; transform: rotate(0deg); transition: .4s ease-in-out; z-index: 777999999; }
		#menu_wrapper #hamburger_menu span:nth-child(1) { top: 0; }
		#menu_wrapper #hamburger_menu span:nth-child(2) { top: 9px; }
		#menu_wrapper #hamburger_menu span:nth-child(3) { top: 18px; }
		#menu_wrapper #hamburger_menu.open span { background-color: #181818; }
		#menu_wrapper #hamburger_menu.open span:nth-child(1) { transform: translateY(9px) rotate(135deg); }
		#menu_wrapper #hamburger_menu.open span:nth-child(2) { opacity: 0; transform: translateX(-60px); }
		#menu_wrapper #hamburger_menu.open span:nth-child(3) { transform: translateY(-9px) rotate(-135deg); }
	
	#menu_container .menu_list { padding-left: 0; display: block; position: absolute; width: 100%; background: white; z-index: 9999; overflow-y: auto; overflow-x: hidden; left: -100%; padding: 70px 20px 0 20px; top: 0; }
		#menu_container .menu_list::after { content: ''; width: 100%; top: 70px; left: 0; height: 1px; background-color: #e6e6e6; position: absolute; }
	#menu_container .menu_list.active { box-shadow: 0 10px 15px 0px rgba(0,0,0,0.2); }
	
	#menu_container .menu_list .menu_submenu { padding: 0 0 20px 28px; } /*  display 지정 xxx */
	#menu_container .menu_list .menu_submenu a { display: inline-block; padding: 12px 0; color: #181818; }
	#menu_container .menu_list li { position: relative; }
	#menu_container .menu_list li.accordion_toggle .menu_link { margin-right: 0; color: #181818; }
	#menu_container .menu_list li.accordion_toggle, #menu_container .menu_list .menu_login { font-size: 16px; padding: 20px 0; text-transform: uppercase; border-top: 1px solid #e6e6e6; }
	#menu_container .menu_list li:first-of-type { border-top: 0; }
	
	.accordion_toggle, .accordion_content { cursor: pointer; font-size: 16px; position: relative; }
  	.accordion_content { display: none; }
	.accordion_toggle a:before, .accordion_toggle a:after { content: ''; display: block; position: absolute; top: 50%; right: 0px; width: 15px; height: 2px; margin-top: -1px; background-color: #181818; transform-origin: 50% 50%; transition: all 0.3s ease-out; }
	.accordion_toggle a:before { transform: rotate(-90deg); opacity: 1; z-index: 2; }
	.accordion_toggle.active_tab { transition: all 0.3s ease; }
	.accordion_toggle a.active:before { transform: rotate(0deg); background: #181818 !important; }
	.accordion_toggle a.active:after { transform: rotate(180deg); background: #181818 !important; opacity: 0; }
	
	/* 모바일 메뉴 상단 로고 */
	#menu_container .menu_list .logo { position: absolute; left: 20px; top: 0; height: 70px; transform: translateY(0%); z-index: 9999; display: flex!important; align-items: center; }
	#menu_container .menu_list .logo * { fill: #a78e68!important; }
	
	/* 헤더 - 스크롤 내렸을 때 */
	header.active #menu_wrapper #hamburger_menu span { background-color: #181818; }
	
	/* 퀵 메뉴 */
	#quick_menu { display: flex; align-items: center; justify-content: space-between; width: 100%; right: 0; top: auto; bottom: 20px; transform: none; padding: 0 20px; z-index: 222; }
	#quick_menu a { width: 32.3%; font-size: 14px; height: 44px; line-height: 43px; margin-bottom: 0; box-shadow: 5px 5px 10px 0 rgb(0 0 0 / 20%); border: solid 1px #285C57; }
		#quick_menu a:nth-of-type(1), #quick_menu a:nth-of-type(4), #quick_menu a:nth-of-type(6) { display: none; }
	
	/* 푸터 */
	footer { padding: 60px 0 104px!important; text-align: center; }
	footer .wrap { display: inline-block; }
	footer #footer_info, footer #footer_customer { width: 100%; }
	footer #footer_info #footer_nav a { font-size: 15px;  margin-right: 8px; padding-right: 10px; }
	footer #footer_info p { font-size: 14px!important; }
	footer #footer_info .txt_01 { margin: 30px 0 15px; }
	footer #footer_customer { margin-top: 30px; }
	footer #footer_customer .txt_02 { font-size: 14px; }
	
	/* 인풋 */
	input, textarea, select { font-size: 16px; }
	textarea { min-height: 150px; }
	input[type="checkbox"] { transform: scale(0.65); }
	
	/* 폼 */
	form fieldset, form #announcement { margin-bottom: 20px; }
	form .fieldset_wrap { display: inline; }
		form .fieldset_wrap fieldset:nth-of-type(2) { margin-left: 0px; }
	
	/* 폼 - 이름, 연락처 */
	form #name_fieldset, form #tel_fieldset { width: 100%; float: none; padding-right: 0%; }
	
	/* 폼 - 주소 */
	#address_fieldset > .flexwrap, #address_fieldset #u_add_02 { width: 100%!important; float: left; }
	#address_fieldset #u_add_02, #address_fieldset #u_add_03 { margin-top: 8px; }
	#address_fieldset .flexwrap input { width: 72%; }
	#address_fieldset .flexwrap button { width: 26%; }
	
    /* 폼 - 통화희망시간*/
    #time_fieldset .flexwrap select { width: 45%; }
    #time_fieldset .flexwrap span { width: 5%; }
    
	/* 폼 - 약관 텍스트 박스 */
	form #terms_fieldset textarea { margin: 5px 0 8px; }
	form #terms_fieldset label p { margin: 0 0 0 4px; font-size: 0.9em; }
	
	/* 폼 - 개인정보취급방침 동의 */
	#agree_area { margin-top: 20px; font-size: 0.9em; }
	#agree_area label p { margin: 0 10px 0 4px; }
	
	/* 폼 - 버튼 */
	.form_btn { margin: 30px 2% 0 0; }
		.form_btn:last-of-type { margin: 30px 0 0 0; }
	
	/* 폼 - 자동등록방지 */
	#captcha { margin-top: 30px; }
	
	/* 섹션 - 패딩 */
	section[id*="_sec"] { padding: 60px 0; }
	
	/* 비주얼 */
	#sub_visual { height: 340px; margin-top: 70px; }
	#sub_visual .txt_01 { margin: 0 0 20px; font-size: 40px; }
	
	/* 카테고리 선택 */
	.category_select { margin: 0 auto 30px; width: 100%; }
	
	/* 카테고리 탭 */
	.category_tab { margin-bottom: 40px; }
	.category_tab .tablinks { overflow: hidden; width: 32%; margin-right: 2%; padding: 10px 0; font-size: 14px; }
		.category_tab .tablinks:last-of-type { margin-right: 0; }
	
	/* 보드 검색창 */
	.search_box { width: 70%; padding: 0 20px 0 12px; margin: 0 auto 30px; transform: scale(0.9); /* transform-origin: right; */ float: none; }
	.search_box input { height: 48px; }
		.search_box input::placeholder { font-size: 14px; }

	/* 뱃지 */
	.badge, span[class*="status_badge_"] { padding: 4px 8px 3px; font-size: 12px; line-height: 14px; }
	span[class*="status_badge_"] { width: 54px; }
	
	/* 페이지 네이션 */
	.pagination { margin-top: 15px; }
	.pagination * { font-size: 14px; }
	.pagination .num_list { margin: 0 10px; }
	.pagination .num_list a { width: 28px; height: 28px; line-height: 28px; }
	.pagination a span { width: 20px; }
	
	/* 리스트형 게시판 */
	.list_board_table { font-size: 15px; }
	.list_board_table tr { height: 60px; }
	.list_board_table tr .title { padding: 20px; width: 60%; }
		.list_board_table tr span.material-symbols-outlined { margin-left: 8%; }
	.list_board_table tr .data { display: none; }
	
	/* 갤러리형 게시판 */
	.gallery_board_table tr { width: 48.5%!important; margin-right: 3%!important; margin-bottom: 4%; }
		.gallery_board_table tr:nth-of-type(2n+0) { margin-right: 0%!important; }
	.gallery_board_table tr:nth-of-type(n+3) { margin-top: 25px; }
	.gallery_board_table tr .title { font-size: 15px; margin: 0; margin-top: 0px; }
	.gallery_board_table tr .title .badge { display: inline-flex; align-items: center; margin-right: 3px; transform: scale(0.85); padding: 3px 5px 2px;}
		.gallery_board_table tr .title .badge::after { content: ''; display: block; clear: both; }
	.gallery_board_table tr .info { font-size: 13px; }
	.gallery_board_table tr .info .writer { margin-right: 5px; }
	
	.gallery_board_table tr .thumbnail { width: 100%; height: 170px; }

	/* 게시물 작성 페이지 - 파일 업로드 */
	#upload_fieldset .upload_box { border: dotted 2px #ddd; }
	#upload_fieldset .upload_box label { padding: 40px 20px; font-size: 0.9em; }
	#upload_fieldset .upload_box label .icon { font-size: 2.5em; }
	#upload_fieldset .upload_box label .txt_01 { margin: 20px 0 10px; }
	#upload_fieldset .upload_box ul { padding: 0 20px 20px 20px; }
	#upload_fieldset .upload_box ul li { width: 100%; margin: 0 0 10px!important; padding: 12px; }
	#upload_fieldset .upload_box ul li button .icon { font-size: 1.5em; }
	
	/* 게시물 뷰 페이지 - 헤더 */
	.board_view .view_header { padding: 20px 0; margin-bottom: 0 }
	
	/* 게시물 뷰 페이지 - 내용 */
	.board_view .view_contents { padding: 40px 0 40px; }
	.board_view .view_contents img { width: 100%; margin-bottom: 30px; }
	.board_view .view_contents_down > a {width: 100%;}
	
	
	/* 게시물 작성 페이지 - 평점 */
	#rating_fieldset { margin: 2rem 0; }
	#rating_fieldset > label { font-size: 1.1em; }
	.rating { margin-top: 10px; }
	
	/*답글*/
	.board_view .view_contents_reply{padding: 1rem; }	
	.view_contents_tit{font-weight:normal; color:#3A856C; }
	.view_reply { border-bottom: solid 1px #e5e5e5; }
	
	/*댓글*/
	.view_comment_list { padding:1rem .5rem; font-size: 0.9em;}
	.comment_name{margin-right:8px;}
	
	/* 게시물 뷰 페이지 - 뷰 네비게이션 */
	.view_nav .btn { font-size: 0.9em; height: 54px; }
	.view_nav .btn .nav_header { padding: 0 20px 0 0; }
		
	/* FAQ */
	.qna_item:hover { background: #fff; }
	.qna_item .question { font-size: 1em!important; line-height: 60px; }
	.qna_item .question_article { padding: 0; }
	.qna_item .answer_article { padding: 40px 20px; }
}