body,
button{
	word-break: keep-all
}
body {
 -webkit-overflow-scrolling: touch;
}
button {
	background: 0;
	border: 0;
	padding: 0;
	cursor: pointer
}

button:focus{
	outline: 0
}
header,
main{
	display: block
}
body,
div,
ul,
li{
	margin: 0;
	padding: 0;
	border: 0;
	box-sizing: border-box
}

li {
	list-style: none
}
.btn_wrap{
	width:200px;
	height:50px;
	position: relative;
	margin:200px auto;
  background:#fff;
	border-radius: 50px;
  box-shadow:0 0.5px 6px rgba(0,0,0,0.0.5)

}
.btn_wrap li{
	float:left;
	width:50%;
	position:relative;
	line-height: 50px;
	text-align: center;
	font-size:18px;
	cursor: pointer;
}
.btn_wrap li.active{
	color:#fff;
	transition-duration: 0.3s;
}
.btn_wrap:before{
	content:'';
	width:100px;
	height: 100%;
	position:absolute;
	left:0;
	top:50%;
	transform: translateY(-50%);
	border-radius: 50px;
	background: #4c4c4c;
	box-sizing: border-box;
	transition-duration: 0.3s;
	transition-timing-function: cubic-bezier(0.1, 0.9, 0.25, 1)
}
.btn_wrap.right:before{
	left:100px;
}
.btn_wrap.left:before{
	left:0;
}