/* DEFAULTS
----------------------------------------------------------*/
body, textarea { font-family: "メイリオ", "ＭＳ Ｐゴシック", sans-serif; }  
input, select, textarea { font-family: Arial, "ＭＳ Ｐゴシック", sans-serif; font-size: inherit; } 
select { font-size: 102%; }

body {
	margin: 0px;
	background-color: #F8F8F8;
	color: #555555;
}

label {
	cursor: pointer;
}

.base {
	margin: 0px auto;
	padding: 0px 15px;
}

a img {
	border-width: 0px;
}

.header {
	height: 71px;
	min-width: 960px;
	background-image: url("../image/header_grade.png");
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
}

.header div {
	float: left;
}

.header div img {
	margin-left: 40px;
}

.header .main_title {
	line-height: 71px;
	font-size: 20pt;
	font-weight: bold;
	color: #FFFFFF;
	margin-left: 20px;
}

.header .sub_title {
	line-height: 71px;
	font-size: 10pt;
	color: #FFFFFF;
	margin-left: 20px;
}

.contents {
	margin: 0px auto;
	padding: 10px 0px;
	min-width: 960px;
}

.title {
	height:65px;
	display: table;
}
.title div {
	display: table-cell;
	vertical-align: middle;
}
.title h1 {
	float: left;
	font-size: 16pt;
	font-weight: bold;
	margin-left: 10px;
	padding-left: 10px;
	width: 740px;
	border-bottom: 2px solid #28994E;
	vertical-align: bottom;
	background-image: url("../image/title_grade.png");
	height: 35px;
	line-height: 40px;
}
.title a.logout {
	margin-left: 20px;
}

.content_body {
	padding-top: 10px;
	padding-left: 20px;
}

/* LIST RESULT DESIGN */
.result_area {
}
.result_area .count {
	font-size: 10pt;
	padding-right: 5px;
	vertical-align: bottom;
}

/* TABLE DESIGN
----------------------------------------------------------*/
table.base_table {
	border-top: 2px solid #6FBF87;
	border-bottom: 2px solid #6FBF87;
	border-left: 1px solid #6FBF87;
	border-right: 1px solid #6FBF87;
	border-collapse: collapse;
	font-size: 10pt;
}
table.base_table tr th {
	background-color: #8BE0AC;
	border: 1px solid #6FBF87;
	padding: 2px 4px;
	font-weight: bold;
	text-align: left;
}
table.base_table tr td {
	background-color: #F1FAF3;
	border: 1px solid #6FBF87;
	padding: 2px 3px;
	text-align: left;
	word-break: break-all;
}
table.base_table_jr {
	border-top: 2px solid #0171BC;
	border-bottom: 2px solid #0171BC;
	border-left: 1px solid #0171BC;
	border-right: 1px solid #0171BC;
	border-collapse: collapse;
	font-size: 10pt;
}
table.base_table_jr tr th {
	background-color: #9ED8FF;
	border: 1px solid #0171BC;
	padding: 2px 4px;
	font-weight: bold;
	text-align: left;
}
table.base_table_jr tr td {
	background-color: #9ED8FF;
	border: 1px solid #0171BC;
	padding: 2px 4px;
	text-align: left;
	word-break: break-all;
}
table.layout_table {
	border-width: 0px;
	border-collapse: collapse;
}
table.layout_table tr td {
	border-width: 0px;
	padding: 0px;
}
tr.odd td {
	background-color: #FFFFFF !important;
}
tr.even td {
	background-color: #F0FFF3 !important;
}
tr.del td {
	background-color: #D9D9D9 !important;
}
tr.error td {
	color: #FF0000 !important;
}
td.error {
	color: #FF0000 !important;
}

/* FRAME DESIGN
----------------------------------------------------------*/
.pop_frame {
	padding: 10px;
	border: 1px solid #DDDDDD;
	border-radius: 10px;
	box-shadow: 1px 1px 2px #666666;
}

