table{
	border: 0.5vw solid rgb(255, 227, 97);
	border-collapse: separate;
	border-spacing: 0;
	border-radius: 2vw;
	overflow: hidden;
	/* box-shadow: 0.1vw 0.1vw 0.4vw 0.1vw rgba(0, 0, 0, 0.2); */
	width: 100%;
	font-size: 2vw;
	margin-bottom: 4px;
}
table#tangen_table{
	border: 0.5vw solid rgb(16, 165, 233);
	border: none;
}

table#tangen_table tbody{
	overflow-x: hidden;
	overflow-y: scroll;
	height: 46vh;
	-ms-overflow-style: none;
}

table#tangen_table tbody::-webkit-scrollbar{
	display:none;
}

.ws_contents table{
	margin-bottom: 0;
}

table,
table tr th,
table tr td {
	font-weight:bold;
	font-size: 100%
}

table#tangen_table #th_1, table#tangen_table #td_1{
	width:12%;
}

table#tangen_table #th_2, table#tangen_table #td_2{
	width:200vh;
}

table#tangen_table #th_3, table#tangen_table #td_3{
	width:20%;
}

table tr:nth-of-type(1) th:first-of-type {
	border-top-left-radius: 1.5vw;
}

table tr:nth-of-type(1) th:last-of-type {
	border-top-right-radius: 1.5vw;
}

table.name_table,
table.history_table,
table#study_list_table tr:nth-of-type(1) th:first-of-type,
table#study_list_table tr:nth-of-type(1) th:last-of-type,
table#study_list_table tr:nth-last-of-type(1) td:first-of-type,
table#study_list_table tr:nth-last-of-type(1) td:last-of-type {
	border-radius: 0;
}

table#study_list_table>thead>tr:nth-of-type(1) th:first-of-type {
	border-top-left-radius: 1.5vw;
}

table#study_list_table>thead>tr:nth-of-type(1) th:last-of-type {
	border-top-right-radius: 1.5vw;
}

table#study_list_table table.name_table>tbody>tr:nth-last-of-type(1) td:first-of-type {
	border-bottom-left-radius:1.5vw;
}
table.history_table,
table#study_list_table table.history_table>tbody>tr:nth-last-of-type(1) td:last-of-type {
	border-bottom-right-radius:1.5vw;
}


table.square,
table.square tr th,
table.square tr td ,
table.details,
table.details tr th,
table.details tr td {
	font-size: calc(20% + 1vw);
	font-weight: bold;
}

colgroup.hidden-xs {
	display: table-column-group!important;
}

colgroup.visible-xs {
	display: none!important;
}

@media (max-width: 767px) {
	colgroup.hidden-xs {
		display: none!important;
	}
	colgroup.visible-xs {
		display: table-column-group!important;
	}
}

@media (min-width: 400px) {
	colgroup.landscape {
		display: table-column-group!important;
	}
	th.hidden-landscape,
	td.hidden-landscape,
	colgroup.portrait {
		display: none!important;
	}
}

@media (max-width: 399px) {
	th.hidden-portrait,
	td.hidden-portrait,
	colgroup.landscape {
		display: none!important;
	}
	colgroup.portrait {
		display: table-column-group!important;
	}
}

/*学習一覧画面専用*/
@media (max-width: 750px) {
	table.name_table tbody tr,
	table.history_table tbody tr{
		height: 10.5vw;
	}
}

@media (max-width: 750px)
and (orientation: landscape) {
	table.name_table tbody tr,
	table.history_table tbody tr{
		height: 7vw;
	}
}

@media (min-width: 751px){
	table.name_table tbody tr,
	table.history_table tbody tr{
		height: 7vw;
	}
}



table.maintenance {
	border-color: rgb(138, 172, 216);
}

table.maintenance thead tr th{
	background-color: rgb(97, 122, 157);
	color: rgb(255, 255, 255)
}

table.maintenance thead tr th a{
	color: rgb(255, 255, 255)
}

table.maintenance thead tr th,
table.maintenance tbody tr td{
	text-align: left;
	/*white-space: nowrap;*/
	/*overflow: hidden;*/
	height: 3.5vw
}
table.maintenance thead tr th{
	font-size: 1.2vw;
}
table.maintenance tbody tr td{
	font-size: 1.3vw;
	color: rgb(97, 122, 157);
}

table.setting_square.kanri tr th,
table.setting_square.kanri tr td{
	text-align: left;
	background-color: #fff;
	border-left-width: 0.3vw;
	border-radius: 0;
}
table.setting_square.kanri  td>input{
	margin: 0.4vw;
}

table.setting_square.kanri  td>input.harf{
	width: 48%;
}
table.setting_square.kanri  td>input.full{
	width: 96%;
	font-size: 100%;
}

