@charset "utf-8";

/*
.gallery li {width:24%; margin-left:1%; box-sizing:border-box; min-height:310px}
.gallery li:nth-child(4n+1) {margin-left:0}
*/

@media (max-width: 768px){

	/* 카테고리 */
	.category_tab {flex-wrap:wrap}
	.category_tab > a {width:50%; height:35px; border:1px solid #ddd; margin-left:0; margin-right:-1px; margin-bottom:-1px; flex-basis:unset; box-sizing:border-box}
	.category_tab > a.active {height:35px;font-size:14px; /*color:#f05a29;*/ border:1px solid #ccc;border-bottom:1px solid #fff;top:0;}
	.at_board .nav li {width:49.9%; box-sizing:border-box}
	.at_board .nav li > a {font-size:12px; padding:6px 7px;}

	/* 검색폼 */
	.at_board .search_box {float:none; width:100%; box-sizing:border-box; clear:both}

	/* 리스트 (일반) */
	.at_board .list {border-bottom:none}
	.at_board .list table th {display:none;}
	.at_board .list table th {padding:12px 0}
	.at_board .list table td a {vertical-align:baseline}
	.at_board .list table td {display:block; border:none; padding:5px; box-sizing:border-box; width:auto}
	.at_board .list table td.title {padding-left:10px; white-space:normal; height:auto}
	.at_board .list table td.num:before {content:"번호 :"; margin-right:5px}
	.at_board .list table td.readed_count:before {content:"조회 :"; margin-right:5px}
	.at_board .list table td.voted_count:before {content:"추천 :"; margin-right:5px}
	.at_board .list table td.blamed_count:before {content:"비추천 :"; margin-right:5px}
	.at_board .list table tbody tr {display:block; border-bottom:1px solid #ddd; padding:10px 0}
	.at_board .list table td:not(.title) {display:inline-block; font-size:12px; border-right:1px solid #ddd; height:12px; line-height:12px; padding:0 10px; color:#999}
	.at_board .list table td:not(.title) a {color:#999}
	.at_board .list table td.num,
	.at_board .list table td.notice {border-right:none; text-align:left}
	.at_board .list table td.check {padding-right:0}
	.at_board .list table td.name,
	.at_board .list table td.date,
	.at_board .list table td.cnt {display:inline-block; font-size:12px}
	.at_board .list table td:last-child,
	.at_board .list table td:first-child {border-right:none}
	.at_board .list table tbody tr:hover {border-left:none}
	.at_board .list table tbody tr:hover td {background:none}

	/* 리스트 (갤러리) */
	.gallery {margin-left:-10px}
	.gallery li {width: calc(50% - 10px); min-height:inherit; margin-left:10px; margin-bottom:10px}

/*	
	{width: 48%; margin-bottom:10px;padding:5px;box-sizing:border-box;margin-left:2%; padding-bottom:10px; min-height:260px}

.gallery {position:relative; margin-top:15px; font-size:0; margin-left:-20px}
.gallery li {display:inline-block; width: calc(25% - 20px); margin-left:20px; border:1px solid #d7d5d5; padding:10px; padding-bottom:20px; min-height:260px; vertical-align:top; margin-bottom:20px}
*/

	.gallery li p.subject {margin-top:10px;font-size:13px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden}	
	.gallery li div.img {width:100%; height:140px; overflow:hidden}
	.gallery li div img {width:100%; height:auto !important}
	.gallery li:nth-child(4n) {clear:none;}
	.gallery li:nth-child(2n+1) {clear:both;margin-left:0;}

	.etc li {width:48%; margin-bottom:10px;padding:5px;box-sizing:border-box;margin-left:2%; padding-bottom:10px; min-height:260px; margin-right:0}
	.etc li p.subject {margin-top:10px;font-size:13px;}	
	.etc li .btn a {width:120px}
	.etc li:nth-child(4n) {clear:none;}
	.etc li:nth-child(2n+1) {clear:both;margin-left:0;}

	/* 리스트 (웹진) */
	.webzine li {border-bottom:1px solid #ddd; padding:10px 0; position:relative; min-height:100px; padding-left:140px}
	.webzine li .tmb_wrp {position:absolute; top:10px; left:0; max-width:120px; width:120px; max-height:90px; height:auto; overflow:hidden; border:1px solid #ddd; box-sizing:border-box}
	/*.webzine li .tmb_wrp img {width:100%; height:auto !important}*/
	.webzine li p.title {font-size:13px; color:#333; margin-top:0; font-weight:normal; letter-spacing:normal}
	

	/* 댓글 */
	.at_board .view .comment_list .item.itemReply .indent {background-position:0 1em}
	.at_board .view .comment_list .item .item_aside {float:none; width:100%; clear:both; margin-right:0; padding-top:5px}
	.at_board .view .comment_list .item .item_aside ul:after {color:""; clear:both; display:block}
	.at_board .view .comment_list .item .item_aside li {float:left; margin-right:10px; margin-bottom:0; line-height:30px}
	.at_board .view .comment_list .item .item_content {clear:both; padding-left:0}
	.at_board .view .comment_list .item .item_aside .vote dt {margin-top:8px}
	.at_board .view .comment_write .author {margin-top:10px}
	.at_board .view .comment_write .author ul:after {content:""; clear:both; display:block}
	.at_board .view .comment_write .author li {float:none; margin-right:0; line-height:24px; margin-bottom:5px}
	.at_board .view .comment_write .author li:last-child {margin-right:0}
	.at_board .view .comment_write .author input,
	.at_board .view .comment_write .author a {width:100%; box-sizing:border-box}
	.at_board .view .comment_write .author .btn a {margin-left:0}
	.at_board .view .comment_write .author a {text-align:center; margin-left:0}
	.at_board .view .comment_write .author input[type="checkbox"] {width:auto}

	/* confirm */
	.at_board .confirm_section {overflow:none;}
	.at_board .confirm_section .input_area {padding:30px 10px 30px 10px;  margin:0 auto; text-align:center; width:95%; }
	.at_board .confirm_section .area_div {width:95%}
	.at_board .confirm_section .area_div .input_box {margin:0 auto; width:100%; box-sizing:border-box; }
	.at_board .confirm_section .button,
	.at_board .confirm_section .button a {float:none; height:45px; width:100%; font-weight:400; font-size:1.2em; }

	/* 글 쓰기 */
	.at_board .write_form table th {display:block; border-bottom:none; width:100%; padding:5px 0; background:none}
	.at_board .write_form table td {display:block; width:100%; padding:0; padding-bottom:15px}
	.at_board .guide_txt {line-height:20px; margin-top:5px; clear:both; margin-left:0}
	.at_board .write_form textarea,
	.at_board .write_form .inp_txt {width:100%; box-sizing:border-box; height:30px}

	/* 글 보기 */
	.at_board .view .mbr { display: block !important; }
	.at_board .view .sns {float:left; position:absolute; margin-top:67px !important; padding-top:10px;}
	.at_board .view table {display:block; max-width:100%; height:auto !important}
}

@media screen and (min-width:1200px){
	.gallery li div.img {width:100%; height:200px; overflow:hidden}
}