
/*************************************************
  List 
*************************************************/

/* page & navi-button */
.bbs-page { margin:5px auto; text-align:center; }
.bbs-navi { margin:10px 0; text-align:right; }



/*************************************************
  List Gallery
*************************************************/

.div-gallery-wrap {}
.div-gallery-wrap::after { display:block; clear:both; content:''; }
.div-gallery-wrap .div-gallery-item { margin:0 .75rem .75rem 0; float:left; }
/* 900px 이상 : 4개씩 */
@media screen and (min-width:900px) {
	.div-gallery-wrap .div-gallery-item { width:calc((100% - 2.25rem) / 4); margin:0 .75rem .75rem 0; }
	.div-gallery-wrap .div-gallery-item:nth-child(4n) { margin-right:0; }
	.div-gallery-wrap .item-subject { font-size:1rem; }
}
/* 620px ~ 899px : 3개씩 */
@media screen and (min-width:620px) and (max-width:899px) {
	.div-gallery-wrap .div-gallery-item { width:calc( (100% - 1.5rem) / 3); margin:0 .75rem .75rem 0; }
	.div-gallery-wrap .div-gallery-item:nth-child(3n) { margin-right:0; }
	.div-gallery-wrap .item-subject { font-size:.875rem; }
}
/* 300px ~ 619px : 2개씩 */
@media screen and (min-width:300px) and (max-width:619px) {
	.div-gallery-wrap .div-gallery-item { width:calc( (100% - .5rem) / 2); margin:0 .5rem .75rem 0; }
	.div-gallery-wrap .div-gallery-item:nth-child(2n) { margin-right:0; }
	.div-gallery-wrap .item-subject { font-size:.75rem; }
}
/* 최소 ~ 299px : 1개씩 */
@media screen and (max-width:299px) {
	.div-gallery-wrap .div-gallery-item { width:100%; }
	.div-gallery-wrap .item-subject { font-size:.75rem; }
}

