.t-switch {

	width: 60px;

	height: 30px;

	

	-webkit-border-radius: 15px;

	-moz-border-radius: 15px;

	-ms-border-radius: 15px;

	-o-border-radius: 15px;

	border-radius: 15px;

	position: relative;

	line-height: 30px;

	z-index: 100;

	border: 1px solid #dedede;

}

.t-switch:before,.t-switch:after {

	position: absolute;

	z-index: -10;

	top: 0;

	font-size: 12px;

}

.t-switch:before {

	content: "开";

	left: 10px;

}

 .t-switch:after {

	content: "关";

	right: 10px;

}

.t-switch input[type="checkbox"] {

	-webkit-box-sizing: border-box;

	-moz-box-sizing: border-box;

	-ms-box-sizing: border-box;

	-o-box-sizing: border-box;

	box-sizing: border-box;

	padding: 0;

	margin: 0;

	width: 100%;

	height: 100%;

	opacity: 0;

}

.t-switch input[type="checkbox"]:checked + span{

	-webkit-transform: translateX(30px);

	-moz-transform: translateX(30px);

	-ms-transform: translateX(30px);

	-o-transform: translateX(30px);

	transform: translateX(30px);

	background: #1AAD19;

}

.t-switch-btn {

	position: absolute;

	z-index: -1;

	left: 0;

	top: 0;

	width: 30px;

	height: 30px;

	border-radius: 15px;

	background: #dedede;

	-webkit-transition: all ease .5s;

	-moz-transition: all ease .5s;

	-ms-transition: all ease .5s;

	-o-transition: all ease .5s;

	transition: all ease .3s;

}



/* 方形、开关 */

.tt-switch {

	width: 50px;

	height: 28px;

	position: relative;

	line-height: 28px;

	z-index: 100;

	border: 1px solid #e6e6e6;

}

.tt-switch:before,.tt-switch:after {

	position: absolute;

	z-index: -10;

	top: 0;

	font-size: 12px;

}

.tt-switch:before {

	content: "开";

	line-height: 28px;

	left: 8px;

	top: -1px;

}

 .tt-switch:after {

	content: "关";

	line-height: 28px;

	right: 8px;

	top: -1px;

}

.tt-switch input[type="checkbox"] {

	-webkit-box-sizing: border-box;

	-moz-box-sizing: border-box;

	-ms-box-sizing: border-box;

	-o-box-sizing: border-box;

	box-sizing: border-box;

	padding: 0;

	margin: 0;

	width: 100%;

	height: 100%;

	opacity: 0;

}

.tt-switch input[type="checkbox"]:checked + span{

	-webkit-transform: translateX(25px);

	-moz-transform: translateX(25px);

	-ms-transform: translateX(25px);

	-o-transform: translateX(25px);

	transform: translateX(25px);

	background: #1AAD19;

}

.tt-switch-btn {

	position: absolute;

	z-index: -1;

	left: 0;

	top: -1px;

	width: 25px;

	height: 28px;

	background: #e6e6e6;

	-webkit-transition: all ease .5s;

	-moz-transition: all ease .5s;

	-ms-transition: all ease .5s;

	-o-transition: all ease .5s;

	transition: all ease .3s;

}



/* 方形、启用禁用 */

.ttt-switch {

	width: 80px;

	height: 28px;

	position: relative;

	line-height: 28px;

	z-index: 100;

	border: 1px solid #e6e6e6;

}

.ttt-switch:before,.ttt-switch:after {

	position: absolute;

	z-index: -10;

	top: 0;

	font-size: 12px;

}

.ttt-switch:before {

	content: "启用";

	line-height: 28px;

	left: 8px;

	top: -1px;

}

 .ttt-switch:after {

	content: "禁用";

	line-height: 28px;

	right: 8px;

	top: -1px;

}

.ttt-switch input[type="checkbox"] {

	-webkit-box-sizing: border-box;

	-moz-box-sizing: border-box;

	-ms-box-sizing: border-box;

	-o-box-sizing: border-box;

	box-sizing: border-box;

	padding: 0;

	margin: 0;

	width: 100%;

	height: 100%;

	opacity: 0;

}

.ttt-switch input[type="checkbox"]:checked + span{

	-webkit-transform: translateX(40px);

	-moz-transform: translateX(40px);

	-ms-transform: translateX(40px);

	-o-transform: translateX(40px);

	transform: translateX(40px);

	background: #1AAD19;

}

.ttt-switch-btn {

	position: absolute;

	z-index: -1;

	left: 0;

	top: -1px;

	width: 40px;

	height: 28px;

	background: #e6e6e6;

	-webkit-transition: all ease .5s;

	-moz-transition: all ease .5s;

	-ms-transition: all ease .5s;

	-o-transition: all ease .5s;

	transition: all ease .3s;

}



/* 方形、上架下架 */

.tttt-switch {

	width: 80px;

	height: 28px;

	position: relative;

	line-height: 28px;

	z-index: 100;

	border: 1px solid #e6e6e6;

}

.tttt-switch:before,.tttt-switch:after {

	position: absolute;

	z-index: -10;

	top: 0;

	font-size: 12px;

}

.tttt-switch:before {

	content: "上架";

	line-height: 28px;

	left: 8px;

	top: -1px;

}

 .tttt-switch:after {

	content: "下架";

	line-height: 28px;

	right: 8px;

	top: -1px;

}

.tttt-switch input[type="checkbox"] {

	-webkit-box-sizing: border-box;

	-moz-box-sizing: border-box;

	-ms-box-sizing: border-box;

	-o-box-sizing: border-box;

	box-sizing: border-box;

	padding: 0;

	margin: 0;

	width: 100%;

	height: 100%;

	opacity: 0;

}

.tttt-switch input[type="checkbox"]:checked + span{

	-webkit-transform: translateX(40px);

	-moz-transform: translateX(40px);

	-ms-transform: translateX(40px);

	-o-transform: translateX(40px);

	transform: translateX(40px);

	background: #1AAD19;

}

.tttt-switch-btn {

	position: absolute;

	z-index: -1;

	left: 0;

	top: -1px;

	width: 40px;

	height: 28px;

	background: #e6e6e6;

	-webkit-transition: all ease .5s;

	-moz-transition: all ease .5s;

	-ms-transition: all ease .5s;

	-o-transition: all ease .5s;

	transition: all ease .3s;

}