
/***********************************************************************************************************************

tab.css

***********************************************************************************************************************/



/*** tab **********************************/
.tab {
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 100%;
  max-width: 1000px;
  margin: 0 auto;
}

.tablist {
	position: relative;
  /*flex: 0 0 32%;*/
  width: 49.5%;
  list-style-type: none;
  /*border: 1px solid #aaa;*/
  text-align: center;
  padding: 1.5em 0;
  cursor: pointer;
	font-weight: 400;
	font-size: 18px;
	background-color: rgba(134, 192, 205, 0.3); /*#eee*/
}
.tablist.other{
	display: flex;
	align-items: center;
}
.tablist.other div{
	width: 100%;
	align-self: center;
	text-align: center;
}


.tablist:hover,
.tablist.active {
	color: #fff;
	background: #86c0cd; /*#000*/
}


.tabcontents {
	margin: 5px 0;
	padding: 6em 3em 4em;
	background: #F2F8ED;
background: linear-gradient(90deg, rgba(242, 248, 237, 1) 0%, rgba(228, 241, 251, 1) 100%);
}




@media screen and (max-width: 767px) {
.tablist {
	font-size: 13px;
}
.tabcontents {
	padding: 4em 1em 2em;
}
}



/*************************************************************************************
*************************************************************************************

print

*************************************************************************************
**************************************************************************************/

@media print {

}