table.square .border_left,
table.details .border_left {
	border-left-width: 0.15vw;
}
table.setting_square.kanri .border_bottom{
	border-bottom: 0.2vw solid rgb(97, 122, 157);
}


table.square,
table.square tr:nth-of-type(1) th:first-of-type,
table.square tr:nth-of-type(1) th:last-of-type,
table.square tr:nth-last-of-type(1) td:first-of-type,
table.square tr:nth-last-of-type(1) td:last-of-type {
	border-radius: 0;
}

table.square {
	border: none;
}

table.square tr.minimum th {
	margin: 0;
	padding: 0;
}

table tr{
	height: auto;
}

table thead tr th{
	padding: 0.5vw 1vw;
}

table tbody tr td{
	padding: 0.5vw 1vw;
}

table tr th,
table tr td{
	border: none;
	text-align: center;
}

table thead tr th a,
table thead tr td a,
table thead tr th,
table thead tr td{
	font-size: calc(2px + 1.3vw);
}

table thead tr th, table tfoot tr th, table tfoot tr td, table tbody tr th, table tbody tr td, table tr td{
	line-height: inherit;
}

table tbody tr th a,
table tbody tr td a {
	text-decoration: underline;
}

.bg_checkbox label {
	width: 3vw;
	height: 3vw;
	position: relative;
	margin: 0;
}

/* ボディ奇数行 */
table tbody tr td {
	color: rgb(89, 73, 63);
}
table#tangen_table tbody tr td{
	margin: 0;
	padding-top: 0.6vw;
	padding-bottom: 0.6vw;
}
table#tangen_table tbody tr td:last-of-type{
	border-width: 0 0 0 0;
  border-left-width: 4px;
  border-left-style: solid;
  border-left-color: rgb(172, 164, 159);
	border-style: dotted;
}
table#tangen_table tbody tr td:nth-of-type(2){
	color: rgb(35, 24, 21);
}

table tbody tr,
table tbody tr:nth-of-type(even){
	-webkit-transition: background .2s ease-in-out;
	-moz-transition: background .2s ease-in-out;
	-o-transition: background .2s ease-in-out;
	transition: background .2s ease-in-out;
}

table tbody tr.check td.intelligibility{
	text-shadow: 0.1vw 0.1vw 0px rgba(0, 0, 0, 0.2);
	background: rgb(75, 91, 131);
}

table thead tr th.intelligibility,
table tbody tr.check:nth-of-type(even) td.intelligibility{
	background: rgb(56, 73, 115);
}

table tbody tr,
table thead tr{
background-color: rgba(255,255,255,0);
}

table tbody tr:nth-of-type(2n+1) td{
	background: #ffffff;
}

table tbody tr.selected td{
	background: #fefae1;
}

table tbody tr.selected:nth-of-type(even) td{
	background: #f3f5e1;
}

/* ヘッダー */
table thead tr th{
	/* color: #69ccfc; */
	color: #000000;
	background:#fff9df;
}

table thead tr th.white{
	background:#ffffff;
}

table thead tr th.blue{
	color: #ffffff;
	background:#69ccfc;
}

/* ボーダー */
table .border_left{
	border-width: 0 0 0 0;
	border-style: none none none none;
	border-left-width: 0.3vw;
	border-left-style: solid;
	border-left-color: #69ccfc;
}

table .border_right{
	border-width: 0 0 0 0;
	border-style: none none none none;
	border-right-width: 0.3vw;
	border-right-style: solid;
	border-right-color: #69ccfc;
}


table .border_thin_color{
	border-left-color: #81cddf;
}

table .dotted{
	border-style: dotted;
}

/**
* 文字サイズ指定
*/
table .full{
	font-size: 300%;
	font-weight: bold;
}

table .bold{
	font-size: 180%;
	font-weight: 500;
}

table .heavy{
	font-size: 180%;
	font-weight: 600;
}

table .lighter{
	font-weight: 300;
}

/**
*チェックボックス
*/
/*table input[type="checkbox"]{
position: relative;
display: inline-block;
width: 3vw;
height: 3vw;
background: url("../../img/button/btn_check_box.png");
background-size: contain;
background-repeat:no-repeat;
border: none;
-webkit-appearance: none;
cursor:pointer;

-webkit-transition: background .2s ease-in-out;
-moz-transition: background .2s ease-in-out;
-o-transition: background .2s ease-in-out;
transition: background .2s ease-in-out;
}

table input[type="checkbox"]:checked {
background: url("../../img/button/btn_checked_box.png");
background-size: contain;
background-repeat:no-repeat;
cursor:pointer;
}*/

