/* 只为展示好看 ，可删除*/
body {
	padding:30px;
}
body .IOS-radio-box {
	display:inline-block;
	margin-right:20px;
}
/*主要CSS*/
.IOS-radio-box {
	position:relative;
	width:120px;
	height:58px;
}
.IOS-radio-box input {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	opacity:0;
	z-index:99;
}
.IOS-switch {
	overflow:hidden;
	position:relative;
	width:100%;
	height:100%;
	border-radius:100px;
	background:#f84572;
	box-shadow:0px 0px 2px #f84572 inset;
	transition:all 0.2s ease-in-out;
}
.IOS-radio-box input:checked~.IOS-switch {
	background:#0ebdca;
	box-shadow:0px 0px 2px #0ebdca inset;
}
.IOS-cursor {
	display:inline-block;
	position:absolute;
	top:3px;
	left:3px;
	width:52px;
	height:52px;
	border-radius:100%;
	background:#fff;
	box-shadow:0 1px 2px 0 rgba(0,0,0,0.2),0 3px 4px 0 rgba(0,0,0,0.1);
	z-index:10;
	-webkit-transition:all 0.2s linear;
	-ms-transition:all 0.2s linear;
	transition:all 0.2s linear;
}
.IOS-radio-box input:checked~.IOS-switch .IOS-cursor {
	left:64px;
}
.IOS-label {
	position:absolute;
	top:0;
	width:70px;
	font-size:28px;
	line-height:58px;
	color:#fff;
	text-align:center;
	-webkit-transition:all 0.2s linear;
	-ms-transition:all 0.2s linear;
	transition:all 0.2s linear;
}
.IOS-label-on {
	left:-55px;
	opacity:0.5;
}
.IOS-radio-box input:checked~.IOS-switch .IOS-label-on {
	left:3px;
	opacity:1;
}
.IOS-label-off {
	opacity:1;
	right:0;
}
.IOS-radio-box input:checked~.IOS-switch .IOS-label-off {
	opacity:0.5;
	right:-55px;
}