@charset "utf-8";
/* =========================================== */
/* common */
/* =========================================== */
.container.mypage{
  background: rgba(255, 255, 255, 0.75);
  padding: 2em;
}
/* ============================================ */
/* Mypage Navigation */
/* ============================================ */
/* Tab navigation */
#mypage-tabnav{
  margin-bottom: 2em;
}
#mypage-tabnav ul{
	display: flex;
  justify-content: space-between;
  list-style-type: none;
  padding-left: 0;
}
#mypage-tabnav ul li{
	width: 50%;
	text-align: center;
}
#mypage-tabnav ul li a{
	display: block;
	width: 100%;
	border: 1px solid #AFAFAF;
	border-right: none;
	text-decoration: none;
	height: 36px;
	color: #707070;
	position: relative;
	line-height: 36px;
}
#mypage-tabnav ul li:last-child a{
	border-right: 1px solid #AFAFAF;
}
#mypage-tabnav ul li.active a{
	background: #2B95C9;
	color: #FFF;
	border: none;
}
#mypage-tabnav ul li:hover > a {
    background: #2B95C9;
	color: #FFF;
	transition: all 0.3s linear;
}
#mypage-tabnav ul li.active a:after{
	content: '';
	position: absolute;
	bottom: -23px;
	left: calc(50% - 12px);
	border: 12px solid transparent;
	border-top: 12px solid #2B95C9;
}
@media screen and (max-width : 640px){
	#mypage-tabnav ul li{
		float: none;
		width: 100%;
	}
	#mypage-tabnav ul li.active a:after{
	content: none;
	}
	#mypage-tabnav ul li a{
		border-right: 1px solid #AFAFAF;
	}
}

/* ============================================ */
/* Table Layout for Mobile */
/* ============================================ */
@media screen and (max-width: 576px){
  .orders tr,
  .orders thead th,
  .orders td{
    display: block;
    padding: 0.25em;
    border: none;
  }
  .orders tr{
    border-top: 1px solid #dee2e6;
  }
  .orders tr:last-child{
    border-bottom: 1px solid #dee2e6;
  }
} 
/* 参加証明ID */
.participation-id > div{
	background: #F8F8F8;
	padding: 1em;
	margin-bottom: 2em;
	border: 1px solid #CCC;
}
.participation-id p{
	font-size: 120%;
	margin-bottom: 0;
}
.orders .btn{
	font-size: 94%;
}
.orders tr:last-child{
	border-bottom: 1px solid #CCC;
}