.scroll_tab_out_hide {
	width:25%;
	height:294px;
	overflow:hidden;
	margin:80px 0;
}
.scroll_tab_out {
	position:relative;
	height:100%;
	overflow:auto;
	margin:0 -18px 0 36px;
}
.scroll_tab {
	color:#000;
	font-size:18px;
}
.scroll_tab ul li {
	list-style-type:none;
	position:relative;
}
.scroll_tab_name {
	transform:scale(.8);
	-moz-transform:scale(.8);
	-webkit-transform:scale(.8);
	-o-transform:scale(.8);
	transform-origin:7px 7px;
	opacity:.7;
	transition:all .5s;
	-moz-transition:all .5s;
	/* Firefox 4 */
				-webkit-transition:all .5s;
	/* Safari 和 Chrome */
				-o-transition:all .5s;
	/* Opera */
}
.scroll_tab_name.active {
	transform:scale(1);
	-moz-transform:scale(1);
	-webkit-transform:scale(1);
	-o-transform:scale(1);
	opacity:1;
}
.scroll_tab_name .dot {
	position:absolute;
	top:50%;
	margin-top:-7px;
	width:14px;
	height:14px;
	border-radius:50%;
	background:#fff;
	border:3px solid #999;
	box-sizing:border-box;
}
.scroll_tab_name.active .dot {
	background:#00d4f9;
	border:3px solid #2e6c8d;
}
.scroll_tab_name.active .text {
	color:#00d4f9;
}
.scroll_tab_name .text {
	padding-left:20px;
}
.scroll_tab .nav {
	margin-left:6px;
	width:2px;
	height:40px;
	/* border-right:2px dashed #cd0000;
	*/
				box-sizing:border-box;
	border-right:2px dashed #4e4f54;
	transition:all .5s;
	-moz-transition:all .5s;
	/* Firefox 4 */
				-webkit-transition:all .5s;
	/* Safari 和 Chrome */
				-o-transition:all .5s;
	/* Opera */
}
@supports (-webkit-mask:none) or (mask:none) {
	.nav.bottom {
	border:none;
	/*margin-left:5px;
	*/
					background:linear-gradient(to bottom,#00d9ff,#4e4f54) no-repeat;
	-webkit-mask-image:linear-gradient(to right,#000 4px,transparent 4px),linear-gradient(to bottom,#000 4px,transparent 4px),linear-gradient(to right,#000 4px,transparent 4px),linear-gradient(to bottom,#000 4px,transparent 4px);
	-webkit-mask-repeat:repeat-x,repeat-y,repeat-x,repeat-y;
	-webkit-mask-position:0 0,0 0,0 100%,100% 0;
	-webkit-mask-size:8px 2px,2px 8px,8px 2px,2px 8px;
	/* 合并写法 */
					mask:linear-gradient(to right,#000 5px,transparent 5px) repeat-x,linear-gradient(to bottom,#000 5px,transparent 5px) repeat-y,linear-gradient(to right,#000 5px,transparent 5px) repeat-x 0 100%,linear-gradient(to bottom,#000 5px,transparent 5px) repeat-y 100% 0;
	mask-size:8px 2px,2px 8px,8px 2px,2px 8px;
}
.nav.top {
	border:none;
	/*margin-left:5px;
	*/
					background:linear-gradient(to bottom,#4e4f54,#00d9ff) no-repeat;
	-webkit-mask-image:linear-gradient(to right,#000 4px,transparent 4px),linear-gradient(to bottom,#000 4px,transparent 4px),linear-gradient(to right,#000 4px,transparent 4px),linear-gradient(to bottom,#000 4px,transparent 4px);
	-webkit-mask-repeat:repeat-x,repeat-y,repeat-x,repeat-y;
	-webkit-mask-position:0 0,0 0,0 100%,100% 0;
	-webkit-mask-size:8px 2px,2px 8px,8px 2px,2px 8px;
	/* 合并写法 */
					mask:linear-gradient(to right,#000 5px,transparent 5px) repeat-x,linear-gradient(to bottom,#000 5px,transparent 5px) repeat-y,linear-gradient(to right,#000 5px,transparent 5px) repeat-x 0 100%,linear-gradient(to bottom,#000 5px,transparent 5px) repeat-y 100% 0;
	mask-size:8px 2px,2px 8px,8px 2px,2px 8px;
}
}