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

.topictab {	
	justify-content: center;
    width: 100%;
    margin: 0;
    padding: 0;
}

.topictab:after {
    content: "";
    display: table;
    clear: both;
}

.topicmain {
    width: auto;
    text-align: left;
    margin: 0;
    padding: 0;
	display:flex;
	flex-direction: row;
	text-align: left;
}


.menuleft{
	width:1fr;
	display:none;
}
.menuleft a{
	text-decoration: none;
	//font-weight: bold;
	font-size:15px;
	color: #eeeeee;
	display: block;
	background-color: #176b87;
	padding: 5px;
	border-bottom: #efefef thin solid;
}

.menuleft a:hover{
	background-color:white;	
	color: #176b87;
	//font-weight: bold;
}
.bodyright{
	width:1fr;

}
.bodyrightmain{
	text-align:left;	
	border-left:#efefef thin solid;
	padding:1px;
}
.bodyrighthead{
	font-weight: bold;
	margin:4px 10px;
	font-size:16px;	
}
.date{
	background-color:#176b87;
	color:white;
	font-size:10px;
	padding:2px 7px;
	margin:0px 5px;
	border-radius:8px;	
}

.bodyrighttext{
	word-break:break-all;
	margin: 6px 10px 6px 10px;
	//padding:0px 3px;
}
.bodyrighttext a{
	color: #176b87;
	text-decoration: none;
}
.bodyrighttext a:hover{
	color: #053b50;
	text-decoration: none;
}

.btn{
	padding:2px 4px;
	
	color:white;
	border: hidden;
	border-radius:3px;
	margin:3px 2px;
}
.btn2{
	padding:5px 10px;
	
	color:white;
	border: hidden;
	border-radius:3px;
	margin:3px 2px;
}
.add{background-color:#060;}
.edit{background-color: #C90 }
.delete{background-color: #900}
.save{ background-color: #176b87; border-radius:5px; color:white; height:50px; width:100px; border:thin;}
.w100{	width:100%;}

select{
    width:50%;
}

option{
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

@media (min-width: 600px) {
.menuleft{
	width:200px;
	display: flex;
	flex-direction: column;
}
.bodyright{
	flex:1;

}
@media (min-width: 900px) {
.menuleft{
	width:300px;
	display: flex;
	flex-direction: column;
}
.bodyright{
	flex:1;

}
}
@media (min-width: 1200px) {
	.topicmain {
		width:1200px;
		margin:auto;
	}
}