label.tangen_checkbox{
	position: relative;
	padding: 0;
	margin: 0;
}
div.input.checkbox input{
	opacity: 0;
}

div.input.checkbox .image{
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	right: 0;
	margin:auto;
	display: inline-block;
	width: 3vw;
	height: 3vw;
	background: url("../../img/button/btn_check_box.png");
	background-size: contain;
	background-repeat:no-repeat;
	border: none;
	-webkit-appearance: none;
	cursor:pointer;
	-webkit-transition: background .2s ease-in-out;
	-moz-transition: background .2s ease-in-out;
	-o-transition: background .2s ease-in-out;
	transition: background .2s ease-in-out;
	outline: none;
}

div.input.checkbox input:checked + .image{
	background: url("../../img/button/btn_checked_box.png");
	background-size: contain;
	background-repeat:no-repeat;
	cursor:pointer;
}

/**
* スクロールテーブル
*/
table.scroll {
	min-width: calc(19em + 17px);
	height: 420px;
	overflow-y: scroll;
	-webkit-overflow-scrolling: touch;
	border-collapse: collapse;
}

table.scroll thead,
table.scroll tbody,
table.scroll tr,
table.scroll th,
table.scroll td {
	display: block;
}

table.scroll tbody {
	height: calc(100% - 2em);
	overflow-y: scroll;
	-webkit-overflow-scrolling: touch;
}
table.scroll tr{
	border: none;
	border-collapse: collapse;
}

table.scroll tr:after {
	content: "";
	display: block;
}

table.scroll th,
table.scroll td {
	height: 2em;
	line-height: 2em;
	overflow: hidden;
	box-sizing: content-box;
}

#study_list_table tbody tr td,
#border_table tbody tr td{
	border-top: 0.2vw solid #fff;
}

/**
* 色指定
*/
table .default_color{
	background:#0f6fc6;
}

table tr.white_color th,
table tr.white_color td{
	border: 1px solid #009dd9;
}

td.study_name{
	text-align: left;
	font-weight: 500;
}

td.percentage {
	padding: 6px 0;
}

div.box_graph {
	vertical-align: middle;
	display: inline-block;
	border:1px solid #000;
	height:3vw;
}

table span.mark {
	display: inline-block;
	color:#FFF;
	border-radius:2vw;
	padding:0.4vw 0.8vw;
	vertical-align: middle;
}

table span.mark.lg {
	font-size: 1.6vw;
	border-radius: 4.5vw;
	padding: 0.5vw 1vw;
}
table span.product_name,
table span.tangen_name,
table span.student_name
{
	font-size: 1.6vw;
	vertical-align: middle;
}

tr .intelligibility{
	background-color: rgb(56, 73, 115);
	color: #FFF;
}

th.k-head-left{
	text-align:left;
	padding-left: 1vw;
	padding-right: 1vw;
}

th.k-head-right{
	text-align:right;
	padding-left: 1vw;
	padding-right: 1vw;
}


/*
スクロール可能なテーブル
*/

table.scrollable_y tbody{
	overflow: scroll;
	display: block;
	border-radius: 0vw 0vw 1.5vw 1.5vw;
	/*-webkit-overflow-scrolling: touch;*/
}
table.scrollable_y tbody tr{
	display: flex;
}

/*
単語一覧
*/
table#word_table {
  border: none;
  margin-bottom: 0px;
  border-collapse: collapse;
  transform: translate3d(0, 0, 0);
}
table#word_table tr{
  border: none;
}
table#word_table tbody {
  border-width: 0 0 0 0;
  border-bottom-width: 2px;
  border-bottom-style: solid;
  border-bottom-color: rgb(15, 206, 127);
  border-style: dotted;
}
table#word_table tbody tr:last-of-type{
	/* border-collapse: inherit; */
	/* border-width: 0 0 0 0;
  border-bottom-width: 0.3vw;
  border-bottom-style: solid;
  border-bottom-color: #69ccfc;
	border-style: dotted; */
}
table#word_table tbody tr .word_name{
	text-align: left;
	color: #000000;
}
table#word_table tbody tr .means{
	text-align: left;
}
table#word_table tbody tr .parts{
	text-align: left;
}
table#word_table tbody:nth-of-type(even) tr td {
  background-color: rgb(231, 250, 242);
}
table#word_table tbody tr td .span_parts {
  color: #FFFFFF;
  width: 10%;
  border-radius: 5px;
  background-color: rgb(9, 133, 82);
  padding: 2% 5%;
}
table#word_table tbody tr .means {
  text-align: left;
  color: rgb(9, 133, 82);
}
table#word_table tbody:last-child {
  border: none;
}
table#word_table td button#play img{
	width: calc(50px + 1vw);
}
