@charset "utf-8";
/* CSS Document */
table#mytable,
.mytable1,
table#mytable2
 { 
  margin: 0 auto;
  border-collapse: collapse;
 /* background: #edf7fe; */
  color: #15489e;
  text-rendering: optimizeLegibility;
  border-radius: 5px;
  width: 100%; 
  text-align:left; font-family: robotoslablight, Arial, Helvetica, sans-serif;
 
}

/*table#mytable tbody td:nth-child(even) {
  color: red;
}*/


table#mytable thead th, table#miyazaki tbody td,
.mytable1 thead th, table#miyazaki tbody td,
table#mytable2 thead th, table#miyazaki tbody td  { 
  padding: .5rem; font-size: 1em; text-align:left;
}
table#mytable tbody td,
.mytable1 tbody td,
table#mytable2 tbody td { 
  padding: .5rem; 
  font-size: 1rem;
  color: #727272; 
  font-size:.938em;
  border-bottom:1px solid #d3d3d3;
}
table#mytable tbody tr:not(:last-child),
.mytable1 tbody tr:not(:last-child),
table#mytable2 tbody tr:not(:last-child) { 
  border-top: 1px solid #ddd;
  border-bottom: 1px solid #ddd;  
}
table#mytable tbody tr:nth-child(2n+1) {
    background: #fafafa;
}

/* my style */
table#mytable .int-radio {
	display:inline;
	height:auto;
}
table#mytable .txtarea {
	height:40px;
	color: #838e93;
	font-size:.93em;
	padding:.5em;
	width:70%;
	border:1px solid #eaeaea;
}
table#mytable form {
	display:inline;
}

/*************** resposive table **********************/

.resposive table {
	
}
.responsive-table select,
.responsive-table input  {
	width:100%;
}
.responsive-table tbody tr {
	border:none !important;
}
.responsive-table tbody td {
	border:0 !important;
}
.responsive-table .head {
	background: #cfddf6 none repeat scroll 0 0;
    color: #1e3e91;
    padding: 0.4em;
	font-size:0.9em;
	font-family: robotoslablight, Arial, Helvetica, sans-serif;
	font-weight:normal;
}

/************ / resposive table *********************/




@media screen and (max-width: 1023px) {
table#mytable .txtarea {
	width:55%;
}
	

  table#mytable caption,
  .mytable1 caption,
  table#mytable2 caption { background-image: none; }
  
  table#mytable thead,
  .mytable1 thead,
  table#mytable2 thead { display: none; }
  
  table#mytable tbody td,
  .mytable1 tbody td,
  table#mytable2 tbody td { 
    display: block; padding: .6rem; 
	background:#fafafa;
  }

table#mytable tbody tr td:last-child,
.mytable1 tbody tr td:last-child,
table#mytable2 tbody tr td:last-child { 
   border-bottom:1px;
   border-bottom-style:solid;
  }
  
table#mytable tbody td:before,
.mytable1 tbody td:before,
table#mytable2 tbody td:before { 
   content: attr(data-th); 
   font-weight: bold;
   display: inline-block;
   width: 40%;  
   color:#15489e;
	
  }
}

@media screen and (min-width : 320px) and (max-width : 500px) {
	table#mytable tbody td::before, .mytable1 tbody td::before, table#mytable2 tbody td::before {
		color: #15489e;
		content: attr(data-th);
		display: block;
		font-weight: bold;
		width: 100% !important
		padding:0 0 1em 0;
	}
	table#mytable .txtarea {
		width:90%;
	}
	
	

}