@import "../default-skin.less";
@import "../../global/mixin.less";

// 分列
.c_list-col-5 {
	> ul > li { width:20%; min-width:20%; max-width:20%;}
	> ul > li.merge-2 { width:40%; min-width:40%; max-width:40%;}
	> ul > li.merge-3 { width:60%; min-width:60%; max-width:60%;}
	> ul > li.merge-4 { width:80%; min-width:80%; max-width:80%;}
	> ul > li.merge-5 { width:100%; min-width:100%; max-width:100%;}
}
.c_list-col-6 {
	> ul > li { width:16.66%; min-width:16.66%; max-width:16.66%;}
	> ul > li.merge-2 { width:33.33%; min-width:33.33%; max-width:33.33%;}
	> ul > li.merge-3 { width:50%; min-width:50%; max-width:50%;}
	> ul > li.merge-4 { width:66.66%; min-width:66.66%; max-width:66.66%;}
	> ul > li.merge-5 { width:83.33%; min-width:83.33%; max-width:83.33%;}
	> ul > li.merge-6 { width:100%; min-width:100%; max-width:100%;}
}
.c_list-col-7 {
	> ul > li { width:14.2%; min-width:14.2%; max-width:14.2%;}
	> ul > li.merge-2 { width:28.4%; min-width:28.4%; max-width:28.4%;}
	> ul > li.merge-3 { width:42.6%; min-width:42.6%; max-width:42.6%;}
	> ul > li.merge-4 { width:56.8%; min-width:56.8%; max-width:56.8%;}
	> ul > li.merge-5 { width:71%; min-width:71%; max-width:71%;}
	> ul > li.merge-6 { width:85.2%; min-width:85.2%; max-width:85.2%;}
	> ul > li.merge-7 { width:100%; min-width:100%; max-width:100%;}
}
.c_list-col-8 {
	> ul > li { width:12.5%; min-width:12.5%; max-width:12.5%;}
	> ul > li.merge-2 { width:25%; min-width:25%; max-width:25%;}
	> ul > li.merge-3 { width:37.5%; min-width:37.5%; max-width:37.5%;}
	> ul > li.merge-4 { width:50%; min-width:50%; max-width:50%;}
	> ul > li.merge-5 { width:62.5%; min-width:62.5%; max-width:62.5%;}
	> ul > li.merge-6 { width:75%; min-width:75%; max-width:75%;}
	> ul > li.merge-7 { width:87.5%; min-width:87.5%; max-width:87.5%;}
	> ul > li.merge-8 { width:100%; min-width:100%; max-width:100%;}
}
.c_list-col-9 {
	> ul > li { width:11.11%; min-width:11.11%; max-width:11.11%;}
	> ul > li.merge-2 { width:22.22%; min-width:22.22%; max-width:22.22%;}
	> ul > li.merge-3 { width:33.33%; min-width:33.33%; max-width:33.33%;}
	> ul > li.merge-4 { width:44.44%; min-width:44.44%; max-width:44.44%;}
	> ul > li.merge-5 { width:55.55%; min-width:55.55%; max-width:55.55%;}
	> ul > li.merge-6 { width:66.66%; min-width:66.66%; max-width:66.66%;}
	> ul > li.merge-7 { width:77.77%; min-width:77.77%; max-width:77.77%;}
	> ul > li.merge-8 { width:88.88%; min-width:88.88%; max-width:88.88%;}
	> ul > li.merge-9 { width:100%; min-width:100%; max-width:100%;}
}
.c_list-col-10 {
	> ul > li { width:10%; min-width:10%; max-width:10%;}
	> ul > li.merge-2 { width:20%; min-width:20%; max-width:20%;}
	> ul > li.merge-3 { width:30%; min-width:30%; max-width:30%;}
	> ul > li.merge-4 { width:40%; min-width:40%; max-width:40%;}
	> ul > li.merge-5 { width:50%; min-width:50%; max-width:50%;}
	> ul > li.merge-6 { width:60%; min-width:60%; max-width:60%;}
	> ul > li.merge-7 { width:70%; min-width:70%; max-width:70%;}
	> ul > li.merge-8 { width:80%; min-width:80%; max-width:80%;}
	> ul > li.merge-9 { width:90%; min-width:90%; max-width:90%;}
	> ul > li.merge-10 { width:100%; min-width:100%; max-width:100%;}
}




