@charset "UTF-8";
/* CSS Document */



/* ====================
	profile
==================== */

.mymail p,.mypw p,.mycard p {
	margin: 0;
}
.z1 {
	z-index: 1;
}
.z2 {
	z-index: 2;
}
.z3 {
	z-index: 3;
}
@media screen and (min-width:700px) {
  .myprofile {
    padding: 2.5rem;
  }
  .mymail,.mypw,.mycard {
    padding: 1rem 3.1rem 1rem 2.5rem
  }
}
@media screen and (max-width:699px) {
  .myprofile {
    padding: 2rem 0.625rem;
  }
  .mymail,.mypw,.mycard {
    padding: 1rem  3.1rem 1rem  1.25rem
  }
}



/* ====================
	.user-list
==================== */

.user-list {
	width: 100%;
	height: auto;
	margin: 0;
}
.user-list-table {
	width: 100%;
	height: auto;
}
.user-list-table tbody tr {
	font-size: 1rem;
	border-bottom: 1px solid #CCCCCC;
}
.user-list-table .box-deadline .note {
	width: fit-content;
	height: auto;
	line-height: 1;
}
.user-list-table .box-deadline .btn-red {
	width: fit-content;
	height: auto;
	color: #DD0000;
	font-size: 0.9375rem;
	text-align: center;
	line-height: 1.5;
	background-color: #FFFFFF;
	padding: 0.25em 0.75em;
	border: 1px solid #DD0000;
	border-radius: 0.1875rem;
	display: block;
	position: relative;
	transition: all .3s;
	z-index: 0;
}
.user-list-table .box-deadline .btn-red:hover {
	background-color: #FFF5F5;
}
.user-list-table .btn-list {
	width: 5.75rem;
	height: auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
@media screen and (min-width:700px) {
	.user-list {
		padding: 0;
	}
	.user-list-table thead {
		width: 100%;
		height: auto;
		border-top: 1px solid #CCCCCC;
		border-bottom: 1px solid #CCCCCC;
	}
	.user-list-table tbody tr {
		padding: 0.625rem;
	}
	.user-list-table th {
		font-size: 0.875rem;
		padding: 0.625rem;
	}
	.user-list-table td {
		padding: 0.625rem;
	}
	.user-list-table .cell01 {
		padding-left: 2rem;
	}
	.user-list-table .cell02 {
	}
	.user-list-table .cell03 {
		width: 6.875rem;
	}
	.user-list-table .cell04 {
		width: 7.5rem;
	}
	.user-list-table .cell05 {
		width: 6.25rem;
	}
	.user-list-table .label {
		display: none;
	}
	.user-list-table .box-deadline {
		width: fit-content;
		height: auto;
		text-align: center;
		margin: 0 auto;
	}
	.user-list-table .box-deadline .note {
		font-size: 0.75rem;
		text-align: center;
		margin: 0 auto 0.75em;
	}
	.user-list-table .box-deadline .btn-red {
		margin: 0 auto;
	}

}
@media screen and (max-width:699px) {
	.user-list {
		padding: 0.625rem !important;
	}
	.user-list-table {
		border-top: 1px solid #CCCCCC;
	}
	.user-list-table tbody tr {
		display: block;
		padding: 0.25rem 0 1rem;
	}
	.user-list-table thead {
		display: none;
	}
	.user-list-table td {
		width: 100%;
		display: block;
		padding: 0.625rem 0.625rem 0;
	}
	.user-list-table .label {
		font-size: 0.875rem;
	}
	.user-list-table .box-deadline {
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-start;
	}
	.user-list-table .box-deadline .note {
		margin: 0.125rem 0;
	}
	.user-list-table .box-deadline .btn-red {
		margin: -0.313rem 0.625rem;
	}
	.user-list-table .cell05 {
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-start;
	}
	.user-list-table .btn-list {
		margin: -0.313rem 0 0;
	}
}



/* ====================
	.notification-list
==================== */

.notification-list {
	width: 100%;
	height: auto;
	margin: 0;
	padding: 0;
}
.notification-list .inner-box:last-child {
	margin: 0;
}
.notification-list .inner-box .inner {
	width: 100%;
	height: auto;
	margin: 0;
	overflow: hidden;
}
.notification-list .inner-box .inner p {
	width: calc(100% - 5.5rem);
	height: auto;
	margin: 0.313rem 0;
	padding: 0;
	float: left;
}
.notification-list .inner-box .inner .btn-blue-outline {
	margin: 0;
	float: right;
}
.notification-list .inner-box .inner .btn-blue-outline.on {
	color: #FFFFFF;
	background-color: #2988D3;
}
@media screen and (min-width:700px) {
	.notification-list .inner-box {
		margin: 0 0 1.25rem;
	}
	.notification-list .inner-box .inner {
		padding: 1.25rem;
	}
	.notification-list .inner-box .inner .btn-blue-outline {
		width: 5.5rem;
	}
}
@media screen and (max-width:699px) {
	.notification-list .inner-box {
		margin: 0 0 0.625rem;
	}
	.notification-list .inner-box .inner {
		padding: 0.625rem;
	}
	.notification-list .inner-box .inner .btn-blue-outline {
		width: 5rem;
		padding: 0.5em 0;
	}
}