@charset "utf-8";

/******************* 統一設定 *******************/
.pure-drawer{
	background:#ffffffe6;
}

.pure-drawer ul{
	margin-top:90px;
	padding-left:15px;
	color:#41a664;
	list-style:none;
}

.pure-drawer ul li div.button{
	width:285px;
	height:60px;
	margin:0 auto 5px;
	text-align:left;
	display:block;
}

.pure-drawer ul li a,.pure-drawer ul li button{
	width:100vw;
	height:60px;
	color:#41a664;
	text-align:left;
	font-size:1.5em;
	vertical-align:middle;
	display:table-cell;
	transition:.3s;
}

.pure-drawer ul li button.logout{
	color:#41a664;
	background:none;
	text-align:left;
	border:none;
	transition:.3s;
}

.pure-drawer ul li a,.pure-drawer ul li button.logout{
	opacity:.7;
}

.pure-toggle-label{
	width:55px;
	height:55px;
	border:none;
	border-radius:5px;
}

.pure-toggle-label[data-toggle-label='left']{
	top:22px;
	left:unset;
	right:15px;
}

.pure-toggle-label .pure-toggle-icon, .pure-toggle-label .pure-toggle-icon:before, .pure-toggle-label .pure-toggle-icon:after{
	height:2px;
	top:56%;
}

.pure-toggle-label span.label{
	color:#000;
	font-size:.65em;
	position:relative;
	left:7px;
}

.pure-toggle-label span.open{
	display:none;
}

.pure-toggle-label span.close{
	top:33px;
}

.pure-toggle[data-toggle='left']:checked ~ .pure-toggle-label span.open{
	display:block;
	top:39px;
}

.pure-toggle[data-toggle='left']:checked ~ .pure-toggle-label span.close{
	display:none;
}

@media (max-width:999px){
	.pure-toggle-label[data-toggle-label='left']{
		left:unset;
		right:42px;
	}

	.pure-toggle-label{
		width:42px;
		height:42px;
		border:none;
		border-radius:5px;
		top:10.75px;
	}

	.pure-toggle-label .pure-toggle-icon, .pure-toggle-label .pure-toggle-icon:before, .pure-toggle-label .pure-toggle-icon:after{
		width:25px;
		height:3px;
		background:#EF5B5B;
		border-radius:999px;
		top:60%;
	}

	.pure-toggle-label:hover .pure-toggle-icon, .pure-toggle-label:hover .pure-toggle-icon:before, .pure-toggle-label:hover .pure-toggle-icon:after{
		background:#EF5B5B;
	}

	.pure-drawer{
		border-right:solid 1px #41a664;
	}

	.pure-drawer ul{
		margin-top:clamp(60px,17.5vw,85px);
	}

	.pure-drawer ul li div.button{
		margin-bottom:7.5px;
	}
}

@media (max-width:429px){
	.pure-drawer ul li div.button{
		width:clamp(140px,70vw,280px);
		height:clamp(40px,13.5vw,50px);
		margin-bottom:clamp(5px,4.5vw,15px);
	}

	.pure-drawer ul li a,.pure-drawer ul li button{
		height:clamp(40px,13.5vw,50px);
	}
}