@charset "utf-8";
/* CSS Document */
@import url("font-awesome.css"); /*--font icon--*/
@import url("common.css"); /*共用*/
@import url("search.css");/*search*/
@import url("mp.css");
@import url("page.css");
@import url("tabpanel1_class.css");
/* 
	Generic Styling, for Desktops/Laptops 
	*/
.m-main .DataTable2 { width: 100%; margin: 0 auto 0; border-collapse: collapse; }
/* Zebra striping */
.m-main .DataTable2 tr:nth-of-type(odd) { background: #eee; }
.m-main .DataTable2 th { background: #084686; color: white; font-weight: bold; }
.m-main .DataTable2 td, .m-main .DataTable2 th { padding: 6px; border: 1px solid #ccc; text-align: left; vertical-align: top; }
/*----modify css----*/
.m-main .DataTable2 td ul { display: block; float: none; clear: both; margin: 0 0 5px 2em; }
.m-main .DataTable2 td ul li { list-style-type: decimal; }
.m-main .DataTable2 td .col { clear: both; display: inline-block; }
.m-main .DataTable2 td .col .img { float: left; margin-right: 8px; max-height: 120px; }

/*app list2*/
.m-main .list2 { margin: 0 0 15px; padding: 0px 0 0 0; position: relative; }
.m-main .list2 h2 { font-size: 1.23em; background: #1c5191; color: #fff; position: inherit; left: 0; clear: both; display: block; padding: 12PX 0 20PX 10PX; margin: 0; font-weight: bold; }
.m-main .list2 ul { margin: 0; padding: 0; clear: both; }
.m-main .list2 ul li { list-style-type: none; position: relative; }
.m-main .list2 li:first-child a { }
.m-main .list2 li:last-child a { }
.m-main .list2 li a { position: relative; display: block; background-image: -webkit-linear-gradient( #fefefe /*{b-bdown-background-start}*/, #f7f7f7 /*{b-bdown-background-end}*/); /* Chrome 10+, Saf5.1+ */ padding: 15px 7em 5px 15px; text-align: justify; text-justify: inter-word; color: #039; text-decoration: none; border: 1px solid #CCC; margin-bottom: -1px; font-weight: bold; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; font-size: 1.25em; height: 3em; }
.m-main .list2 li a:hover { background-image: -webkit-linear-gradient( #f5f5f5 /*{b-bdown-background-start}*/, #e0e0e0 /*{b-bdown-background-end}*/); /* Chrome 10+, Saf5.1+ */ }
.m-main .list2 li>a:after { content: "\f054"; font-family: "FontAwesome"; text-align: center; vertical-align: top; color: #fff; font-size: 12px; position: absolute; top: 30px !important; right: 6px; -moz-border-radius: 50px; -webkit-border-radius: 50px; border-radius: 50px; background-color: #999; width: 20px; height: 20px; padding: 0px; }
.m-main .list2 ul li h3 { margin: 0; font-size: 1em; color: #0789ba; width: 70%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.m-main .list2 ul li span { position: absolute; width: 100px; top: 17px; left: 1%; color: #333; font-size: 1em; z-index: 9999; }
.m-main .list2 li p { display: block; margin: 5px 0; font-weight: normal; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; }
.m-main .list2 li .image { float: left; overflow: hidden; padding: 0; margin: -10px; }
.m-main .list2 li .image img { width: 90px; height: 90px; margin: 0 20px 0 0; border: 3px solid #FFF; box-shadow: 0 0 1px #333; }
.m-main .list2 li img { margin: 0 10px 0 0; }
.m-main .list2 ul li.title a { background-color: #0789ba; background-image: none; color: #FFF; padding: 7px 15px; }
.m-main .list2 li.title>a:after { content: ""; background-color: transparent; }
.m-main .list2 li .number { position: absolute; top: 14px; right: 30px; font-size: 13px; font-weight: normal; border-radius: 10px; background-color: #FFF; border: 1px solid #CCC; padding: 1px 3px; color: #333; }
.m-main .list2 ul li.title .number { position: absolute; top: 5px; right: 10px; }
.m-main .list2 li .time { position: absolute; top: 8px; right: 30px; font-size: 13px; font-weight: normal; }
.m-main .list2 .more { border-radius: 5px; padding: 2px 10px 3px; position: absolute; top: 13px; right: 12px; cursor: pointer; }
.m-main .list2 .more a { color: #fff; }
.m-main .list2 ul li .date { display: block; width: auto; top: 3em; padding-left: 5px !important; }
.m-main .list2 ul li .info { width: 4em; top: 30px; left: auto; right: 40px; font: bold 1.25em Arial, Helvetica, sans-serif; text-align: right; }
@media (max-width: 1024px) {
.m-main .list2 ul li span { left: 1.5%; }
.m-main .list2 ul li .date { padding-left: 3px !important; }
}
@media (max-width: 768px) {
.m-main .list2 ul li span { left: 2%; }
.m-main .list2 ul li .date { padding-left: 3px!important; }
}

@media (max-width: 480px) {
.m-main .list2 ul li span { left: 2%; }
.m-main .list2 ul li .date { padding-left: 10px!important; }
}

/*icon*/
.m-main .function-icon { position: absolute; right: 10px; }
.m-main .function-icon ul { margin: 10px 0px; padding: 0px; list-style: none; }
.m-main .function-icon ul li { margin: 0px; padding: 0px; display: inline-block; width:44px; height:44px; }
.m-main .function-icon ul li img { width:100%; height:100%;}	

/*dataInfo*/
.m-main .dataInfo { margin-bottom: 20px; }
.m-main .dataInfo caption { font-size: 0.85em; line-height: 150%; color: #666; text-align: left; height: 40px; padding-left: 10px; padding-top: 20px; }
.m-main .dataInfo th { text-align: center; background: #084686; font-weight: bold; color: #FFF; }
.m-main .dataInfo td { text-align: center; }
.m-main .dataInfo tr:nth-of-type(odd) { background: #eee; }

@media (max-width: 320px) {
.m-main .function-icon { position: relative; right: auto; }
.m-main .function-icon ul { margin: 10px 0px 0px; padding: 0px; list-style: none; text-align: center; }
.m-main .dataInfo caption { text-align: center; height: auto; margin: 0px; padding: 0px 0px 5px; }

}



/*	#vertical thead,#vertical tbody{  display:inline-block; vertical-align:top; }*/
	
@media  only screen and (max-width: 760px),  (min-device-width: 768px) and (max-device-width: 1024px) {
/* Force table to not be like tables anymore */
.m-main .DataTable2, .m-main .DataTable2 thead, .m-main .DataTable2 tbody, .m-main .DataTable2 th, .m-main .DataTable2 td, .m-main .DataTable2 tr { display: block; }
/* Hide table headers (but not display: none;, for accessibility) */
.m-main .DataTable2 thead tr { position: absolute; top: -9999px; left: -9999px; }
.m-main .DataTable2 tr { border: 1px solid #ccc; }
.m-main .DataTable2 td { /* Behave  like a "row" */
border: none; border-bottom: 1px solid #eee; position: relative; padding-left: 27%; }
.m-main .DataTable2 td:before { /* Now like a table header */
position: absolute; /* Top/left values mimic padding */
top: 0px; left: 0px; width: 15%; text-align: right; padding: 6px; display: inline-block; white-space: nowrap; color: #084686; font-weight: bold; }
/*------modify  css-----*/
#vertical tbody { display: inherit; }
#vertical th:nth-child(1) { display: none; }
}		
/* Smartphones (portrait and landscape) ----------- */
@media only screen  and (min-device-width : 320px)  and (max-device-width : 480px) {
 body {
 padding: 0;
 margin: 0;
 width: 100%;
}
}
	
/* iPads (portrait and landscape) ----------- */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
body { width: 100%; }
}