.s_pc {
	.c_list {
		> ul > li > .op {
			li:hover { background:@bg-op-5;}
		}
		> ul > li > .op-float {
			background:none;
			li:hover { background:@bg-dark-0-4;}
		}
		.link:not(.checked):hover {
			background-color:@bg-dark-0-7;
			.pic { opacity:0.6;}
		}
		> ul > li > .content > .fn,
		> ul > li > .group > .fn,
		> ul > li > .group > .content > .fn,
		> ul > li > .sub > .fn,
		> ul > li > .fn {
			&:hover { background:rgba(0,0,0,0.05);}
		}
		> ul > li > label .fn:hover { background:transparent;}
		> ul > li > .group > .value,
		> ul > li > .content > .value,
		> ul > li > .sub > .value,
		> ul > li > .value .e_mix {
			.e_select {
				&:hover { background:@bg-dark-0-7;}
			}
		}
		> ul > li > .value .e_mix > [class^="e_ico"]:hover { background:rgba(0,0,0,0.05);}
		> ul > .blue.link:hover { background:@primary-light-3 !important;}
		> ul > .red.link:hover { background:@danger-light-3 !important;}
		> ul > .green.link:hover { background:@success-light-3 !important;}
		> ul > .orange.link:hover { background:@warning-light-2 !important;}
		> ul > .gray.link:hover { background:@bg-dark-0-7 !important;}
		> ul > .blue .link:hover { background:@primary-light-3 !important;}
		> ul > .red .link:hover { background:@danger-light-3 !important;}
		> ul > .green .link:hover { background:@success-light-3 !important;}
		> ul > .orange .link:hover { background:@warning-light-2 !important;}
		> ul > .gray .link:hover { background:@bg !important;}
		> ul > li.link:hover {
			.cover { transform:translateY(0);}
		}
		> ul > li .side-float { position:absolute; top:0.36em; right:0;}
		> ul > li > .op-float {
			position:absolute; bottom:0; right:0; width:auto; left:0; color:@fg;
			ul { transform:translateY(100%); background:@bg-op-9; border-top:1px solid @fg-light-9; transition:transform 0.1s ease-out;}
		}
		> ul > li:hover > .op-float {
			ul { transform:translateY(0%);}
		}
	}
	.c_list-blue {
		> ul .link:not(.checked):not(.on):hover { background:@primary-light-3;}
	}
	.c_list-red {
		> ul .link:not(.checked):not(.on):hover { background:@danger-light-3;}
	}
	.c_list-green {
		> ul .link:not(.checked):not(.on):hover { background:@success-light-3;}
	}
	.c_list-orange {
		> ul .link:not(.checked):not(.on):hover { background:@warning-light-2;}
	}
	.c_list-gray {
		> ul .link:not(.checked):not(.on):hover { background-color:@bg-dark-0-7;}
	}
	.c_list-space {
		> ul > li > .op-float { left:0.5*@gap*1.167;}
		> ul > li.link:not(.checked):not(.on):hover { background:linear-gradient(90deg,rgba(0,0,0,0) 0, rgba(0,0,0,0) 0.5*@gap, @bg-dark-0-7 0.5*@gap, @bg-dark-0-7 100%);}
		> ul > .blue.link:hover { background:linear-gradient(90deg,rgba(0,0,0,0) 0, rgba(0,0,0,0) 0.5*@gap, @primary-light-3 0.5*@gap, @primary-light-3 100%) !important;}
		> ul > .red.link:hover { background:linear-gradient(90deg,rgba(0,0,0,0) 0, rgba(0,0,0,0) 0.5*@gap, @danger-light-3 0.5*@gap, @danger-light-3 100%) !important;}
		> ul > .orange.link:hover { background:linear-gradient(90deg,rgba(0,0,0,0) 0, rgba(0,0,0,0) 0.5*@gap, @warning-light-2 0.5*@gap, @warning-light-2 100%) !important;}
		> ul > .green.link:hover { background:linear-gradient(90deg,rgba(0,0,0,0) 0, rgba(0,0,0,0) 0.5*@gap, @success-light-3 0.5*@gap, @success-light-3 100%) !important;}
		> ul > .gray.link:hover { background:linear-gradient(90deg,rgba(0,0,0,0) 0, rgba(0,0,0,0) 0.5*@gap, @bg 0.5*@gap, @bg 100%) !important;}
	}
	.c_list-blue.c_list-space {
		> ul .link:not(.checked):not(.on):hover { background:linear-gradient(90deg,rgba(0,0,0,0) 0, rgba(0,0,0,0) 0.5*@gap, @primary-light-3 0.5*@gap, @primary-light-3 100%);}
	}
	.c_list-red.c_list-space {
		> ul .link:not(.checked):not(.on):hover { background:linear-gradient(90deg,rgba(0,0,0,0) 0, rgba(0,0,0,0) 0.5*@gap, @danger-light-3 0.5*@gap, @danger-light-3 100%);}
	}
	.c_list-orange.c_list-space {
		> ul .link:not(.checked):not(.on):hover { background:linear-gradient(90deg,rgba(0,0,0,0) 0, rgba(0,0,0,0) 0.5*@gap, @warning-light-2 0.5*@gap, @warning-light-2 100%);}
	}
	.c_list-green.c_list-space {
		> ul .link:not(.checked):not(.on):hover { background:linear-gradient(90deg,rgba(0,0,0,0) 0, rgba(0,0,0,0) 0.5*@gap, @success-light-3 0.5*@gap, @success-light-3 100%);}
	}
	.c_list-gray.c_list-space {
		> ul .link:not(.checked):not(.on):hover { background:linear-gradient(90deg,rgba(0,0,0,0) 0, rgba(0,0,0,0) 0.5*@gap, @bg-dark-0-7 0.5*@gap, @bg-dark-0-7 100%);}
	}
	.c_list-hideFn {
		> ul > li > .content > .fn,
		> ul > li > .sub > .fn,
		> ul > li > .fn { display:none;}
		> ul > li:hover > .content > .fn,
		> ul > li:hover > .sub > .fn,
		> ul > li:hover > .fn { display:block;}
	}
	.c_list-hideSide {
		> ul > li > .content > .side,
		> ul > li > .sub > .side,
		> ul > li > .side { display:none;}
		> ul > li:hover > .content > .side,
		> ul > li:hover > .sub > .side,
		> ul > li:hover > .side { display:block;}
	}
	.c_list-hideFn.c_list-v {
		> ul > li > .content > .fn,
		> ul > li > .sub > .fn,
		> ul > li > .fn { display:block; visibility:hidden;}
	}
	.c_list-hideFn.c_list-v {
		> ul > li:hover > .content > .fn,
		> ul > li:hover > .sub > .fn,
		> ul > li:hover > .fn { visibility:visible;}
	}
	.c_list-pc-s {
		font-size:85.71%;
	}
}