.usm-grade-search > input { width: 50%; }

.tch-cmnt-num {color:red;}

.num_comment { vertical-align: bottom; color: red; }

.usm-brd-lst th.tch-num {width:50px; }
.usm-brd-lst th.tch-tit {}
.usm-brd-lst th.tch-fle {width:30px}
.usm-brd-lst th.tch-nme {width:100px}
.usm-brd-lst th.tch-dte {width:70px}
.usm-brd-lst th.tch-cnt {width:50px}

.usm-brd-lst td.tch-num {text-align:center; }
.usm-brd-lst td.tch-tit {overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
.usm-brd-lst td.tch-fle {text-align:center;}
.usm-brd-lst td.tch-nme {text-align:center;}
.usm-brd-lst td.tch-dte {text-align:center;}
.usm-brd-lst td.tch-cnt {text-align:center;}

.usm-brd-lst td.tch-tit div {overflow:hidden;white-space:nowrap;text-overflow:ellipsis;text-align:left; }
//.usm-brd-lst td.tch-tit div {text-align:left; }
.usm-brd-lst td.tch-tit .tch-new {border:1px solid red;color:red; }
.usm-brd-lst td.tch-tit span.tch-rly { color: #225594; font-weight: bold; padding: 0 10px; }

.usm-brd-lst tr.tch-ann td:first-child {color:red; font-weight:bold; text-align:center;}
.usm-brd-lst tr.tch-ann td div {font-weight:bold;}

/* 답글 들여쓰기 */
span.tch-dpth-2 { margin-left:8px; }
span.tch-dpth-3 { margin-left:16px; }
span.tch-dpth-4 { margin-left:24px; }
span.tch-dpth-5 { margin-left:32px; }
span.tch-dpth-6 { margin-left:40px; }
span.tch-dpth-7 { margin-left:48px; }
span.tch-dpth-8 { margin-left:54px; }
span.tch-dpth-9 { margin-left:62px; }
span.tch-dpth-10 { margin-left:70px; }
span.tch-dpth-11 { margin-left:78px; }
span.tch-dpth-12 { margin-left:86px; }
span.tch-dpth-13 { margin-left:94px; }
span.tch-dpth-14 { margin-left:102px; }
span.tch-dpth-15 { margin-left:110px; }
span.tch-dpth-16 { margin-left:118px; }
span.tch-dpth-17 { margin-left:126px; }
span.tch-dpth-18 { margin-left:134px; }
span.tch-dpth-19 { margin-left:142px; }
span.tch-dpth-20 { margin-left:150px; }

.usm-brd-vew th.tch-tit {text-align:center;}
.usm-brd-vew th.tch-nme {width:10%; }
.usm-brd-vew th.tch-dte {width:10%}
.usm-brd-vew th.tch-cnt {width:10%}

.usm-brd-vew td.tch-nme {width:10%; }
.usm-brd-vew td.tch-dte {width:20%}
.usm-brd-vew td.tch-cnt {width:20%}
.usm-brd-vew td.tch-fil {text-align:left;}
.usm-brd-vew td.tch-fil p {background:url('../../../../images/link_icon.gif') no-repeat;padding-left:15px;margin-left:5px;line-height:160%;}

.usm-brd-vew th.tch-vew-prev {width:17%; }
.usm-brd-vew td.tch-vew-next { }

.usm-brd-vew td.tch-ctnt  img { max-width:100%; }

.usm-brd-wrt th.tch-tit {width:20%;}
.usm-brd-wrt th.tch-nme {width:20%}
.usm-brd-wrt th.tch-pwd {width:20%}
.usm-brd-wrt textarea { width:100%;height:400px; }

.usm-brd-wrt td {text-align:left; padding-left: 5px; width: 80%; }

.usm-brd-wrt td.tch-tit input[type="text"] {width:80%; }

.usm-brd-vew.usm-brd-vew-pn { border-width: 1px 0px 0px 0px; }

.usm-album-lst { overflow:hidden; margin: 20px 0 10px 0; border-top:2px solid #333333; }
.usm-album-lst ul li { width:100%; text-align:center; }
.usm-album-lst ul li article { display:inline-block; width: 100%; margin: 0 0 20px 0; }
.usm-album-lst ul li article:hover { border: 1px solid #008CBA; }
.usm-album-lst ul li article div.tch-thumbnail { line-height: 0; }
.usm-album-lst ul li article div.tch-thumbnail img { width:100%; height: auto; }
.usm-album-lst ul li article dl { text-align:center; border-top: 2px solid #333; border-right: 1px solid #d7d7d7; border-bottom: 1px solid #d7d7d7; border-left: 1px solid #d7d7d7; }
.usm-album-lst ul li article dl dt { padding: 7px 0; background-color:#F3F1F2; line-height:160%; display:block; border-bottom: 1px dashed #d7d7d7; }
.usm-album-lst ul li article dl dt a { font-weight:bold; }
.usm-album-lst ul li article dl dd.tch-info span { display: block; }
.usm-album-lst ul li article dl dd.tch-ctnt { display: none; }

table.usm-brd-vew-pn { border-top: 1px solid; margin: 15px 0; }
table.usm-brd-vew-pn th { background-color: #f7f7f7; width: 20%; border-bottom: 1px solid #e4e4e4; padding: 8px 0; }
table.usm-brd-vew-pn td { width: 80%; border-bottom: 1px solid #e4e4e4; padding: 8px 0; }

.usm-rly-tit { margin: 15px 0 5px 0; font-weight: bold; color: #143eb4; }
ul.usm-rly-vew { margin: 0 0 15px 0; }
ul.usm-rly-vew li { border-bottom:1px solid #E4E4E4; line-height: 250%; padding: 0 0 0 10px; }
ul.usm-rly-vew li a { padding: 5px 3px; }
ul.usm-rly-vew li:first-child { border-top:1px solid #444444; font-weight: bold; background-color:#F7F7F7; padding: 8px 0; }

.usm-cmt-totalcnt { font-weight:bold; color:#143EB4; }

.box-reply ul.usm-cmt-lst li { border-bottom:1px solid #E4E4E4;  }
.box-reply ul.usm-cmt-lst li > div { padding:5px 0;word-wrap:break-word;word-break:break-all; }
.box-reply ul.usm-cmt-lst li.reply { background: url('../../../../images/reply_icon.png') 12px 4px no-repeat; }
.box-reply ul.usm-cmt-lst li.reply div { padding: 5px 0 5px 27px; }
.box-reply ul.usm-cmt-lst li:first-child { border-top:1px solid #444444; }
.box-reply ul.usm-cmt-lst li:first-child div:first-child { background-color:#F7F7F7; padding:8px 0; }
.box-reply ul.usm-cmt-lst li div:first-child span.tname  { font-weight:bold; }

.box-reply ul.usm-cmt-lst li .cmt-head { position:relative; }
.box-reply ul.usm-cmt-lst li .cmt-head .btn-edit.usm-btn-wrap { position:absolute; right:0; top:0; }

.box-reply ul.usm-cmt-lst li.rct { padding-left:27px; }

/* 첨부파일 */

.usm-brd-vew td.tch-fil .file-con { margin: 0 0 5px 0; padding: 5px 5px 7px 5px; width: 98%; float: left; padding: 1%; }
.usm-brd-vew td.tch-fil .file-con:first-of-type { margin:  5px 0 5px 0; }
.usm-brd-vew td.tch-fil .file-con:last-of-type { margin: 0; }
.usm-brd-vew td.tch-fil .file-con:nth-child(odd) { background-color: #e7e7e7; }
.usm-brd-vew td.tch-fil .file-con .filename a:first-of-type:hover { color:#e60000; }
.usm-brd-vew td.tch-fil .file-con .file-btn { display: inline; float: left; }
.usm-brd-vew td.tch-fil .file-con .file-btn2 { clear: both; display: inline; float: right; }
.usm-brd-vew td.tch-fil .file-con .file-vol { vertical-align: bottom; }
.usm-brd-vew td.tch-fil .file-con .downwardsarrow { display: none; }

.box_name_area { padding: 0; }
.box_name_area div { margin: 0 0 3px 0; }
.box_name_area label {font-weight:bold; }
.box_name_area .usm-box-nme label { padding: 0 5px 0 0; }
.box_name_area .usm-box-pwd label { padding: 0 6px 0 0; }

.cmt_write  { width:100%; padding:5px 0 0 0; }
.cmt_update  { width:100%; padding:5px 0 0 0; display: table; }
.cmt_delete  { width:100%; display:inline-block; padding:5px 0 0 0; }

.box_txt_wrap { display: table; width: 100%;clear:both; }
.box_txt_area { display: table-cell; vertical-align: bottom; }
.box_btn_area { display: table-cell; width: 43px; padding: 0 0 0 5px; }
.box_btn_mod_area { display: table-cell; width: 86px; padding: 0 0 0 5px; }

.cmt_delete div.box_name_area {  float:left; margin-right:5px; }

/* 학부모 가입 */

.usm-grade-par-join { border-top: 1px solid #000; border-bottom: 1px solid #000; width: 96%; padding: 2%; text-align: center; line-height: 170%; }
.usm-grade-par-join input[type="submit"] { display: inline-block; border: 1px solid #003686; color: #003686; background-color: #fff; padding: 0 10px; height: 26px; line-height: 26px; margin: 2px 0 0 0; font-weight: bold; cursor: pointer;}
.usm-grade-par-join input[type="submit"]:hover { background-color: #003686; color: #fff; }
.usm-grade-par-join input[type="text"] { margin: 2px 0 0 0; }

.usm-grade-par-app { border-top: 1px solid #000; border-bottom: 1px solid #000; width: 96%; padding: 2%; text-align: center; line-height: 170%; }

/* 알림장 */
#content-area-ma { width: 100%; background:url('../../../admin/images/bg.gif') repeat; margin: 0; padding: 0; }
#content-area-ma .content-area-img { width: 100%; line-height: 0; padding: 30px 0 0 0; text-align: center; }
#content-area-ma .content-area-ma2 { width: 97%; margin: 0 1.5%; }
#content-area-ma .content-area-ma2 .usm-brd-vew, .usm-brd-wrt { margin: 0; border: none; }
#content-area-ma .content-area-ma2 .usm-brd-vew th { background-color: #45a298; color: #fff; }
#content-area-ma .content-area-ma2 .usm-brd-vew, .usm-brd-wrt td { background-color: #fff; }
#content-area-ma .content-area-ma2 .usm-brd-wrt tr:nth-child(1) th { background-color: #45a298; color: #fff; }
#content-area-ma .content-area-ma2 .usm-brd-wrt tr:nth-child(1) td { background-color: #45a298; }
#content-area-ma .content-area-ma2 .usm-brd-wrt tr:nth-child(1) td input[type="text"] { height: 27px; line-height: 27px; }
#content-area-ma .content-area-ma2 .usm-brd-wrt tr:nth-child(1) td input[type="checkbox"] { margin: 0 2px 0 5px; }
#content-area-ma .content-area-ma2 .usm-brd-wrt tr:nth-child(1) td label { color: #fff; }

@media all and (max-width: 1023px) {
	
#usm-grade { position: relative; }

#usm-grade-profile-id { display: none; }

.usm-mobile-menu { left: 0; top: 0; width: 100%; height: 80px; transition: top .5s ease-out; background-color: #feb813; }
#usm-grade-left-id .usm-grade-menu li.line { display: none; }

.usm-spinner-master input[type=checkbox] { display: none; }

.usm-spinner-master * { transition: all 0.3s; box-sizing: border-box; }
.usm-spinner-master { position: relative; margin: 20px 15px 15px 15px; height: 30px; width: 30px; float: right; }
.usm-spinner-master label { cursor: pointer; position: absolute; z-index: 99; height: 100%; width: 100%; top: 11px; left: 0; }
.usm-spinner-master .spinner { position: absolute; height: 4px; width: 100%; padding: 0; background-color: #ffffff; }
.usm-spinner-master .diagonal.part-1 { position: relative; float: left; }
.usm-spinner-master .horizontal { position: relative; float: left; margin-top: 4px; }
.usm-spinner-master .diagonal.part-2 { position: relative; float: left; margin-top: 4px; }
.usm-spinner-master input[type=checkbox]:checked ~ .spinner-spin > .horizontal { opacity: 0; }
.usm-spinner-master input[type=checkbox]:checked ~ .spinner-spin > .diagonal.part-1 { transform: rotate(135deg); -webkit-transform: rotate(135deg); margin-top: 10px; }
.usm-spinner-master input[type=checkbox]:checked ~ .spinner-spin > .diagonal.part-2 { transform: rotate(-135deg); -webkit-transform: rotate(-135deg); margin-top: -12px; }

/* Common Menu Start */

nav { clear: both; }
nav > ul li a { line-height: 250%; font-size: 16px; margin: 0; padding: 0; list-style: none; border: none; text-decoration: none; position: relative; display: block; }

/* Common Menu End */

/* First Menu Start*/

nav > ul { display: none; }
nav > ul.active { display: block; }
nav > ul > li { background-color: #e7e7e7; border-bottom: 1px solid #777777; }
nav > ul > li:first-of-type { border-top: 2px solid #777777; }
nav > ul > li > a { padding: 0 0 0 20px; color: #000; }
nav > ul > li > a.active { background-color: #0FAE16; color: #94FF95; font-weight: bold; }

/* First Menu End */

#content-area { width: 98%; padding: 0 1%; }
#content-area h2.usm-grade-menu-tit { font-size: 16px; padding: 15px 0 5px 0; background-color: #ffffff; }

.usm-grade-search > input { width: 50%; }

#userForm .usm-grade-search { background-color: #F4F4F4; height: 38px; padding: 7px 0 0 10px; }

.usm-brd-lst { margin: 0; width: 100%;  }
.usm-brd-lst th { background-color: #fff; }
.usm-brd-lst td { background-color: #fff; }
.usm-brd-lst .tch-fle { display: none; }
.usm-brd-lst .tch-nme { display: none; }
.usm-brd-lst .tch-cnt { display: none; }

.usm-tot-wrap { margin: 5px 0 0 0; }
.usm-btn-wrap { margin: 5px 0 0 0; }

footer { clear: both; width: 100%; background-color: #feb813; margin: 0 0 0 0; text-align:center; }
footer .usm-grade-copyright {  padding: 7px 0; color: #fff; font-size: 14px; }

}

/* 테블릿 */
@media (min-width:768px) and (max-width:1023px){
.usm-album-lst { border-top: none; }
.usm-album-lst ul li { float: left; width:31.5%; margin: 0 0.9% 10px 0.9%;}
.usm-album-lst ul li article { display:inline-block; border:1px solid #C2BEBF; }

.usm-album-lst ul li article div.tch-thumbnail img { height: 130px; }
.usm-album-lst ul li article dl { border-left: none; border-bottom: none; border-right: none; }
.usm-album-lst ul li article dl dt { overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }

/* 학부모 가입 */

.usm-grade-par-join { border-top: 1px solid #000; border-bottom: 1px solid #000; width: 73%; min-height: 205px; background:url('../../../admin/images/welcome.png') 5% center no-repeat; padding: 2% 2% 2% 25%; text-align: center; }
.usm-grade-par-join p:first-child { margin: 50px 0 0 0; font-size: 16px; }
.usm-grade-par-join form { background-color: #f4f4f4; padding: 2% 0; }

.usm-grade-par-app { border-top: 1px solid #000; border-bottom: 1px solid #000; width: 73%; min-height: 205px; background:url('../../../admin/images/delay.png') 5% center no-repeat; padding: 2% 2% 2% 25%; text-align: center; }
.usm-grade-par-app p:first-child { margin: 70px 0 0 0; }

}

@media all and (min-width:1024px){
	.usm-mobile-menu { display: none; }
	#usm-grade-top-id { display: block; }
	#usm-grade-left-id { display: block; position: absolute; top: 410px; left: 0px; }
	.usm-grade-menu { display: block; }

	#usm-grade-left-id .usm-grade-menu { width: 205px; padding: 0 10px; }
	#usm-grade-left-id .usm-grade-menu li { clear: both; font-size: 16px; line-height: 180%; color: #333333; }
	#usm-grade-left-id .usm-grade-menu .usm-grade-menu-group { font-size: 15px; font-weight: bold; }
	#usm-grade-left-id .usm-grade-menu li.line { height: 2px; margin: 3px 0 0 0; border-top: 1px dashed #333; }

	#content-area { float: left; width: 960px; min-height: 250px; margin: 0px 0 0 240px; padding: 15px 0 0 0; }

	#content-area-ma .content-area-ma2 { width: 90%; margin: 0 auto -600px auto; }
	
	#content-area h2.usm-grade-menu-tit { margin: 0 0 15px 0; padding: 0 0 15px 0; font-size: 20px; color: #333333; border-bottom: 1px solid #333333; }
	
	.usm-paging-wrap { margin: 0 0 30px 0; }

	.usm-brd-vew td.tch-fil .file-con .downwardsarrow { display: inline; }
	.usm-brd-vew td.tch-fil .file-con .file-btn2 { clear: none; }

	.usm-album-lst { border-top: none; }
	.usm-album-lst ul li { float: left; width:23%; margin: 0 0.9% 10px 1%;}
	.usm-album-lst ul li article { display:inline-block; border:1px solid #C2BEBF; }

	.usm-album-lst ul li article div.tch-thumbnail img { height: 130px; }
	.usm-album-lst ul li article dl { border-left: none; border-bottom: none; border-right: none; }
	.usm-album-lst ul li article dl dt { overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }

	/* 학부모 가입 */
	
	.usm-grade-par-join { margin: 50px auto 0 auto; width: 700px; min-height: 205px; padding: 2% 2% 2% 200px; border-top: 1px solid #000; border-bottom: 1px solid #000; background:url('../../../admin/images/welcome.png') left center no-repeat; text-align: left; }
	.usm-grade-par-join p { font-size: 16px; line-height: 180%; }
	.usm-grade-par-join p:first-child { margin: 40px 0 0 0; font-size: 20px; }
	.usm-grade-par-join form { background-color: #f4f4f4; padding: 2% 0; text-align: center; }

	.usm-grade-par-app { margin: 50px auto 0 auto; width: 700px; min-height: 205px; padding: 2% 2% 2% 200px; border-top: 1px solid #000; border-bottom: 1px solid #000; background:url('../../../admin/images/delay.png') left center no-repeat; text-align: center; }
	.usm-grade-par-app p { font-size: 16px; }
	.usm-grade-par-app p:first-child { margin: 70px 0 0 0; }

}