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

.total{text-align:right; padding:5px; color:#666; font-size:0.8em;}
.table_wrap{width:100%; border-top:2px solid #053583; border-bottom:1px solid #555; color:#555; overflow:hidden;}
.row{width:100%;}
.mobile{display:none;}
.no{text-align:center;}
a{color:#555;}

/* footer */
/* .search{padding:10px 0; width:100%; overflow:hidden;}
.search_wrap{width:50%; float:left; box-sizing:border-box;}
.search_wrap select{padding:4px 15px 4px 5px; border:1px solid #ccc; color:#666; -webkit-appearance: none; -moz-appearance: none; border-radius:1px; appearance: none; background:url('../images/select_down.png')95% 50% no-repeat;}
.search_wrap select::-ms-expand {display: none;화살표 없애기 for IE10, 11}
.search_wrap form{display:inline; margin:0 5px;}
.search_wrap input{width:200px; height:25px; border:1px solid #ccc; border-radius:1px;}
.search_wrap_right{width:50%; float:left; box-sizing:border-box;}
.search_wrap_right .button{float:right;} */
.m_button{display:none;}

/************************search-wrap****************************/
select::-ms-expand {display: none;}
select:focus::-ms-value {background-color: white; color:#555;}
select:focus {outline: none;}
select{width:100%; height:auto; line-height:normal; font-family:inherit; padding:5px 0 5px 10px; border:0; /* opacity:0; filter:alpha(opacity=0);  */-webkit-appearance: none;  /* 네이티브 외형 감추기 */ -moz-appearance: none; appearance: none; box-sizing:border-box; color:#555; font-size:13px;}

.search{width:100%; margin:20px 0; overflow:hidden;}
.search-wrap{display:inline-block; width:100%; max-width:300px;}
.search-box{float:left; width:25%; margin-right:5px; position:relative;}
.select-search{height:30px; width:100%; margin-right:5px; padding:5px; color:#555; border:1px solid #888; font-size:12px; }
.search-box:before{content:""; position:absolute; top:50%; right:10px; width:0; height:0; margin-top:-1px; border-left:5px solid transparent; border-right:5px solid transparent; border-top:5px solid #999;}

.search-wrap .search-bar{float:left; display:inline-block; width:70%; height:30px; border:1px solid #888; background:#fff; box-sizing:border-box; overflow:hidden;}
.search-wrap .search-bar input{font-size:13px; width:60%; height:100%; min-width:100px; max-width:235px; box-sizing:border-box; border:0; outline:none; float:left; padding-left:10px; color:#555; font-family:"Noto Sans KR", sans-serif;}
.search-wrap .btn-search{height:100%; border:0; background:#555; outline:none; float:right; color:#fff;/*  line-height:26px; */ cursor:pointer; font-size:12px; padding:0 25px; box-sizing:border-box; margin:0; border-radius:0;}



.page	{float:left; width:100%; text-align:center; margin:0 auto;}
/* .page_wrap ul{width:340px; margin:0 auto; overflow:hidden;} */
/* .page_wrap ul li{border:1px solid #ccc; float:left; text-align:center; margin-left:5px;} */
.page ul{padding-left:0}
.page ul li{border:1px solid #ccc; display:inline-block; color:#666; font:0.8em "arial"; padding:6px 10px; margin-right:2px;}
.page ul li:first-child{border-radius:5px 0 0 5px;}
.page ul li:last-child{border-radius:0 5px 5px 0;}
/* .page_wrap ul li .arrow{padding:6px 11px; letter-spacing:1px;}  */
.page ul li:hover{background:#013469; color:#fff; cursor:pointer;}
.page ul li a{display:block;}
.page ul li:hover a{color:#fff;}
.page .active{background:#013469; color:#fff;}

/*********************** list *********************/
#list {padding-bottom:50px;}
#list .list_table{width:100%; text-align:center;}
#list .list_table tr:first-child th{border-bottom:1px solid #999;}
#list .list_table tr:nth-child(2){font-weight:600;}
/* #list .list_table tr:nth-child(11) td{border:0;} 
#list .list_table tr~tr:hover{background:#eee;}*/
#list .list_table tr th{padding:7px 10px; border-bottom:1px solid #ccc; line-height:26px; font-size:14px;}
#list .list_table tr td{padding:7px 10px; border-bottom:1px solid #ccc; line-height:26px; font-size:14px; font-weight:400;}
#list .list_table tr:last-child td{border-bottom:0;}
#list .list_table th:nth-child(2){width:50%;}
#list .list_table td p{display:none;}
#list .list_table td span{font-size:0.8em; color:#ff2200; font-weight:600; padding:0 5px 0 0;}
#list .list_table td:nth-child(2){text-align:left;}
#list .list_table .mobile-left{display:none;}
#list .no-list{min-height:300px; line-height:300px; width:100% !important;}
/* #list .list_table tr:not(.no-list):hover{border: 1px solid red; }  */

.file-down i{font-size:18px;}
.file-down:hover{color:#ea5918;}
/*********************** blog *********************/

#blog .blog_table{width:100%; border-bottom:1px solid #ccc; color:#555; padding-bottom:10px;}
#blog .blog_table:last-child{border-bottom:0;}
/* #blog .blog_table:hover{background:#eee; cursor:pointer;} */
#blog .blog_table th > span{padding:0 5px; border:1px solid #999; display:inline-block; text-align:center; line-height:25px; font-size:0.8em; margin-right:5px;}
#blog .blog_table th{font-size:1.2em; text-align:left; padding:10px 5px 0; border-bottom:0;}
#blog .blog_table td{color:#555; text-align:left; padding:10px 5px 0; border-bottom:0;}
#blog .blog_table td p{float:left; padding-right:20px;}
#blog .blog_table tr:nth-child(3n) td{font-size:0.8em;}

/*********************** gallery *********************/
/* #gallery {padding:50px 0;} */
#gallery .table_wrap{padding-bottom:10px;}
#gallery .col-4{width:33.3%; float:left; box-sizing:border-box;}
#gallery .gallery_wrap{border-bottom:1px solid #ccc; padding:5px 0 25px 0; margin:10px;}
#gallery .gallery_wrap .gallery_img{width:100%; padding-top:60%; border:1px solid #333;}
#gallery .gallery_wrap h3{font-size:1.2em; color:#555; font-weight:500; margin:10px 0;}
#gallery .gallery_wrap p{font-size:0.8em; color:#666; margin:0;}
#gallery .gallery_wrap p:nth-of-type(2){float:left;}
#gallery .gallery_wrap p:last-child{float:right;}
/* #gallery .gallery_wrap:hover{cursor:pointer; background:#eee;} */
#gallery .no{height:300px; line-height:300px; font-size:0.8em;font-weight:600}

/*********************** webzine *********************/
#webzine .table_wrap{float:left; box-sizing:border-box; margin-bottom:10px;}
#webzine .table_wrap .row{width:100%; padding:10px 0; float:left; box-sizing:border-box; border-bottom:1px solid #ccc;}
#webzine .table_wrap .row:last-child{border:0;}
/* #webzine .table_wrap .row:hover{background:#eee; cursor:pointer;} */
#webzine .table_wrap .row .col-3{width:25%; display:inline-block; float:left; padding:5px; box-sizing:border-box;}
#webzine .table_wrap .row .col-3 .webzine_img{width:100%; padding-top:60%; border:1px solid #666;}
#webzine .table_wrap .row .col-9{width:75%; display:inline-block; padding:5px; box-sizing:border-box;}
#webzine .table_wrap .row .right{padding:0 10px;}
#webzine .table_wrap .row .right h3{font-size:1.2em; color:#555; /* padding:10px 0 0; */ margin:0; font-weight:500;}
#webzine .table_wrap .row .right h3 span{padding:0 5px; border:1px solid #999; display:inline-block; text-align:center; line-height:25px; font-size:0.8em; margin-right:5px;}
#webzine .table_wrap .row .right p:nth-of-type(4){font-size:0.9em;}
#webzine .table_wrap .row .right p{font-size:0.8em; float:left; padding-right:20px;}
#webzine .no-list{min-height:300px; line-height:300px; width:100% !important; font-size:14px; text-align:center;}
#webzine .w-list-contents{margin:15px 0; overflow:hidden;}
#webzine .w-list-info p{color:#888;}

/*********************** view *********************/
#view {padding:50px 0;}
#view p{margin:0; font-size:13px; color:#666; line-height:26px;}
#view .table_wrap .title{padding:0 10px; border-bottom:1px solid #ccc;}
#view .table_wrap .title h3{font-size:1em; margin:10px;}
#view .table_wrap .title span{font-size:0.8em; padding-right:5px;}
#view .table_wrap .info{padding:0 10px; border-bottom:1px solid #666; overflow:hidden;}
#view .table_wrap .info p{font-size:0.8em; float:left; padding-right:20px;}
#view .table_wrap .fileinfo{padding:0 10px; border:1px solid #ccc; overflow:hidden;}
#view .table_wrap .fileinfo p{font-size:0.8em; float:left; padding-right:20px;}
#view .text{width:100%; padding:20px 10px 50px 10px; min-height:500px; box-sizing:border-box; overflow:hidden;}
#view .text img{width:100%; display:block;}
#view .button{margin:0 5px 10px;}

#view .view_list{width:100%; border-top:1px solid #555; border-bottom:1px solid #555; overflow:hidden; color:#666;}
#view .view_list a{color:#666; font-size:13px;}
#view .view_list p{line-height:40px;}
#view .view_list .next{border-bottom:1px solid #ccc; padding:0 10px; overflow:hidden;}
#view .view_list .pre{padding:0 10px; overflow:hidden;}
/* #view .view_list .next:hover, .pre:hover{background:#eee; cursor:pointer;} */
#view .view_list .left{width:10%; float:left; box-sizing:border-box; border-right:1px solid #ccc;  text-align:center;}
#view .view_list .left img{margin:0 5px 5px;}
#view .view_list .right{width:90%; float:left; box-sizing:border-box; line-height:38px; padding:0 10px;}
#view .view_list .right span{font-size:0.8em; padding-right:5px;}
#view .view_list .right span:last-child{float:right;}

/*********************** write *********************/

#write .write_table{width:100%;}
#write .write_table th{padding:10px; text-align:left; border-bottom:1px solid #999; width:10%; border-right:1px solid #ccc; padding-left:15px; border-left:1px solid #666;}
#write .write_table td{padding:10px; text-align:left; border-bottom:1px solid #999;}
#write .write_table tr:last-child th{border-bottom:0;}
#write .write_table tr:last-child td{border-bottom:0;}
#write input{width:100%; padding:5px 10px; box-sizing:border-box;}
#write textarea{width:100%; height:500px; padding:5px 10px; box-sizing:border-box;}
#write .mobile_write{display:none;}

@media all and (max-width:768px){
	.total{display:none;}	
	table th, td{padding:15px 5px;}
	/* .hidden-xs{display:none;} */
	
	
	/* list */
	#list .list_table th{display:none;}
	#list .list_table,
	#list .list_table thead,
	#list .list_table tbody,
	#list .list_table tr,
	#list .list_table td{display:block;}
	
	#list .list_table tr{width:100%; overflow:hidden; border-bottom:1px solid #ccc;}
	#list .list_table th{border:none;}
	#list .list_table td{border:none; float:left;}
	#list .list_table td:nth-child(1){width:10%; box-sizing:border-box; font-size:1em; padding:10px 0 0 0;}
	#list .list_table td:nth-child(2){width:90%; box-sizing:border-box; font-size:1em; padding:10px 0 0 0;}
	#list .list_table td:nth-child(3){padding-left:10%;}
	#list .list_table tr td{font-size:0.8em; padding-right:5%; border-bottom:0;}
	
	/* blog */
	#blog .blog_table th{padding:5px 0 0; text-align:left;}
	#blog .blog_table td{padding:5px 0 0; text-align:left;}
	#blog .blog_table td p span{display:none;}
	
	/* gallery */
	#gallery .col-12{width:100%; padding:0; border-bottom:1px solid #ccc;}
	#gallery .gallery_wrap{border-bottom:0; padding:10px 0 25px; margin:0;}
	#gallery .gallery_wrap h3{padding:0;}
	#gallery .gallery_wrap p{float:left; padding-right:5%;}
	#gallery .gallery_wrap p:last-child{float:left;}
	#gallery .gallery_wrap p span{display:none;}
	
	/* webzine*/
	#webzine .table_wrap{margin-bottom:0;}
	#webzine .table_wrap .row .col-12{width:100%; padding:0;}
	#webzine .table_wrap .row .right{padding:15px 5px 5px 10px !important;}
	#webzine .row .right p span{display:none;}
	#webzine .row .mobile{padding-top:10px;}

	/* view */
	#view .table_wrap .info > p  span{display:none;}
	#view .view_list .col-1{width:8.3%; float:left; box-sizing:border-box;}
	#view .view_list .col-11{width:91.6%; float:left; box-sizing:border-box;}
	#view .view_list .left{display:none;}
	#view .view_list .left p{font-size:0.5em;}
	#view .view_list .right span:last-child{display:none;}
	#view .button{margin:5px;}

	/* write */
	#write .write_table,
	#write .write_table thead,
	#write .write_table tbody,
	#write .write_table tr,
	#write .write_table th,
	#write .write_table td{
		display:block;	
	}
	
	#write .write_table tr{border-bottom:1px solid #999;}
	#write .write_table th,
	#write .write_table td{border:none;}
	
	.mobile{display:block;}
	.mobile ul li{float:left; font-size:0.8em; color:#666; padding-right:20px}
	.mobile ul li:nth-child(2n){color:#ccc;}
	.mobile ul li:last-child{margin-top:-2px;}
	.mobile span{padding:0 10px; color:#ccc;}
	
	.search{float:left;}
	.search_wrap select{padding:4px 5px; font-size:0.8em;}
	.search_wrap input{width:30%;}
	
	/*
	.search_wrap .w_button{display:none;}
	.m_button{display:block; width:100px; margin:10px auto;}
	*/
	
	
}

@media all and (max-width:525px){
	.search_wrap{width:100%;}
}