@charset "UTF-8";

@media screen and (max-width: 768px) {
	input[type=text], input[type=password], textarea{font-size:16px}
	input[type=text], input[type=password], select, textarea{padding-top:5px;padding-bottom:5px}
	.btn_s{font-size:12px}

	/* header
	---------------------------------------*/
	header{width:100%}
	/*#logo{
		width:calc(100% - 230px);
		max-width:320px;
	}*/
	#logo img{width:100%}
	.topinfo{width:98%;width:calc(100% - 14px)}
	
	/* main
	---------------------------------------*/
	.listdiv{width:100%}
	
	/* left
	---------------------------------------*/
	.leftdiv{width:100%}
	.loginbox{width:97%;width:calc(100% - 22px)}
	.loginbox input[type=submit]{padding:8px 0}
	
	.leftsubdiv{
		width:30%;width:calc((100% / 3) - 3px);
		height:70px;
		padding-bottom:0;
	}
	.leftsubdiv img{max-width:100%}
	.fixed_link{
		width:100%;
		margin-bottom:0;
	}
	.seal{
		width:100%;
		margin-top:10px;
	}
	
	/* center
	---------------------------------------*/
	.centerdiv{
		width:100%;
		min-height:0;
	}
	.listco{display:none}
	
	.listtop, listtop tr{
		width:100%;
		margin:0;
	}
	.listtop_left{width:auto}
	.listtop_left .txtS{display:block}
	.listtop_left select{width:90%;width:calc(100% - 60px)}
	.listtop_right{width:100px;vertical-align:bottom}
	
	.listsubtitle, .listdt{
		width:100%;
		padding:5px 0;
	}
	.listdt_date{width:125px;line-height:1.5em}
	.listdt .listdt_groupname, .listdt .listdt_title{float:right;width:90%;width:calc(100% - 135px);line-height:1.3em;word-break:break-all}
	.listdt_rightbox{float:right;width:calc(100% - 135px)}
	.listdt_name, .listdt .listdt_name{padding-left:0;white-space:nowrap}
	.listdt_state{width:60px}
	.listdt_count{width:30px}
	.listdt .listdt_groupname, .listdt .listdt_name, .listdt .listdt_state, .listdt .listdt_count{padding-top:5px}
	
	.listdetailtitle{position:relative}
	.listdetail_btn{
		position:absolute;
		top:5px;
		right:5px;
		width:20px;
	}
	.listdetail_topname{width:5em}
	
	/* add */
	#comment_table tr{
		display:block;
	}
	#comment_table th,
	#comment_table td{
		display:list-item;
		border:none;
		width:90%;
		width:calc(100% - 10px);
		height:auto;
		padding:5px;
	}
	.list_addvalue2{width:90%;width:calc(100% - 80px)}
	
	/* comment_add */
	.listdetailtop{
		width:98%;
		width:calc(100% - 2px);
	}
	/* search */
	.listdtsearch{position:relative}
	#search_oc{display:block}
	#search_table{
		display:block;
		width:100%;
		overflow:hidden;
		height:0;
	}
	#search_table.open{
		height:auto;
		background:#f0f0f0;
	}
	#search_table tbody,
	#search_table tr{
		display:block;
	}
	#search_table th,
	#search_table td{
		display:list-item;
		border:none;
		width:98%;
		width:calc(100% - 10px);
		height:auto;
		padding:5px;
		text-align:left;
		margin:0;
		list-style:none;
	}
	#search_table #user_name,
	#search_table #user_position,
	#search_table #keyword,
	#search_table select{
		width:98%;
		width:calc(100% - 2px);
	}
	#search_table #from_date,
	#search_table #to_date{width:40%}
	#search_table select{padding:4px 0}
	
	#searchtitle{display:none}
	#search_table.open+#close_btn{
		display:block;
		width:20px;
		height:20px;
		position:absolute;
		top:5px;
		right:5px;
		border:1px #65cfbe solid;
		background:#f0f0f0;
		color:#000;
		font-size:14px;
		text-align:center;
		line-height:20px;
		cursor:pointer;
	}
	
	
	
	/* pop */
	#userpop,
	#keywordpop{
		left:0;
		top:60px;
	}
}