.pop_frame h2 {
	font-size: 12pt;
	font-weight: bold;
	margin: 0px 0px 5px 0px;
	color: #000000;
	padding: 1px 5px;
	background-image: url("../image/menu_title_grade.png");
}

/* BUTTON DESIGN
----------------------------------------------------------*/
.link_button {
	color: #000000;
	font-size: 11pt;
	font-weight: bold;
	background-image: url("../image/button_grade_off.png");
	display: inline-block;
	padding: 5px 5px 5px 5px;
	min-width: 80px;
	border-radius: 5px;
	text-align: center;
	text-decoration: none;
	border: 1px solid blue;
}
.link_button:hover {
	background-image: url("../image/button_grade_on.png");
}
.link_button_mini {
	color: #000000;
	font-size: 8pt;
	font-weight: bold;
	background-image: url("../image/mini_button_grade_off.png");
	display: inline-block;
	padding: 2px 2px 2px 2px;
	min-width: 50px;
	border-radius: 5px;
	text-align: center;
	text-decoration: none;
	border: 1px solid blue;
}
.link_button_mini:hover {
	background-image: url("../image/mini_button_grade_on.png");
}

.menu_button {
	text-align: left;
	color: #000000;
	font-size: 11pt;
	font-weight: bold;
	background-image: url("../image/menu_grade_off.png");
	display: inline-block;
	height: 46px;
	width: 280px;
	border-radius: 5px;
	text-decoration: none;
	border: 1px solid blue;
	margin: 5px 0px;
}

.menu_button:hover {
	background-image:url("../image/menu_grade_on.png");
}

.menu_button img {
	border-width: 0px;
	padding: 12px 5px 0px 5px;
	vertical-align: bottom;
}
.menu_button span {
}

.icon_calendar {
	vertical-align: middle;
	padding-left: 1px;
	cursor: pointer;
}

div.center {
	display: table;
	margin: 0px auto;
}

div.middle {
	display: table-cell;
	vertical-align: middle;
}

div.error_message {
	border: 1px solid #ff0000;
	padding: 5px;
	margin: 5px 0px;
	background-color: #ffffe0;
	color: #ff0000;
	font-weight: bold;
}

/* clearfix
----------------------------------------------------------*/
.clearfix:before,
.clearfix:after {
	content:"";
	display:table;
}
.clearfix:after {
	clear:both;
}
.clearfix {
	zoom:1;
}
* html .clearfix {
	height: 1%;
}
*:first-child+html .clearfix {
	height: 1%;
}

/* textbox design
----------------------------------------------------------*/
.money {
	text-align: right; 
}

.footer
{
	position:fixed;
	bottom:0;
	width: 100%;
	overflow:hidden;
	z-index:995;
	background-image: url("../image/footer_grade.png");
}

.footText div{
	font-size: 10pt;
	color: #FFFFFF;
	display:inline;
	height:24px;
	line-height:24px;
	padding:0 1em;
	border-left:solid 1px #ccc;
}

.footer div.copyright{
	border-left:none;
}

/* SORT ICON DESIGN
----------------------------------------------------------*/
.sort_item {
	cursor: pointer;
	position: relative;
	text-align:left;
}

.sort_item:hover {
	color: #ff006e;
	text-decoration: underline;
}

.sort_icon::before, .sort_icon::after {
	content: "";
	height: 0;
	width: 0;
	position: absolute;
	border: 5px solid transparent;
	right: 5px;
	top: 50%;
}

.sort_icon::before {
	border-bottom-color: #AAAAAA;
	margin-top: -12px;
}

.sort_icon::after {
	border-top-color: #AAAAAA;
	margin-top: 0px;
}

.sort_asc::before {
	border-bottom-color: #444;
}

.sort_desc::after {
	border-top-color: #444;
}

.question-icon {
	display: inline-block;
	width: 22px;
	height: 22px;
	background-color: #3498DB;
	border-radius: 50%;
	color: white;
	font-size: 15px;
	text-align: center;
	line-height: 22px;
	font-family: Arial, sans-serif;
	cursor: pointer;
}