.div-gallery-wrap .div-gallery-item .item-img { position:relative; width:100%; height:0; padding-bottom:70%; }
.div-gallery-wrap .div-gallery-item .item-img .item-img-inner { position:absolute; width:100%; height:100%; top:0; left:0; }
.div-gallery-wrap .div-gallery-item .item-img .item-img-inner img { width:100%; height:100%; }
.div-gallery-wrap .div-gallery-item .item-subject { padding:.4rem 0; width:calc(100% - .125rem); text-overflow:ellipsis; overflow:hidden; white-space:nowrap; }
.div-gallery-wrap .div-gallery-item a.ui-link { color:#333333; text-decoration:none; }



/*************************************************
  Read
*************************************************/

.bbs-read .ui-head { padding:0.4rem 0.4rem; background-color:#f0f0f0; }
.bbs-read .ui-body { padding:0.4rem 0; }
.bbs-read .bbs-info { font-size:.8125rem; }
.bbs-read .bbs-info > div { text-align:right; }
.bbs-read .bbs-info .read-member-info { margin:0 .5rem 0 0; }
.bbs-read .bbs-info .read-member-info::after { content:'|'; padding-left:.5rem; }
.bbs-read .bbs-info .read-member-info:last-child::after { content:''; padding-left:0; }
.bbs-read .bbs-body { margin:20px 0 10px; border:0px solid #aaaaaa; }
.bbs-read .bbs-read-body { min-height:6rem; }
.bbs-read .bbs-file-view > div { text-align:center; margin:0 0 5px 0; }

/* 월간식단표 */
@media screen and (min-width:500px) and (max-width:599px) {
	.bbs-read .bbs-read-body table * { font-size:12px; }
}
@media screen and (min-width:400px) and (max-width:499px) {
	.bbs-read .bbs-read-body table * { font-size:11px; }
}
@media screen and (max-width:399px) {
	.bbs-read .bbs-read-body table * { font-size:10px; }
}


/*************************************************
  Comment
*************************************************/

h4.comment-read-title { font-size:1rem; color:dodgerblue; }
h4.comment-read-title::before { content:"\f044"; font-family:FontAwesome; margin:0 4px 0 0; }
h4.comment-write-title { font-size:1rem; color:dodgerblue; }
h4.comment-write-title::before { content:"\f044"; font-family:FontAwesome; margin:0 4px 0 0; }

.bbs-comment .no-list { padding:.5rem; background:#f0f0f0; text-align:center; font-size:.875rem; }

.bbs-comment-item { margin:.375rem 0; position:relative; }
.bbs-comment-item .bbs-comment-item-head { font-size:0.8125rem; font-weight:normal; padding:.4rem .4rem; background:#f0f0f0; border:#e0e0e0; border:1px solid #cccccc; border-bottom:0; }
.bbs-comment-item .bbs-comment-item-head::after { display:block; clear:both; content:''; }
.bbs-comment-item .bbs-comment-item-head .float-right { font-size:.75rem; }
.bbs-comment-item .bbs-comment-item-body { font-size:0.8125rem; padding:.4rem .4rem; border:1px solid #cccccc; }

.bbs-comment-write { margin:20px 0 0 0; }
.bbs-comment-write .bbs-comment-write-box { border:0px solid #aaaaaa; padding:.5rem; background:#f0f0f0; }
.bbs-comment-write .no-privilege { margin:0 0 .5rem 0; font-size:.875rem; }
.bbs-comment-write-name {}
.bbs-comment-write-name::after { display:block; clear:both; content:''; }
.bbs-comment-write-name .div--1 { margin:0 .125rem 0 0; }
.bbs-comment-write-name .div--2 { }

.bbs-comment-write-name .div--1 .ui-input-text { margin:.125rem 0; }
.bbs-comment-write-name .div--3 .ui-input-text { margin:.125rem 0; display:inline-block;  }
input#c_name { font-size:.75rem; width:6rem; margin:0 0 4px 0; }
input#c_pass { font-size:.75rem; width:6rem; margin:0 0 4px 0; }
input#txt_spamkey { font-size:.75rem; width:5rem; display:inline; margin:0 0 0 0; vertical-align:top; }
#spamkey_help { font-size:.75rem; margin:.25rem 0; color:navy; }
#zsfImg { vertical-align:baseline; }
.bbs-comment-write-textarea { }
.bbs-comment-write-textarea::after { display:block; clear:both; content:''; }
.bbs-comment-write-textarea .bbs-comment-write-textarea-1 { float:left; width:calc(100% - 6px - 60px); margin:0 6px 0 0; }
.bbs-comment-write-textarea .bbs-comment-write-textarea-2 { float:left; width:60px; }
.bbs-comment-write-textarea .bbs-comment-write-textarea-1 #c_text { width:100%; height:60px; font-size:.75rem; }
.bbs-comment-write-textarea .bbs-comment-write-textarea-2 #c_submit { width:60px; height:60px; }

/* comment delete form */
.comment_delete_div { display:none; position:absolute; z-index:2; top:0; left:0; background:#ffffff; width:100%; padding:20px 20px; font-size:.875rem; border:1px solid #aaaaaa; }
.comment_delete_div .c_del_text { margin:0 0 .375rem; }
.comment_delete_div .c_del_pw { width:5rem; }



/*************************************************
  Write
*************************************************/

.div-write dl { margin:0 0 .5rem 0; }
.div-write dl dt { margin:0; color:dodgerblue; }
.div-write dl dd { margin:0 0; }

.div-write input.bbs-input { width:100%; }
.div-write .select-wrap { max-width:75rem; width:100%; }
.div-write .select-wrap select.bbs-input { width:110%; }
.div-write textarea.bbs-input { width:100%; }


.div-write .fieldset-delete {}
.div-write .fieldset-delete .ui-controlgroup-controls { width:100%; }
.div-write .fieldset-delete .ui-controlgroup-controls .ui-checkbox { width:5rem; }
.div-write .fieldset-delete a.ui-btn { width:calc(100% - 5rem - 1.75rem); }


/*************************************************
  SKIN overwrite : Non Framework
*************************************************/


.list-wrap {}
.list-wrap > li { position:relative; border:1px solid #bbbbbb; padding:0; }
.list-wrap > li > a { display:block; padding:.625rem .25rem .5rem .375rem; margin:0; }
.list-wrap > li:not(:first-child) { border-top:0; }
.list-wrap > li:first-child { border-top-left-radius:.25rem; border-top-right-radius:.25rem; }
.list-wrap > li:last-child { border-bottom-left-radius:.25rem; border-bottom-right-radius:.25rem; }
.list-wrap > li::after { position:absolute; display:block; top:33%; right:.625rem; font-family:FontAwesome; content:"\f138"; color:#aaaaaa; font-size:1.5rem; z-index:1; }
.list-wrap > li h2 { font-size:1rem; font-weight:normal; width:calc(100% - 1.5rem); text-overflow:ellipsis; overflow:hidden; white-space:nowrap; margin:0 0 5px 0; }
.list-wrap > li p { padding:0 0 0 1.25rem; }
.list-wrap > li p span { font-size:.8125rem; color:#777777;  }
.list-wrap > li p span::after { content:'|'; margin:0 .375rem 0 .5rem; color:#aaaaaa; }
.list-wrap > li p span:last-child::after { content:''; }

.is-thread.is-thread-1 { padding-left:.25rem; }
.is-thread.is-thread-2 { padding-left:.5rem; }
.is-thread.is-thread-3 { padding-left:.75rem; }
.is-thread.is-thread-4 { padding-left:1rem; }
.is-thread.is-thread-5 { padding-left:1.25rem; }



