#boardWrap {position:relative;}
#boardWrap:after {content:''; display:block; clear:both;}

.st_search {text-align:right;}

.boardBtnArea {margin-top:20px; overflow:hidden;}
.boardBtnArea .colLeft {float:left;}
.boardBtnArea .colRight {float:right; text-align:right;}

#searchWrap {display: none; border:1px solid #dfdfdf; background:#f7f7f7; margin-top:40px; box-sizing:border-box; padding:25px 0; text-align:center;}
#searchWrap .select {width:15%;}
#searchWrap .text {width:50%;}
#searchWrap .btn_search {width:9%; height:31px; line-height:31px; border:none; background:#666; color:#fff;}
.subject {text-align:left !important;}
.subject a:hover {color: var(--main-color); text-decoration:underline;}
.file {font-size:14px; color:#999;}

#commentWrap {border-top:1px solid #222; margin-top:40px;}
.commentArea dl {border-top:1px dashed #d0d0d0; padding:20px 10px;}
.commentArea dl:first-child {border-top:none;}
.commentArea dt {margin-bottom:5px;}
.commentArea dt .date {color:#999; font-size:14px;}
.commentArea dt .btn_cmt {background:#aeaeae; font-size:12px; color:#fff; border-radius:2px; display:inline-block; padding:0 5px; height:18px; line-height:18px;}
.writeArea {border:1px solid #d0d0d0; background:#f7f7f7;}
.writeArea dl {padding:20px;}
.writeArea dl dt {margin-bottom:5px;}
.writeArea dl dt input.text {width:15%;}
.writeArea dl dd .textarea {width:89%; height:95px; resize:none;}
.writeArea dl dd .btn_cmt_ok {width:10%; height:95px; background:#666; color:#fff; line-height:95px; text-align:center;}

/* 글 삭제 팝업 */
.delete_pop {text-align:center; border:1px solid #d0d0d0; border-top:2px solid  var(--main-color); padding:10%;}
.delete_pop .btnArea {text-align:center; margin-top:3%;}
.delete_pop .btnArea a {vertical-align:bottom;}

/* 리스트 스킨 1 - 전체 가운데 정렬 */
.list table tr:hover {background:#f7f7f7;}
.tblType01 {border-top:2px solid  var(--main-color);}
.tblType01 table th, .tblType01 table td {text-align:center; padding:36px 0; border-bottom:1px solid #B3D1CA; font-weight:normal; word-break:break-all;}
.tblType01 table thead th, .tblType01 table thead td {border-bottom:1px solid #B3D1CA; padding: 26px 0; font-size: 20px; font-weight: 600;}
.tblType01 .notice {background:#f7f7f7;}
.tblType01 .total {background:#f7f7f7;}
.tblType01 .total2 {background:#f0f0f0;}

/* 뷰 스킨 1 - 전체 왼쪽 정렬 */
.tblType02 {border-top:2px solid  var(--main-color); overflow-x: auto;}
.tblType02 table th, .tblType02 table td {text-align:left; padding:18px 20px; border-bottom:1px solid #B3D1CA; font-weight:normal;}
.tblType02 table th {font-weight: 700;}
.tblType02 table thead th, .tblType01 table thead td {padding: 26px 20px; border-bottom:1px solid #B3D1CA; text-align:center; font-size: 20px;}
.tblType02 .info {font-size:14px; line-height:24px;}
.tblType02 .info .underline {text-decoration:underline;}
.tblType02 .view_contents {padding:30px 25px;}
.tblType02 .view_contents * {max-width:100%; word-break: break-all;}
.tblType02 .view_contents img {width:auto; height:auto; max-width:100%; /* height:115px; */}
.tblType02 .view_thumb {overflow:hidden;}
.tblType02 .view_thumb li {float:left; padding:5px 15px; border:1px solid #d0d0d0; margin:0 10px 10px 0;}

/* 폼 스킨 */
#basic.form .textarea {resize:none; width:100%; height:100px;}

/* 리스트 스킨 - 페이징 */
#paging {display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 56px;}
#paging a, #paging b {display: flex; align-items: center; justify-content: center; width:32px; height:32px; box-sizing:border-box; border: 1px solid transparent; color:#222; vertical-align:top;}
#paging a.arrow {display: inline-flex; align-items: center; justify-content: center;}
#paging a.arrow img {width: 24px; vertical-align: middle;}
#paging b {color:#006740; border-color:#006740; font-weight:600; border-radius: 4px;}

/* 매장안내 게시판 스킨 */
#skin_store.list:after {content:''; display:block; clear:both;}
#skin_store.list .st_search {margin-bottom:10px;}
#skin_store.list .mapArea {width:452px; position:relative; float:left;}
#skin_store.list .mapArea a {position:absolute; right:0; top:0;}
#skin_store.list .listArea {width:425px; float:right;}

/* FAQ 게시판 스킨 */
#faq.list dl {}
#faq.list dt {padding:12px 20px; border-bottom:1px solid #d0d0d0; position:relative;}
#faq.list dt .subject {padding:2px 20px; display:inline-block; width:82%; box-sizing:border-box;}
#faq.list dt .adm_btnArea {text-align:right;}
#faq.list dt.active .subject {color: var(--main-color);}
#faq.list dt.active .plusminus {color: var(--main-color);}
#faq.list dd {padding:12px 20px 12px 70px; position:relative; border-bottom:1px solid #d0d0d0; background:#f7f7f7; display:none;}
#faq.list dd .a {position:absolute; left:20px; top:12px;}
#faq.list .q {display:inline-block; width:28px; height:28px; text-align:center; line-height:28px; font-weight:500; color:#fff; background:#666; border-radius:100px; font-size:14px; vertical-align:top;}
#faq.list .a {display:inline-block; width:28px; height:28px; text-align:center; line-height:28px; font-weight:500; color:#fff; background: var(--main-color); border-radius:100px; font-size:14px;}
#faq.list .plusminus {float:right; font-size:22px; font-weight:500; position:absolute; right:20px; top:12px;}

/* 갤러리 게시판 스킨 */
#gallery.list {}
#gallery.list ul {display: grid; grid-template-columns: repeat(3, 1fr); gap: 56px 45px;}
#gallery.list ul li {width: 100%; min-width: 0;}
#gallery.list ul li .img {position: relative; display: block; width: 100%; padding-bottom: 68%;}
#gallery.list ul li .img img {position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover;}
#gallery.list ul li .infoArea {margin-top: 24px; min-width: 0;}
#gallery.list ul li .name {font-size: 20px; font-weight: 500; min-width: 0;}
#gallery.list ul li .date {display: block; margin-top: 8px; font-size: 16px; font-weight: 500;}



/* 설문조사 게시판 스킨 */
#basic.view .survey_list li {margin:15px 0;}
#basic.result .survey_list li {position:relative; margin:15px 0;}
#basic.result .survey_list li:after {content:''; display:block; clear:both;}
#basic.result .survey_list li .comm_radio_label {width:40%; float:left; margin:0;}
#basic.result .survey_list li .graphBox {width:60%; float:left;}
#basic.result .survey_list li .graphBox:after {content:''; display:block; clear:both;}
#basic.result .survey_list li .graphBox .graph {display:inline-block; width:75%; border:1px solid #d0d0d0; border-radius:100px; height:6px; position:relative; overflow:hidden;}
#basic.result .survey_list li .graphBox .graph .persent {position:absolute; left:0; top:0; display:inline-block; background:#666; height:6px;}
#basic.result .survey_list li .graphBox .result {float:right; width:20%; text-align:left; vertical-align:top;}

#layerPop.layerMap {position:fixed; width:901px; z-index:110; left:50%; margin-left:-450px; top:5%; border:1px solid #d0d0d0; background:#fff; display:none;}
#layerPop.layerMap a {position:absolute; right:-1px; top:-1px;}
#layerPop.layerMap img {vertical-align:top;}

/* 이달의 행사 달력 스킨 */
.calendarTable {border-top:2px solid  var(--main-color);}
.calendarTable th, .calendarTable td {padding:10px;}
.calendarTable thead th {font-weight:normal; background:#fdfdff; padding:15px 10px;}
.calendarTable thead .sun {color: var(--main-color);}
.calendarTable thead .sat {color:#1f74d3;}
.calendarTable tbody td {border:1px solid #d0d0d0; height:11vmin; vertical-align:top;}
.calendarTable tbody td .num {display:block;}
.calendarTable tbody .sun {background:#fff9fa;}
.calendarTable tbody .sun .num {color: var(--main-color); background:#fff9fa;}
.calendarTable tbody .sat {background:#f5fbfb;}
.calendarTable tbody .sat .num {color:#1f74d3;}
.calendarTable tbody td ul li {border-top:1px dashed #aaa; padding:3px 0;}
.calendarTable tbody td ul li:first-child {border:none;}
.calendarTable tbody td ul li a {font-size:14px; line-height:normal;}
.calendarTable tbody td ul li a:hover {color: var(--main-color);}

/********************************************************/
/**************** 테블릿 1024px 해상도 ******************/
/********************************************************/
@media only screen and (max-width:1024px){
#searchWrap .select {width:20%;}

.writeArea dl dd .textarea {height:65px;}
.writeArea dl dd .btn_cmt_ok {height:65px; line-height:65px;}

/* 리스트 스킨 1 - 전체 가운데 정렬 */
.tblType01 table th, .tblType01 table td {padding:12px 5px;}

/* 뷰 스킨 1 - 전체 왼쪽 정렬 */
.tblType02 .view_contents {padding:2% 0; width:100%;}
.tblType02 .view_thumb li {width:32%; margin:0 1% 1% 0; padding:1%; text-align:center; box-sizing:border-box;}
.tblType02 .view_thumb li img {width:98%; height:auto;}


/* 매장안내 게시판 스킨 */
#skin_store.list .mapArea {width:49%;}
#skin_store.list .listArea {width:49%;}

/* 갤러리 게시판 스킨 */
#gallery.list ul {gap: 56px 24px;}

#layerPop.layerMap {width:90%; left:5%; top:5%; margin-left:0;}
}

/********************************************************/
/**************** 테블릿 768px 해상도 *******************/
/********************************************************/
@media only screen and (max-width:768px){
#searchWrap {padding:3%; text-align:left;}
#searchWrap .select {width:33%; display:block; margin-bottom:3px;}
#searchWrap .text {width:80%;}
#searchWrap .btn_search {width:19%;}


/* 설문조사 게시판 스킨 */
#basic.result .survey_list li .comm_radio_label {width:100%; float:none;}
#basic.result .survey_list li .graphBox {float:none; width:100%; box-sizing:border-box; padding-left:19px;}
#basic.result .survey_list li .graphBox:after {content:''; display:block; clear:both;}
#basic.result .survey_list li .graphBox .graph {width:70%; float:left;}
#basic.result .survey_list li .graphBox .result {width:24%; float:right;}

}/********************************************************/
/**************** 모바일 640px 해상도 *******************/
/********************************************************/
@media only screen and (max-width:640px){

.commentArea dt .date {font-size:3.4vw;}
.writeArea dl dt input.text {width:30%;}
.writeArea dl dd .textarea {width:80%;}
.writeArea dl dd .btn_cmt_ok {width:18%;}

.boardBtnArea .colLeft {float:none; text-align:right;}
.boardBtnArea .colLeft img {width:8%;}
.boardBtnArea .colRight {float:none;}
.boardBtnArea .colRight a {padding:2%; height:auto; line-height:normal; min-width:auto;}

/* 리스트 스킨 1 - 전체 가운데 정렬 */
#basic .tblType01 .rp {display:none;}
#basic .tblType01 .img_bell {width:20px;}
#basic .tblType01 col.num {width:14% !important;}
#basic .tblType01 col.writer {width:20% !important;}
#basic .tblType01 table th, .tblType01 table td {padding:3% 1%; box-sizing:border-box; font-size: .875rem;}

/* 리스트 스킨 - 페이징 */
#paging {margin-top: 3.5rem;}

/* 매장안내 게시판 스킨 */
#skin_store.list .mapArea {width:100%; float:none; margin-bottom:5%;}
#skin_store.list .mapArea img {width:100%;}
#skin_store.list .listArea {width:100%; float:none;}

#layerPop.layerMap a img {width:35px;}

/* FAQ 게시판 스킨 */
#faq.list dt {padding:3%;}
#faq.list dt .subject {padding:0 3%;}
#faq.list dd {padding:3% 3% 3% 12%;}
#faq.list dd .a {left:3%; top:3%;}
#faq.list .plusminus {right:3%; top:5px;}
#faq.list .active .plusminus {right:3%; top:8px;}
#faq.list .q, #faq.list .a {width:20px; height:20px; line-height:20px; font-size:3vw;}

/* 갤러리 게시판 스킨 */
#gallery.list ul {grid-template-columns: repeat(2, 1fr); gap: 40px 10px;}
#gallery.list ul li .infoArea {margin-top: 1rem;}
#gallery.list ul li .name {font-size: .875rem;}
#gallery.list ul li .date {margin-top: .5rem; font-size: .75rem;}

/* 뷰 스킨 1 - 전체 왼쪽 정렬 */
.tblType02 table colgroup {display:none;}
.tblType02 table th, .tblType02 table td {display:block; width:100%; padding:3%; box-sizing:border-box;}
.tblType02 table th {border-bottom:none;}
.tblType02 table thead th, .tblType01 table thead td {padding: 1.25rem .75rem; font-size: 1rem;}
.tblType02 table tbody th,
.tblType02 table tbody td {font-size: .875rem;}
.tblType02 .info {font-size: .75rem; line-height: 1.4;}
.tblType02 .view_contents {padding:3%;}
.tblType02 .view_thumb li {width:48%; margin:1%; box-sizing:border-box; padding:2%;}

#basic.view .tblType02 table th, #basic.view .tblType02 table td {width:auto; display:table-cell; border-bottom:1px solid #d0d0d0;}

/* 이달의 행사 달력 스킨 */
.calendarTable colgroup col {display:none;}
.calendarTable thead {display:none;}
.calendarTable tbody .empty {display:none;}
.calendarTable tbody td {display:block; width:100%; height:auto; box-sizing:border-box; border-top:none;}
.calendarTable tbody td .num {display:inline-block;}
.calendarTable tbody td ul li a {font-size:3.4vw; line-height:1.5em;}
}