@charset "utf-8";

/******************* 統一設定 *******************/

.pure-drawer{
	background:#ffffffe6;
}

.pure-drawer ul{
	margin-top:150px;
	color:#6e6e6e;
	list-style:none;
}

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

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

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

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

@media (max-width:999px){
	/******************* 統一設定 *******************/
	.pure-toggle-label[data-toggle-label='left']{
		background:#fff;
		left:unset;
		right:15px;
	}

	.pure-toggle-label{
		width:44px;
		height:44px;
		border:solid 1px #000;
		border-radius:5px;
		top:6.77px;
	}

	.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:#000;
		top:56%;
	}

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

	.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,60vw,240px);
		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);
	}
}
