﻿/*--下拉选择列表样式--*/
.index-option-text{
	position: absolute;
	top: 10px;
	left: 210px;
	z-index: 99999;
	text-align: center;
}
.index-option-text .select,.index-option-text .selectNext {
	cursor: pointer;
	position: relative;
	width: 43px;
	border-radius: 20px;
	font-size: 12px;
	line-height: 16px;
	color: #ffffff;
	text-align: left;
	padding-left: 7px;
	background-color: #ff5000;
	padding-bottom: 2px;
}
.index-option-text .xl-icon,.index-option-text .xl-iconNext {
	position: absolute;
	width: 20px;
	height: 20px;
	background-image:url(sj1.png);
	background-repeat: no-repeat;
	left: 40px;
	top: 5px;
}
.index-option-text .selectListNext {
	z-index: 99999;
	display: none;
	width: 100px;
	position: absolute;
	top: -10px;
	left: 62px;
	border-width: 1px;
  border-color: rgb(222, 222, 222);
  border-style: solid;
  border-radius: 6px;
  background-color: rgb(255, 255, 255);
  box-shadow: 0px 1px 4px 0px rgba(122, 122, 122, 0.15);
  box-sizing:border-box;
}
.index-option-text .listA,.index-option-text .listANext {
	width: 45%;
	float: left;
	font-size: .9rem;
	line-height: 1.57rem;
	color: #545454;
	text-align: center;
	display: block;
	padding-left: 4px;
	box-sizing: border-box;
}
.index-option-text .listA:hover,.index-option-text .listANext:hover {
	color: #b83b43;
}
.index-option-text .frameTriangle {
	width: 10px;
	height: 10px;
	background-image:url(sj.png);
	background-repeat: no-repeat;
	display: block;
	position: absolute;
	top: 15px;
	left: -6px;
}
.index-light-animate{
	cursor: pointer;
	position: absolute;
	left: 0;
	top: 0px;
	width: 15%;
	height: 100%;
	z-index: 99999;
	background-image: linear-gradient(0deg, rgba(255,255,255,0), rgba(255,255,255,0.7), rgba(255,255,255,0));
	background-image: -moz-linear-gradient(0deg, rgba(255,255,255,0), rgba(255,255,255,0.7), rgba(255,255,255,0));
	background-image: -webkit-linear-gradient(0deg, rgba(255,255,255,0), rgba(255,255,255,0.7), rgba(255,255,255,0));
	background-image: -o-linear-gradient(0deg, rgba(255,255,255,0), rgba(255,255,255,0.7), rgba(255,255,255,0));
	background-image: -ms-linear-gradient(0deg, rgba(255,255,255,0), rgba(255,255,255,0.7), rgba(255,255,255,0));
	transform: skewx(-25deg);
	-o-transform: skewx(-25deg);
	-moz-transform: skewx(-25deg);
	-webkit-transform: skewx(-25deg);
	-ms-transform: skewx(-25deg);
	animation: light_move 2.5s 1s infinite linear;
	-webkit-animation: light_move 2.5s 1s infinite linear;
	-moz-animation: light_move 2.5s 1s infinite linear;
	-o-animation: light_move 2.5s 1s infinite linear;
	-ms-animation: light_move 2.5s 1s infinite linear;
}
@keyframes light_move { 
    0% {left:0%;}
    30% {left:75%}
    75% {left:20%;}
    100% {left:75%;}
}


/* 媒体查询 */
@media screen and (max-width: 1024px) {
  @keyframes light_move { 
    0% {left:0%;}
	30% {left:70%}
	75% {left:20%;}
	100% {left:70%;}
	}
}
@media only screen and (min-width: 1024px) and (max-width: 1199px) {
    @keyframes light_move { 
        0% {left:0%;}
    	30% {left:70%}
    	75% {left:20%;}
    	100% {left:70%;}
	}
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
    @keyframes light_move { 
        0% {left:0%;}
	   30% {left:70%}
	   75% {left:20%;}
	   100% {left:70%;}
	}
}
@media screen and (min-width: 1400px) and (max-width: 1599px) {
    @keyframes light_move { 
        0% {left:0%;}
    	30% {left:70%}
    	75% {left:20%;}
    	100% {left:70%;}
	}
}
@media only screen and (min-width: 1600px) and (max-width: 1800px) {
    @keyframes light_move { 
        0% {left:0%;}
    	30% {left:70%}
    	75% {left:20%;}
    	100% {left:70%;}
	}
}
