@charset "utf-8";


/** Notice Box **/
.board-notice	{ max-width: 430px; padding: 20px; margin: 20px auto 30px; text-align: center;}
#page_board_content {padding:20px 0;}
#page_board_content .theme-box {padding:5px 10px;margin-bottom:4px;border-radius:5px;}
#page_board_content .ui-top {padding:5px; box-sizing:border-box;}
#page_board_content .ui-btn {border-radius:2px;}

/* 목록 */
.wrap_content {max-width:500px;margin:0 auto;}

.frdates ul {padding:20px 0;text-align:center;}
.frdates ul li {display:inline-block;padding:2px 0;}
#page_board_content .frdates ul .ui-btn {padding:0 4px; height:20px;line-height:18px;font-size:11px;border-radius:6px;}
#page_board_content .frdates ul .ui-btn.point {width:40px;height:40px;line-height:38px;border-radius:100%;}
#page_board_content .frdates ul .ui-btn.today{font-weight:bold;}

.ui-memo-list					{ position: relative; clear: both; }
.ui-memo-list li				{ position: relative; } 
.ui-memo-list li.no-data		{ text-align: center; line-height: 50px; }
.ui-memo-list li.over			{ opacity:0.7;filter:saturate(0); }

#page_board_content .sortable, #page_board_content .mod .unsortable, #page_board_content .mod .done .sortable {display:none;}
#page_board_content .mod .sortable, #page_board_content .unsortable  {display:inline-block;}
#page_board_content .mod .done {opacity:0.6;} 
.ui-sortable-handle {cursor:pointer;}

.content-area {position:relative;display:grid;grid-template-columns: 16px 1fr auto 30px;line-height:20px;}
.content-area .mng {position:relative;}
.content-area .btn-ctrl{display:inline-block;margin-bottom:1px;width:15px;text-align:center;font-family:'dotum',sans-serif;}
.content-area .chk_id {margin-bottom:1px;width:12px;height:12px;line-height:10px;border-radius:2px;text-align:center;vertical-align: middle;}
li:not(.done) .content-area .chk_id {background:none;}
.over .content-area .chk_id {cursor:default;}
.content-area .tdate { display:inline-block;vertical-align:middle;padding:0 5px;text-align:center; opacity:0.7;}
.content-area .con {padding:0 5px; word-break:break-all;}

.done .content-area:after{content:"";display:block;position:absolute;top:50%;left:20px;right:34px;height:1px;border-top:1px solid;}
.done .content-area .con {opacity:0.7;}
.done .content-area .tdate {opacity:0.5;}
.done .content-area .chk_id::after {content:"★";display:block;font-size:10px;font-family:'dotum',sans-serif;}
.content-area .control {font-size:12px;}

.ui-memo-list .write_open.secret.ui-btn {margin:2px 5px; height:20px;line-height:18px;padding:0 8px;}
.ui-memo-list li .pass_in{display:inline-block;vertical-align:middle;width:0;white-space:nowrap;overflow:hidden;}
.ui-memo-list li .pass_in input{border:0 none;background:none;width:100px;}
.ui-memo-list li .pass_in button {padding:0 5px;width:50px;height:20px;line-height:18px;margin:2px;}
.ui-memo-list li .pass_in.on {width:160px;}

.fx-control {margin:5px 0;display:flex;flex-wrap:wrap;justify-content:space-between;}


/* 글쓰기 폼 */
.ui-write-box				{ position:relative;padding-left:24px; padding-right:0; min-height:24px; box-sizing:border-box; } 
.ui-write-box .write-cont   { position:relative; display:none;overflow:hidden; box-sizing:border-box;}
.ui-write-box.update .write-cont, .ui-write-box .write-cont.on {
	display:grid;
	grid-template-areas: 'type color''content content';
}
.ui-write-box:not(.update) .write-cont.on {padding-left:4px;}
.ui-write-box.update {max-width:500px;padding:0;margin:30px auto;}

.ui-write-box .options {margin-top:2px;padding-right:60px;min-height:24px;position:relative;}
.ui-write-box .options .txt-right {position:absolute;right:0;bottom:0;}

#page_board_content .ui-write-box input,#page_board_content .ui-write-box button {height:24px;line-height:22px;}
.ui-write-box .write_open.ui-btn.point	{position:absolute;left:0;top:0;display:inline-block;width:24px;padding:0;margin:0;}
.ui-write-box .ui-btn {height:24px;line-height:21px;}

.ui-write-box .color-select {margin:1px 0 3px;grid-area:color;text-align:right;}
.ui-write-box .type-select {grid-area:type;}
.ui-write-box .content-box {grid-area:content;}

.type-select p {margin-bottom:2px;}
.action-type input:not(input[type='text']) {display:none;}
.ck-label {display:inline-block;border-radius:4px;min-width:24px;white-space: nowrap;text-align:center;}
.color-select .ck-label { padding:1px 0px 2px 4px; }
.ui-write-box .type-select .ck-label { padding:0 3px;}
.type-select .wr_type_label {width:50px;}
.ck-label.point::before{content:"·";font-family:'arial black',sans-serif;}


.ui-write-box.update .write_open.ui-btn.point {display:none;}


@media all and (max-width:380px) {
	.ui-write-box.update .write-cont, .ui-write-box .write-cont.on {grid-template-areas: 'color color''type type''content content';}
	.ui-write-box .color-select {text-align:left;}
	.ui-write-box .options.guest {padding-right:0;}
	.ui-write-box .options.guest .txt-right {position:relative;}
	#wr_name,#wr_password		{width:100%;}
	.frdates ul li.day-r {display:none;}
	.content-area {
		grid-template-areas: 
		'ck con con con'
		'date date date ctrl';
	}
	.content-area .mng {grid-area: ck;}
	.content-area .con {grid-area: con;}
	.content-area .tdate{grid-area: date;text-align:right;}
	.content-area .control{grid-area: ctrl;}
}

/*표시색상*/ 
.color_1{background:#ff9900;border: 1px solid #ff9900;}
.color_2{background:#7b68ee;border: 1px solid #7b68ee;}
.color_3{background:#20b2aa;border: 1px solid #20b2aa;}
.color_4{background:#c70039;border: 1px solid #c70039;}

.color-select .color_1 .ico::before{content:"1";}
.color-select .color_2 .ico::before{content:"2";}
.color-select .color_3 .ico::before{content:"3";} 
.color-select .color_4 .ico::before{content:"4";}   