/*-----------------------------------------------------------*/ /*copyright by 动力无限 www.btoe.cn*/ /*邮箱 btoe@btoe.cn*/ /*合作电话 400-0599-360*/ /*版权所有违者必究*/ /*-----------------------------------------------------------*/ /*Generated by wjdhcms 3.0 */ @charset "utf-8"; ::-webkit-scrollbar { width: 8px; height: 8px; background-color: #F5F5F5; } ::-webkit-scrollbar-track { border-radius: 10px; background-color: #E2E2E2; } button{outline:none;} ::-webkit-scrollbar-thumb { border-radius: 10px; -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3); box-shadow: inset 0 0 6px rgba(0, 0, 0, .3); background-color: #555; } ::selection { background-color: #93be4c; color: #fff; } ::-moz-selection { background-color: #93be4c; color: #fff; } ::-webkit-selection { background-color: #93be4c; color: #fff; } * { padding: 0; margin: 0; font-family: 'Microsoft YaHei', arial, helvetica, clean, sans-serif; } body { font: 14px/1.231 'Microsoft YaHei', arial, helvetica, clean, sans-serif; margin: 0; line-height: 1.5; } *:before, *:after { box-sizing: content-box; } :focus { outline: 1; } article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary { display: block; } a { text-decoration: none; } a:link, a:hover, a:active, a:visited { text-decoration: none; } ins { background-color: #ff9; color: #000; text-decoration: none; } mark { background-color: #ff9; color: #000; font-style: italic; font-weight: bold; } del { text-decoration: line-through; } table { border-collapse: collapse; border-spacing: 0; } hr { display: block; height: 1px; border: 0; border-top: 1px solid #cccccc; margin: 1em 0; padding: 0; } input, select { vertical-align: middle; } li, ul { list-style-type: none; } img { border: none; } input,textarea { outline: 0; border: 0; resize: none; } h1, h2, h3, h4, h5, h6, dl, dd, dt, i, em { font-weight: normal; font-style: normal; } .fixedNav { position: fixed; top: 0px; left: 0px; width: 100%; z-index: 100000; _position: absolute; _top: expression(eval(document.documentElement.scrollTop)); box-shadow: 0px 10px 12px rgba(0,0,0,.1); } html{ cursor: url(../images/cur.png), default; } a{ cursor: url(../images/Acur.png), default ; } textarea{ animation: animated 1s infinite; -moz-animation: animated 1s infinite; -webkit-animation: animated 1s infinite; -o-animation: animated 1s infinite; } input[type="text"]{ animation: animated 1s infinite; -moz-animation: animated 1s infinite; -webkit-animation: animated 1s infinite; -o-animation: animated 1s infinite; } input[type="button"] { cursor: url(../images/Acur.png), default !important; } @keyframes animated { 0% { cursor: url('../images/Pcuro1.png'), auto; } 8.8% { cursor: url('../images/Pcuro2.png'), auto; } 17.6% { cursor: url('../images/Pcuro3.png'), auto; } 26.4% { cursor: url('../images/Pcuro4.png'), auto; } 35.2% { cursor: url('../images/Pcuro5.png'), auto; } 44% { cursor: url('../images/Pcuro6.png'), auto; } 52.8% { cursor: url('../images/Pcuro7.png'), auto; } 61.6% { cursor: url('../images/Pcuro8.png'), auto; } 70.4% { cursor: url('../images/Pcuro9.png'), auto; } 79.2% { cursor: url('../images/Pcuro10.png'), auto; } 88% { cursor: url('../images/Pcuro11.png'), auto; } 100% { cursor: url('../images/Pcuro12.png'), auto; } } .box_01{width:100%;overflow: hidden;height:800px;position:relative;} /* nav */ .header{width:300px;height:800px;position:absolute;left:0;top:0;z-index:999;background:rgba(255,255,255,0.9);} .header .center{width:300px;height:800px;} .header .header1{width:300px;height:800px;position: relative;} .header .header1 .logo{width:300px;height:129px;border-bottom:solid 1px rgba(147,190,76,0.2);} .header .header1 .logo > h1{width:242px;height:80px;padding-top:24px;margin:0 auto;text-align: center;box-sizing:content-box;} .header .header1 .logo > h1 img{display:block;width:242px;height:80px;margin:0 auto;} .header1 .webq_head_xx{position:absolute;width:300px;height:620px;left:0;bottom:0;z-index: 99;} .header1 .nav_xiala{width:300px;height:620px;margin: 0 auto;} .header1 .nav_xiala ul li{width:300px;height:40px;margin-bottom:30px;position:relative;-webkit-transition: all .5s; transition: all .5s;} .header1 .nav_xiala ul li:last-child{margin-bottom:0;} .header1 .nav_xiala > ul > li > a{display:block;width:215px;padding-left:85px;box-sizing:content-box;position:relative;-webkit-transition: all .5s; transition: all .5s;} .header1 .nav_xiala > ul > li > a::after{content:'';width:111px;height:11px;background:url(../images/nav_on.png);position:absolute;top:0;right:25px;opacity:0;-webkit-transition:all .7s;transition:all .7s;} .header1 .nav_xiala > ul > li:hover > a::after{content:'';width:111px;height:11px;background:url(../images/nav_on.png);position:absolute;top:6px;right:25px;opacity:1;-webkit-transition:all .7s;transition:all .7s;} .header1 .nav_xiala > ul > li.active > a::after{content:'';width:111px;height:11px;background:url(../images/nav_on.png);position:absolute;top:6px;right:25px;opacity:1;-webkit-transition:all .7s;transition:all .7s;} .header1 .nav_xiala > ul > li:nth-of-type(1) > a::before{content:'';width:24px;height:20px;background:url(../images/nav_icon_01.png) center center no-repeat;position:absolute;top:0;left:50px;-webkit-transition:all .7s;transition:all .7s;} .header1 .nav_xiala > ul > li:nth-of-type(1):hover > a::before{content:'';width:24px;height:20px;background:url(../images/nav_icon_02.png) center center no-repeat;position:absolute;top:0;left:50px;-webkit-transition:all .7s;transition:all .7s;} .header1 .nav_xiala > ul > li:nth-of-type(1).active > a::before{content:'';width:24px;height:20px;background:url(../images/nav_icon_02.png) center center no-repeat;position:absolute;top:0;left:50px;-webkit-transition:all .7s;transition:all .7s;} .header1 .nav_xiala > ul > li:nth-of-type(2) > a::before{content:'';width:24px;height:20px;background:url(../images/nav_icon_03.png) center center no-repeat;position:absolute;top:0;left:50px;-webkit-transition:all .7s;transition:all .7s;} .header1 .nav_xiala > ul > li:nth-of-type(2):hover > a::before{content:'';width:24px;height:20px;background:url(../images/nav_icon_04.png) center center no-repeat;position:absolute;top:0;left:50px;-webkit-transition:all .7s;transition:all .7s;} .header1 .nav_xiala > ul > li:nth-of-type(2).active > a::before{content:'';width:24px;height:20px;background:url(../images/nav_icon_04.png) center center no-repeat;position:absolute;top:0;left:50px;-webkit-transition:all .7s;transition:all .7s;} .header1 .nav_xiala > ul > li:nth-of-type(3) > a::before{content:'';width:24px;height:20px;background:url(../images/nav_icon_05.png) center center no-repeat;position:absolute;top:0;left:50px;-webkit-transition:all .7s;transition:all .7s;} .header1 .nav_xiala > ul > li:nth-of-type(3):hover > a::before{content:'';width:24px;height:20px;background:url(../images/nav_icon_06.png) center center no-repeat;position:absolute;top:0;left:50px;-webkit-transition:all .7s;transition:all .7s;} .header1 .nav_xiala > ul > li:nth-of-type(3).active > a::before{content:'';width:24px;height:20px;background:url(../images/nav_icon_06.png) center center no-repeat;position:absolute;top:0;left:50px;-webkit-transition:all .7s;transition:all .7s;} .header1 .nav_xiala > ul > li:nth-of-type(4) > a::before{content:'';width:24px;height:20px;background:url(../images/nav_icon_07.png) center center no-repeat;position:absolute;top:0;left:50px;-webkit-transition:all .7s;transition:all .7s;} .header1 .nav_xiala > ul > li:nth-of-type(4):hover > a::before{content:'';width:24px;height:20px;background:url(../images/nav_icon_08.png) center center no-repeat;position:absolute;top:0;left:50px;-webkit-transition:all .7s;transition:all .7s;} .header1 .nav_xiala > ul > li:nth-of-type(4).active > a::before{content:'';width:24px;height:20px;background:url(../images/nav_icon_08.png) center center no-repeat;position:absolute;top:0;left:50px;-webkit-transition:all .7s;transition:all .7s;} .header1 .nav_xiala > ul > li:nth-of-type(5) > a::before{content:'';width:24px;height:20px;background:url(../images/nav_icon_09.png) center center no-repeat;position:absolute;top:0;left:50px;-webkit-transition:all .7s;transition:all .7s;} .header1 .nav_xiala > ul > li:nth-of-type(5):hover > a::before{content:'';width:24px;height:20px;background:url(../images/nav_icon_10.png) center center no-repeat;position:absolute;top:0;left:50px;-webkit-transition:all .7s;transition:all .7s;} .header1 .nav_xiala > ul > li:nth-of-type(5).active > a::before{content:'';width:24px;height:20px;background:url(../images/nav_icon_10.png) center center no-repeat;position:absolute;top:0;left:50px;-webkit-transition:all .7s;transition:all .7s;} .header1 .nav_xiala > ul > li:nth-of-type(6) > a::before{content:'';width:24px;height:20px;background:url(../images/nav_icon_11.png) center center no-repeat;position:absolute;top:0;left:50px;-webkit-transition:all .7s;transition:all .7s;} .header1 .nav_xiala > ul > li:nth-of-type(6):hover > a::before{content:'';width:24px;height:20px;background:url(../images/nav_icon_12.png) center center no-repeat;position:absolute;top:0;left:50px;-webkit-transition:all .7s;transition:all .7s;} .header1 .nav_xiala > ul > li:nth-of-type(6).active > a::before{content:'';width:24px;height:20px;background:url(../images/nav_icon_12.png) center center no-repeat;position:absolute;top:0;left:50px;-webkit-transition:all .7s;transition:all .7s;} .header1 .nav_xiala > ul > li:nth-of-type(7) > a::before{content:'';width:24px;height:20px;background:url(../images/nav_icon_13.png) center center no-repeat;position:absolute;top:0;left:50px;-webkit-transition:all .7s;transition:all .7s;} .header1 .nav_xiala > ul > li:nth-of-type(7):hover > a::before{content:'';width:24px;height:20px;background:url(../images/nav_icon_14.png) center center no-repeat;position:absolute;top:0;left:50px;-webkit-transition:all .7s;transition:all .7s;} .header1 .nav_xiala > ul > li:nth-of-type(7).active > a::before{content:'';width:24px;height:20px;background:url(../images/nav_icon_14.png) center center no-repeat;position:absolute;top:0;left:50px;-webkit-transition:all .7s;transition:all .7s;} .header1 .nav_xiala > ul > li:nth-of-type(8) > a::before{content:'';width:24px;height:20px;background:url(../images/nav_icon_15.png) center center no-repeat;position:absolute;top:0;left:50px;-webkit-transition:all .7s;transition:all .7s;} .header1 .nav_xiala > ul > li:nth-of-type(8):hover > a::before{content:'';width:24px;height:20px;background:url(../images/nav_icon_16.png) center center no-repeat;position:absolute;top:0;left:50px;-webkit-transition:all .7s;transition:all .7s;} .header1 .nav_xiala > ul > li:nth-of-type(8).active > a::before{content:'';width:24px;height:20px;background:url(../images/nav_icon_16.png) center center no-repeat;position:absolute;top:0;left:50px;-webkit-transition:all .7s;transition:all .7s;} .header1 .nav_xiala > ul > li:nth-of-type(9) > a::before{content:'';width:24px;height:20px;background:url(../images/nav_icon_17.png) center center no-repeat;position:absolute;top:0;left:50px;-webkit-transition:all .7s;transition:all .7s;} .header1 .nav_xiala > ul > li:nth-of-type(9):hover > a::before{content:'';width:24px;height:20px;background:url(../images/nav_icon_18.png) center center no-repeat;position:absolute;top:0;left:50px;-webkit-transition:all .7s;transition:all .7s;} .header1 .nav_xiala > ul > li:nth-of-type(9).active > a::before{content:'';width:24px;height:20px;background:url(../images/nav_icon_18.png) center center no-repeat;position:absolute;top:0;left:50px;-webkit-transition:all .7s;transition:all .7s;} .header1 .nav_xiala > ul > li > a p{font-size:16px;color:#333;line-height:20px;-webkit-transition:all .7s;transition:all .7s;} .header1 .nav_xiala > ul > li:hover > a p{color:#93be4c;font-weight:bold;-webkit-transition: all .5s; transition: all .5s;} .header1 .nav_xiala > ul > li.active > a p{color:#93be4c;font-weight:bold;-webkit-transition: all .5s; transition: all .5s;} .header1 .nav_xiala > ul > li > a span{display:block;font-size:14px;color:#93be4c;line-height:15px;margin-top:5px;opacity:0;-webkit-transition:all .7s;transition:all .7s;} .header1 .nav_xiala > ul > li:hover > a span{opacity:1;-webkit-transition: all .5s; transition: all .5s;} .header1 .nav_xiala > ul > li.active > a span{opacity:1;-webkit-transition: all .5s; transition: all .5s;} .nav_xiala .erji_xiala{ position:absolute; top:0; left: 100%; z-index:20; height:0px; visibility: hidden;width:180px; /*和一级栏目一样宽度*/ } .nav_xiala .erji_xiala i{ display: block; opacity: 0;background:rgba(11,11,11,0.4);position:relative; } .nav_xiala .erji_xiala i a{ height:65px;line-height:65px;font-size:14px;display: block;color:#fff;padding:0 10px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .nav_xiala .erji_xiala i a:hover{ color:#FFF; } .nav_xiala .erji_xiala i:hover{ background:rgba(147,190,76,0.8); } .nav_xiala .erji_xiala i a{ background: -webkit-linear-gradient(left, rgba(147,190,76,0.8), rgba(147,190,76,0.8)) no-repeat; background: linear-gradient(to right, rgba(147,190,76,0.8), rgba(147,190,76,0.8)) no-repeat; background-size: 0% 100%; -webkit-transition: all .5s; transition: all .5s; } .nav_xiala .erji_xiala i a:hover{ background: -webkit-linear-gradient(left, rgba(147,190,76,0.8), rgba(147,190,76,0.8)) no-repeat; background: linear-gradient(to right, rgba(147,190,76,0.8), rgba(147,190,76,0.8)) no-repeat; background-size: 100% 100%; } .nav_xiala ul li:hover .erji_xiala{ height:auto; visibility: visible; } .nav_xiala .erji_xiala i{ opacity: 0; transform: rotateY(90deg); transition:.5s;} .nav_xiala ul li:hover .erji_xiala i{ opacity: 1; transform: rotateY(0); } .nav_xiala ul li:hover .erji_xiala i:nth-child(1){ transition-delay: 50ms;} .nav_xiala ul li:hover .erji_xiala i:nth-child(2){ transition-delay: 100ms;} .nav_xiala ul li:hover .erji_xiala i:nth-child(3){ transition-delay: 150ms;} .nav_xiala ul li:hover .erji_xiala i:nth-child(4){ transition-delay: 200ms;} .nav_xiala ul li:hover .erji_xiala i:nth-child(5){ transition-delay: 250ms;} .nav_xiala ul li:hover .erji_xiala i:nth-child(6){ transition-delay: 300ms;} .nav_xiala ul li:hover .erji_xiala i:nth-child(7){ transition-delay: 350ms;} .nav_xiala ul li:hover .erji_xiala i:nth-child(8){ transition-delay: 400ms;} .nav_xiala ul li:hover .erji_xiala i:nth-child(9){ transition-delay: 450ms;} .nav_xiala ul li:hover .erji_xiala i:nth-child(10){ transition-delay: 500ms;} .nav_xiala .erji_xiala i:nth-child(1){ transition-delay: 500ms;} .nav_xiala .erji_xiala i:nth-child(2){ transition-delay: 450ms;} .nav_xiala .erji_xiala i:nth-child(3){ transition-delay: 400ms;} .nav_xiala .erji_xiala i:nth-child(4){ transition-delay: 350ms;} .nav_xiala .erji_xiala i:nth-child(5){ transition-delay: 300ms;} .nav_xiala .erji_xiala i:nth-child(6){ transition-delay: 250ms;} .nav_xiala .erji_xiala i:nth-child(7){ transition-delay: 200ms;} .nav_xiala .erji_xiala i:nth-child(8){ transition-delay: 150ms;} .nav_xiala .erji_xiala i:nth-child(9){ transition-delay: 100ms;} .nav_xiala .erji_xiala i:nth-child(10){ transition-delay: 50ms;} .nav_xiala .sanji_xiala { width: 165px; height:0; visibility: hidden; position: absolute; top: 0px; left:180px; /*和一级栏目一样left*/ } .nav_xiala .sanji_xiala span{border-bottom:1px dashed rgba(255,255,255,0.35); display: block; background:rgba(11,11,11,0.4); text-align: left; opacity: 0; } .nav_xiala .sanji_xiala span a { height:65px; line-height: 65px; display: block; color:#FFF; font-size:14px; padding-left: 10px; padding: 0 8px 0 15px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .nav_xiala .sanji_xiala span a:hover{ color:#FFF; padding-left: 25px; } .nav_xiala .sanji_xiala span a{ background: -webkit-linear-gradient(left, rgba(147,190,76,0.8), rgba(147,190,76,0.8)) no-repeat; background: linear-gradient(to right, rgba(147,190,76,0.8), rgba(147,190,76,0.8)) no-repeat; background-size: 100% 0%; -webkit-transition: all .5s; transition: all .5s; } .nav_xiala .sanji_xiala span a:hover{ background: -webkit-linear-gradient(left, rgba(147,190,76,0.8), rgba(147,190,76,0.8)) no-repeat; background: linear-gradient(to right, rgba(147,190,76,0.8), rgba(147,190,76,0.8)) no-repeat; background-size: 100% 100%; } .nav_xiala .sanji_xiala_di{ background:url(../images/liqsub_ss.png) no-repeat center; width: 7px; height: 11px; position: absolute; top:27px; right: 5px;} .nav_xiala .erji_xiala i:hover .sanji_xiala{ height:auto; visibility: visible; } .nav_xiala .sanji_xiala span{ opacity: 0; transform: rotateY(90deg); transition:.5s;} .nav_xiala .erji_xiala i:hover .sanji_xiala span{ opacity: 1; transform: rotateY(0); } .nav_xiala .erji_xiala i:hover .sanji_xiala span:nth-child(1){ transition-delay: 50ms;} .nav_xiala .erji_xiala i:hover .sanji_xiala span:nth-child(2){ transition-delay: 100ms;} .nav_xiala .erji_xiala i:hover .sanji_xiala span:nth-child(3){ transition-delay: 150ms;} .nav_xiala .erji_xiala i:hover .sanji_xiala span:nth-child(4){ transition-delay: 200ms;} .nav_xiala .erji_xiala i:hover .sanji_xiala span:nth-child(5){ transition-delay: 250ms;} .nav_xiala .erji_xiala i:hover .sanji_xiala span:nth-child(6){ transition-delay: 300ms;} .nav_xiala .erji_xiala i:hover .sanji_xiala span:nth-child(7){ transition-delay: 350ms;} .nav_xiala .erji_xiala i:hover .sanji_xiala span:nth-child(8){ transition-delay: 400ms;} .nav_xiala .erji_xiala i:hover .sanji_xiala span:nth-child(9){ transition-delay: 450ms;} .nav_xiala .erji_xiala i:hover .sanji_xiala span:nth-child(10){ transition-delay: 500ms;} .fixedNav{width:100%;height:80px;background:rgba(255,255,255,0.9);z-index:9;} .fixedNav .nav_xiala{width:1280px;padding-top:0;height:80px;margin:0 auto;position:absolute;left:50%;margin-left:-640px;} .fixedNav .nav_xiala ul{display:flex;justify-content: space-between;} .fixedNav .nav_xiala ul li{ float:left; width:auto;font-size:15px;height:80px;text-align:center;position:relative;padding:0;margin-bottom:0;-webkit-transition: all .5s; transition: all .5s;} .fixedNav .nav_xiala > ul > li > a{width:auto;padding:0 !important;display:block;height:80px;overflow: hidden;position:relative;-webkit-transition: all .5s; transition: all .5s;} .fixedNav .nav_xiala > ul > li:hover > a{ background:none;} .fixedNav .nav_xiala > ul > li:nth-of-type(1) > a::before{content:'';width:0;height:0;background:none;} .fixedNav .nav_xiala > ul > li:nth-of-type(1):hover > a::before{content:'';width:0;height:0;background:none;} .fixedNav .nav_xiala > ul > li:nth-of-type(1).active > a::before{content:'';width:0;height:0;background:none;} .fixedNav .nav_xiala > ul > li:nth-of-type(2) > a::before{content:'';width:0;height:0;background:none;} .fixedNav .nav_xiala > ul > li:nth-of-type(2):hover > a::before{content:'';width:0;height:0;background:none;} .fixedNav .nav_xiala > ul > li:nth-of-type(2).active > a::before{content:'';width:0;height:0;background:none;} .fixedNav .nav_xiala > ul > li:nth-of-type(3) > a::before{content:'';width:0;height:0;background:none;} .fixedNav .nav_xiala > ul > li:nth-of-type(3):hover > a::before{content:'';width:0;height:0;background:none;} .fixedNav .nav_xiala > ul > li:nth-of-type(3).active > a::before{content:'';width:0;height:0;background:none;} .fixedNav .nav_xiala > ul > li:nth-of-type(4) > a::before{content:'';width:0;height:0;background:none;} .fixedNav .nav_xiala > ul > li:nth-of-type(4):hover > a::before{content:'';width:0;height:0;background:none;} .fixedNav .nav_xiala > ul > li:nth-of-type(4).active > a::before{content:'';width:0;height:0;background:none;} .fixedNav .nav_xiala > ul > li:nth-of-type(5) > a::before{content:'';width:0;height:0;background:none;} .fixedNav .nav_xiala > ul > li:nth-of-type(5):hover > a::before{content:'';width:0;height:0;background:none;} .fixedNav .nav_xiala > ul > li:nth-of-type(5).active > a::before{content:'';width:0;height:0;background:none;} .fixedNav .nav_xiala > ul > li:nth-of-type(6) > a::before{content:'';width:0;height:0;background:none;} .fixedNav .nav_xiala > ul > li:nth-of-type(6):hover > a::before{content:'';width:0;height:0;background:none;} .fixedNav .nav_xiala > ul > li:nth-of-type(6).active > a::before{content:'';width:0;height:0;background:none;} .fixedNav .nav_xiala > ul > li:nth-of-type(7) > a::before{content:'';width:0;height:0;background:none;} .fixedNav .nav_xiala > ul > li:nth-of-type(7):hover > a::before{content:'';width:0;height:0;background:none;} .fixedNav .nav_xiala > ul > li:nth-of-type(7).active > a::before{content:'';width:0;height:0;background:none;} .fixedNav .nav_xiala > ul > li:nth-of-type(8) > a::before{content:'';width:0;height:0;background:none;} .fixedNav .nav_xiala > ul > li:nth-of-type(8):hover > a::before{content:'';width:0;height:0;background:none;} .fixedNav .nav_xiala > ul > li:nth-of-type(8).active > a::before{content:'';width:0;height:0;background:none;} .fixedNav .nav_xiala > ul > li:nth-of-type(9) > a::before{content:'';width:0;height:0;background:none;} .fixedNav .nav_xiala > ul > li:nth-of-type(9):hover > a::before{content:'';width:0;height:0;background:none;} .fixedNav .nav_xiala > ul > li:nth-of-type(9).active > a::before{content:'';width:0;height:0;background:none;} .fixedNav .nav_xiala > ul > li > a::after{content:'';width:0;height:2px;background:#93be4c;position:absolute;top:70px;right:0;-webkit-transition:all .7s;transition:all .7s;} .fixedNav .nav_xiala > ul > li:hover > a::after{content:'';width:100%;height:2px;background:#93be4c;position:absolute;top:70px;right:0;-webkit-transition:all .7s;transition:all .7s;} .fixedNav .nav_xiala > ul > li.active > a::after{content:'';width:100%;height:2px;background:#93be4c;position:absolute;top:70px;right:0;-webkit-transition:all .7s;transition:all .7s;} .fixedNav .nav_xiala > ul > li > a p{font-size:16px;color:#333;line-height:20px;margin-top:15px;-webkit-transition:all .7s;transition:all .7s;} .fixedNav .nav_xiala > ul > li:hover > a p{color:#93be4c;font-weight:bold;-webkit-transition: all .5s; transition: all .5s;} .fixedNav .nav_xiala > ul > li.active > a p{color:#93be4c;font-weight:bold;-webkit-transition: all .5s; transition: all .5s;} .fixedNav .nav_xiala > ul > li > a span{display:block;font-size:14px;color:#999;line-height:15px;margin-top:5px;opacity:1;-webkit-transition:all .7s;transition:all .7s;} .fixedNav .nav_xiala > ul > li:hover > a span{color:#93be4c;-webkit-transition: all .5s; transition: all .5s;} .fixedNav .nav_xiala > ul > li.active > a span{color:#93be4c;-webkit-transition: all .5s; transition: all .5s;} .fixedNav .nav_xiala .erji_xiala{ position:absolute; top:80px; left: 0px; z-index:20; height:0px; visibility: hidden; width:150px; /*和一级栏目一样宽度*/ } .fixedNav .nav_xiala .erji_xiala i{ display: block; opacity: 0; border-bottom:1px solid rgba(255,255,255,0.35); background:rgba(11,11,11,1); position:relative; } .fixedNav .nav_xiala .erji_xiala i a{ height: 40px; line-height: 40px; font-size:14px; display: block; color:#FFF; padding: 0 20px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .fixedNav .nav_xiala .erji_xiala i a:hover{ color:#FFF; } .fixedNav .nav_xiala .erji_xiala i:hover{background:rgba(210,153,71,1); } .nav_xiala .erji_xiala i a{ background-size: 0% 100%; -webkit-transition: all .5s; transition: all .5s; } .fixedNav .nav_xiala .erji_xiala i a:hover{ background: -webkit-linear-gradient(left, rgba(210,153,71,1), rgba(210,153,71,1)) no-repeat; background: linear-gradient(to right, rgba(210,153,71,1), rgba(210,153,71,1)) no-repeat; background-size: 100% 100%; } .fixedNav .nav_xiala ul li:hover .erji_xiala{ height:auto; visibility: visible; } .fixedNav .nav_xiala .erji_xiala i{ opacity: 0; transform: rotateY(90deg); transition:.5s;} .fixedNav .nav_xiala ul li:hover .erji_xiala i{ opacity: 1; transform: rotateY(0); } .fixedNav .nav_xiala ul li:hover .erji_xiala i:nth-child(1){ transition-delay: 50ms;} .fixedNav .nav_xiala ul li:hover .erji_xiala i:nth-child(2){ transition-delay: 100ms;} .fixedNav .nav_xiala ul li:hover .erji_xiala i:nth-child(3){ transition-delay: 150ms;} .fixedNav .nav_xiala ul li:hover .erji_xiala i:nth-child(4){ transition-delay: 200ms;} .fixedNav .nav_xiala ul li:hover .erji_xiala i:nth-child(5){ transition-delay: 250ms;} .fixedNav .nav_xiala ul li:hover .erji_xiala i:nth-child(6){ transition-delay: 300ms;} .fixedNav .nav_xiala ul li:hover .erji_xiala i:nth-child(7){ transition-delay: 350ms;} .fixedNav .nav_xiala ul li:hover .erji_xiala i:nth-child(8){ transition-delay: 400ms;} .fixedNav .nav_xiala ul li:hover .erji_xiala i:nth-child(9){ transition-delay: 450ms;} .fixedNav .nav_xiala ul li:hover .erji_xiala i:nth-child(10){ transition-delay: 500ms;} .fixedNav .nav_xiala .erji_xiala i:nth-child(1){ transition-delay: 500ms;} .fixedNav .nav_xiala .erji_xiala i:nth-child(2){ transition-delay: 450ms;} .fixedNav .nav_xiala .erji_xiala i:nth-child(3){ transition-delay: 400ms;} .fixedNav .nav_xiala .erji_xiala i:nth-child(4){ transition-delay: 350ms;} .fixedNav .nav_xiala .erji_xiala i:nth-child(5){ transition-delay: 300ms;} .fixedNav .nav_xiala .erji_xiala i:nth-child(6){ transition-delay: 250ms;} .fixedNav .nav_xiala .erji_xiala i:nth-child(7){ transition-delay: 200ms;} .fixedNav .nav_xiala .erji_xiala i:nth-child(8){ transition-delay: 150ms;} .fixedNav .nav_xiala .erji_xiala i:nth-child(9){ transition-delay: 100ms;} .fixedNav .nav_xiala .erji_xiala i:nth-child(10){ transition-delay: 50ms;} .fixedNav .nav_xiala .sanji_xiala {width: 165px; height:0px; visibility: hidden; position: absolute; top: 0px; left:150px; /*和一级栏目一样left*/ } .fixedNav .nav_xiala .sanji_xiala span{ border-bottom:1px dashed rgba(255,255,255,0.35); display: block; background:rgba(11,11,11,1); text-align: left; opacity: 0; } .fixedNav .nav_xiala .sanji_xiala span a { height: 40px; line-height: 40px; display: block; color:#FFF; font-size:14px; padding-left: 10px; padding: 0 8px 0 15px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .fixedNav .nav_xiala .sanji_xiala span a:hover{ color:#FFF; padding-left: 25px; } .fixedNav .nav_xiala .sanji_xiala span a{ background: -webkit-linear-gradient(left, rgba(210,153,71,1), rgba(210,153,71,1)) no-repeat; background: linear-gradient(to right, rgba(210,153,71,1), rgba(210,153,71,1)) no-repeat; background-size: 100% 0%; -webkit-transition: all .5s; transition: all .5s; } .fixedNav .nav_xiala .sanji_xiala span a:hover{ background: -webkit-linear-gradient(left, rgba(210,153,71,1), rgba(210,153,71,1)) no-repeat; background: linear-gradient(to right, rgba(210,153,71,1), rgba(210,153,71,1)) no-repeat; background-size: 100% 100%; } .fixedNav .nav_xiala .sanji_xiala_di{ background:url(../images/liqsub_ss.png) no-repeat center;width:7px;height:11px; position: absolute; top:15px; right: 5px;} .fixedNav .nav_xiala .erji_xiala i:hover .sanji_xiala{ height:auto; visibility: visible; } .fixedNav .nav_xiala .sanji_xiala span{ opacity: 0; transform: rotateY(90deg); transition:.5s;} .fixedNav .nav_xiala .erji_xiala i:hover .sanji_xiala span{ opacity: 1; transform: rotateY(0); } .fixedNav .nav_xiala .erji_xiala i:hover .sanji_xiala span:nth-child(1){ transition-delay: 50ms;} .fixedNav .nav_xiala .erji_xiala i:hover .sanji_xiala span:nth-child(2){ transition-delay: 100ms;} .fixedNav .nav_xiala .erji_xiala i:hover .sanji_xiala span:nth-child(3){ transition-delay: 150ms;} .fixedNav .nav_xiala .erji_xiala i:hover .sanji_xiala span:nth-child(4){ transition-delay: 200ms;} .fixedNav .nav_xiala .erji_xiala i:hover .sanji_xiala span:nth-child(5){ transition-delay: 250ms;} .fixedNav .nav_xiala .erji_xiala i:hover .sanji_xiala span:nth-child(6){ transition-delay: 300ms;} .fixedNav .nav_xiala .erji_xiala i:hover .sanji_xiala span:nth-child(7){ transition-delay: 350ms;} .fixedNav .nav_xiala .erji_xiala i:hover .sanji_xiala span:nth-child(8){ transition-delay: 400ms;} .fixedNav .nav_xiala .erji_xiala i:hover .sanji_xiala span:nth-child(9){ transition-delay: 450ms;} .fixedNav .nav_xiala .erji_xiala i:hover .sanji_xiala span:nth-child(10){ transition-delay: 500ms;} .fixedNav .nav_xiala > ul > li:hover > a{color:#93be4c;} .fixedNav .nav_xiala > ul > li.active > a{color:#93be4c;} .fixedNav .nav_xiala > ul > li.active > a{color:#93be4c;background:rgba(210,153,71,0);} /*首页banner*/ .banner{position:relative;} .banner .slider{width:100% !important;height:800px;overflow:hidden;position:relative;z-index:1;} .banner .slider-main{width:1920px;height:100%;position:absolute;left:50%;margin-left:-960px;} .banner .slider-main li{width:100%;height:100%;} .banner .osSlider-main .slider-btn-prev{position:absolute;z-index:30;top:50%;left:-45px;width:40px;height:40px;text-indent:-9999px;margin-top:-20px;background:url(../images/arrowPrev.png) 50% 50% no-repeat;transition:all 0.5s linear;cursor:pointer;} .banner .osSlider-main:hover .slider-btn-prev{left:3%;} .banner .osSlider-main .slider-btn-next{position:absolute;z-index:30;top:50%;right:-45px;width:40px;height:40px;text-indent:-9999px;margin-top:-20px;background:url(../images/arrowNext.png) 50% 50% no-repeat;transition:all 0.5s linear;cursor:pointer;} .banner .osSlider-main:hover .slider-btn-next{right:3%;cursor:pointer;} .banner .osSlider-main .slider-nav{position:absolute;width:100%;bottom:10px;text-align:center;z-index:25;font-size:0; opacity:0;-webkit-transition:all .7s;transition:all .7s;} .banner:hover .osSlider-main .slider-nav{position:absolute;width:100%;bottom:30px;text-align:center;z-index:25;font-size:0; opacity:1;-webkit-transition:all .7s;transition:all .7s;} .banner .osSlider-main .slider-nav li{display:inline-block;vertical-align:top;height:16px;width:16px;text-align:center;margin:0 7px;border-radius:50%;color:#333;background:#fff;cursor:pointer;} .banner .osSlider-main .slider-nav li.active{background:#93be4c;color:#fff;} /* banner 结束 */ /* 底部信息 */ .footer{width:100%;background:#f9fafc;height:auto;position:relative;box-sizing:content-box;cursor:default !important;} .footer .center{width:1300px;height:260px;margin:0 auto;overflow:hidden;display:flex;justify-content: space-between;} .footer .center .list{width:960px;height:260px;overflow:hidden;float:left;display:flex;justify-content: space-between;} .footer .center .list li{float:left;width:auto;min-width:80px;height:260px;} .footer .center .list li p{font-size:18px;line-height:18px;color:#333;height:30px;margin:40px 0 20px 0;background:url(../images/ft_line.png) left bottom no-repeat;} .footer .center .list li a{display:block;font-size:14px;line-height:15px;color:#808080;box-sizing:content-box;margin-bottom:25px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;-webkit-transition:all .5s;transition:all .5s;} .footer .center .list li a:hover{color:#93be4c;-webkit-transition:all .5s;transition:all .5s;} .footer .center .right{width:240px;height:260px;overflow:hidden;float:right;} .footer .center .right .ft_logo{width:240px;height:76px; background:url(../images/ft_logo.png);margin-top:8px;} .footer .center .right .ewm{width:240px;height:auto;margin-top:25px;position:relative;} .footer .center .right .ewm li{width:100px;height:auto;float:left;} .footer .center .right .ewm li:nth-of-type(2){float:right;} .footer .center .right .ewm li img{display:block;width:96px;height:96px;border:solid 2px #93be4c;box-sizing:content-box;vertical-align:top;} .footer .center .right .ewm li p{font-size:14px;color:#333;line-height:15px;text-align:center;margin-top:15px;} .footer .mid{width:1300px;height:90px;margin:20px auto 0 auto;} .footer .mid .infro{width:950px;height:50px;float:left;display:flex;justify-content: space-between;} .footer .mid .infro li{padding-left:40px;box-sizing:content-box;height:50px;float:left;text-align:center;} .footer .mid .infro li:nth-of-type(1){background:url(../images/ft_icon_01.png) left center no-repeat;} .footer .mid .infro li:nth-of-type(2){background:url(../images/ft_icon_02.png) left center no-repeat;} .footer .mid .infro li:nth-of-type(3){background:url(../images/ft_icon_03.png) left center no-repeat;} .footer .mid .infro li p:nth-of-type(1){font-size:14px;color:#333;line-height:30px;} .footer .mid .infro li p:nth-of-type(2){font-size:14px;color:#808080;line-height:20px;} .footer .mid .links01{width:240px;height:50px;line-height:50px;cursor:pointer;position:relative;z-index:5;float:right;} .footer .mid .links01 .ft_click01{width:200px;padding-left:40px;box-sizing:content-box;height:50px;line-height:50px;position:relative;font-size:16px;color:#4c4c4c;background:url(../images/link.png);} .footer .mid .links01 .list01{display:none;width:auto;position:absolute;right:-1px;bottom:50px;z-index:55;background:#f5f5f5;overflow:hidden;border-radius:8px;} .footer .mid .links01 .list01 li{width:240px;box-sizing:content-box;height:49px;line-height:49px;border-bottom:solid 1px #e0e0e0;} .footer .mid .links01 .list01 li:last-child{border-bottom:solid 0px #e0e0e0;} .footer .mid .links01 .list01 li a{display:block;font-size:14px;text-align:center;color:#666;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-transition:all .7s;transition:all .7s;} .footer .mid .links01 .list01 li:hover a{color:#fff;-webkit-transition:all .7s;transition:all .7s;} .footer .mid .links01 .list01 .sliders {width:240px;height:49px;position: absolute;left: 0;bottom:0;background: #93be4c;opacity:0;z-index:-1;-webkit-transition: top 0.4s, background-color 0.4s;transition: top 0.4s, background-color 0.4s;} .footer .mid .links01 .list01 li:nth-child(1):hover ~ .sliders{top:0;opacity:1;background:#93be4c;-webkit-transition: top 0.4s, background-color 0.4s;transition: top 0.4s, background-color 0.4s;} .footer .mid .links01 .list01 li:nth-child(2):hover ~ .sliders{top:50px;opacity:1;background:#93be4c;-webkit-transition: top 0.4s, background-color 0.4s;transition: top 0.4s, background-color 0.4s;} .footer .mid .links01 .list01 li:nth-child(3):hover ~ .sliders{top:100px;opacity:1;background:#93be4c;-webkit-transition: top 0.4s, background-color 0.4s;transition: top 0.4s, background-color 0.4s;} .footer .mid .links01 .list01 li:nth-child(4):hover ~ .sliders{top:150px;opacity:1;background:#93be4c;-webkit-transition: top 0.4s, background-color 0.4s;transition: top 0.4s, background-color 0.4s;} .footer .mid .links01 .list01 li:nth-child(5):hover ~ .sliders{top:200px;opacity:1;background:#93be4c;-webkit-transition: top 0.4s, background-color 0.4s;transition: top 0.4s, background-color 0.4s;} .footer .mid .links01 .list01 li:nth-child(6):hover ~ .sliders{top:250px;opacity:1;background:#93be4c;-webkit-transition: top 0.4s, background-color 0.4s;transition: top 0.4s, background-color 0.4s;} .footer .mid .links01 .list01 li:nth-child(7):hover ~ .sliders{top:300px;opacity:1;background:#93be4c;-webkit-transition: top 0.4s, background-color 0.4s;transition: top 0.4s, background-color 0.4s;} .footer .mid .links01 .list01 li:nth-child(8):hover ~ .sliders{top:350px;opacity:1;background:#93be4c;-webkit-transition: top 0.4s, background-color 0.4s;transition: top 0.4s, background-color 0.4s;} .footer .mid .links01 .list01 li:nth-child(9):hover ~ .sliders{top:400px;opacity:1;background:#93be4c;-webkit-transition: top 0.4s, background-color 0.4s;transition: top 0.4s, background-color 0.4s;} .footer .mid .links01 .list01 li:nth-child(10):hover ~ .sliders{top:450px;opacity:1;background:#93be4c;-webkit-transition: top 0.4s, background-color 0.4s;transition: top 0.4s, background-color 0.4s;} .footer .copy{width:100%;height:70px;line-height:70px;background:#93be4c;} .footer .copy .jz{width:1100px;height:70px;margin:0 auto;display:flex;justify-content: space-between;} .footer .copy p{float:left;font-size:14px;color:#fff;} .footer .copy p a{color:#fff;-webkit-transition:all .5s;transition:all .5s;} .footer .copy p a:hover{color:#fff;-webkit-transition:all .5s;transition:all .5s;} .footer .copy p img{margin-left:3px;vertical-align:middle;} /* 询盘信息 */ .topxunpan {width:auto;height:70px;float:left;} .thisxp{width:auto;height:70px;} .topxunpan .xp {position: relative;line-height:70px;color:#fff;font-size:14px;cursor: pointer;} .topxunpan .xp img {margin:28px 10px 0 0; vertical-align:top !important;} .topxunpan .xp i {display:inline-block;color:#fff;width:24px;height:24px; background:#feaa00;border-radius:12px;line-height:24px;text-align:center;font-size:12px;} .topxunpan .xp #xunpantip {z-index: 999;position: absolute;top: 35px;left: 50%;width: 180px;height: 30px;line-height: 30px;text-align: center;color: #fff;font-size: 14px;-webkit-transform: translateX(-50%) scale(0);-moz-transform: translateX(-50%) scale(0);-o-transform: translateX(-50%) scale(0);-ms-transform: translateX(-50%) scale(0);transform: translateX(-50%) scale(0);-webkit-transition: transform .7s, opacity .7s;-moz-transition: transform .7s, opacity .7s;-o-transition: transform .7s, opacity .7s;-ms-transition: transform .7s, opacity .7s;transition: transform .7s, opacity .7s;background-color: #333;border-radius: 4px;opacity: 0;font-weight: bold;box-shadow: 2px -2px 2px #dfdfdf;} .topxunpan .xp #xunpantip::after {content: '';position: absolute;top: 30px;left: 50%;width: 0;height: 0;-webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -o-transform: translateX(-50%); -ms-transform: (-50%); transform: translateX(-50%);border:8px solid transparent;border-top-color: #333;} .topxunpan .xp #xunpantip.xunpantextactive {-webkit-transform: translateX(-50%) scale(1); -moz-transform: translateX(-50%) scale(1); -o-transform: translateX(-50%) scale(1); -ms-transform: translateX(-50%) scale(1); transform: translateX(-50%) scale(1); opacity: 1;} .topxunpan i {font-weight: normal;font-style: normal;} .t_back{width:100%;height:0.1px;} /* 内页导航开始*/ .nav_xiala_aa01{width:100%; height:100px;border-bottom:solid 1px #e6e6e6;} .nav_xiala_xx01{width:100%; height:100px; background:#fff;} .nav_xiala01{width:1400px; height:100px; margin: 0 auto;} .nav_xiala01 h1{width:242px;height:80px;margin:10px 0;float:left;position:relative;} .nav_xiala01 .logo{width:242px;height:80px;display:block;vertical-align:top;} .nav_xiala01 ul{width:1100px;display:flex;justify-content: space-between;flex-wrap:wrap;float:right;} .nav_xiala01 ul li{ float:left; width:auto;height:100px;text-align:center;position:relative; -webkit-transition: all .5s; transition: all .5s;} .nav_xiala01 > ul > li > a{ display:block;width:auto;color:#333;font-size:16px;height:100px;line-height:100px;overflow: hidden;position:relative;-webkit-transition: all .5s; transition: all .5s;} .nav_xiala01 > ul > li:hover > a{color:#93be4c;-webkit-transition: all .5s;transition: all .5s;} .nav_xiala01 > ul > li.active > a{color:#93be4c;-webkit-transition: all .5s;transition: all .5s;} .nav_xiala01 > ul > li > a::before{content:'';width:0px;height:3px;background:#93be4c;position:absolute;bottom:0px;left:0;-webkit-transition:all .7s;transition:all .7s;} .nav_xiala01 > ul > li:hover > a::before{content:'';width:100%;height:3px;background:#93be4c;position:absolute;bottom:0px;left:0;-webkit-transition:all .7s;transition:all .7s;} .nav_xiala01 > ul > li.active > a::before{content:'';width:100%;height:3px;background:#93be4c;position:absolute;bottom:0px;left:0;-webkit-transition:all .7s;transition:all .7s;} .nav_xiala01 .erji_xiala{ position:absolute; top:100px; left:0; z-index:20; height:0px; visibility: hidden; width:140px; /*和一级栏目一样宽度*/ } .nav_xiala01 .erji_xiala i{ display: block; opacity: 0; border-bottom:1px solid rgba(255,255,255,0.35); background:#333; position:relative; } .nav_xiala01 .erji_xiala i a{ height: 40px; line-height: 40px; font-size:14px; display: block; color:#FFF; padding: 0 20px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .nav_xiala01 .erji_xiala i a:hover{ color:#FFF; } .nav_xiala01 .erji_xiala i:hover{background:#93be4c; } .nav_xiala .erji_xiala i a{ background-size: 0% 100%; -webkit-transition: all .5s; transition: all .5s; } .nav_xiala01 .erji_xiala i a:hover{ background: -webkit-linear-gradient(left, #93be4c, #93be4c) no-repeat; background: linear-gradient(to right, #93be4c, #93be4c) no-repeat; background-size: 100% 100%; } .nav_xiala01 ul li:hover .erji_xiala{ height:auto; visibility: visible; } .nav_xiala01 .erji_xiala i{ opacity: 0; transform: rotateY(90deg); transition:.5s;} .nav_xiala01 ul li:hover .erji_xiala i{ opacity: 1; transform: rotateY(0); } .nav_xiala01 ul li:hover .erji_xiala i:nth-child(1){ transition-delay: 50ms;} .nav_xiala01 ul li:hover .erji_xiala i:nth-child(2){ transition-delay: 100ms;} .nav_xiala01 ul li:hover .erji_xiala i:nth-child(3){ transition-delay: 150ms;} .nav_xiala01 ul li:hover .erji_xiala i:nth-child(4){ transition-delay: 200ms;} .nav_xiala01 ul li:hover .erji_xiala i:nth-child(5){ transition-delay: 250ms;} .nav_xiala01 ul li:hover .erji_xiala i:nth-child(6){ transition-delay: 300ms;} .nav_xiala01 ul li:hover .erji_xiala i:nth-child(7){ transition-delay: 350ms;} .nav_xiala01 ul li:hover .erji_xiala i:nth-child(8){ transition-delay: 400ms;} .nav_xiala01 ul li:hover .erji_xiala i:nth-child(9){ transition-delay: 450ms;} .nav_xiala01 ul li:hover .erji_xiala i:nth-child(10){ transition-delay: 500ms;} .nav_xiala01 .erji_xiala i:nth-child(1){ transition-delay: 500ms;} .nav_xiala01 .erji_xiala i:nth-child(2){ transition-delay: 450ms;} .nav_xiala01 .erji_xiala i:nth-child(3){ transition-delay: 400ms;} .nav_xiala01 .erji_xiala i:nth-child(4){ transition-delay: 350ms;} .nav_xiala01 .erji_xiala i:nth-child(5){ transition-delay: 300ms;} .nav_xiala01 .erji_xiala i:nth-child(6){ transition-delay: 250ms;} .nav_xiala01 .erji_xiala i:nth-child(7){ transition-delay: 200ms;} .nav_xiala01 .erji_xiala i:nth-child(8){ transition-delay: 150ms;} .nav_xiala01 .erji_xiala i:nth-child(9){ transition-delay: 100ms;} .nav_xiala01 .erji_xiala i:nth-child(10){ transition-delay: 50ms;} .nav_xiala01 .sanji_xiala { width: 165px; height:0px; visibility: hidden; position: absolute; top: 0px; left:140px; /*和一级栏目一样left*/ } .nav_xiala01 .sanji_xiala span{ border-bottom:1px dashed rgba(255,255,255,0.35); display: block; background:#333; text-align: left; opacity: 0; } .nav_xiala01 .sanji_xiala span a { height: 40px; line-height: 40px; display: block; color:#FFF; font-size:14px; padding-left: 10px; padding: 0 8px 0 15px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .nav_xiala01 .sanji_xiala span a:hover{ color:#FFF; padding-left: 25px; } .nav_xiala01 .sanji_xiala span a{ background: -webkit-linear-gradient(left, #93be4c, #93be4c) no-repeat; background: linear-gradient(to right, #93be4c, #93be4c) no-repeat; background-size: 100% 0%; -webkit-transition: all .5s; transition: all .5s; } .nav_xiala01 .sanji_xiala span a:hover{ background: -webkit-linear-gradient(left, #93be4c, #93be4c) no-repeat; background: linear-gradient(to right, #93be4c, #93be4c) no-repeat; background-size: 100% 100%; } .nav_xiala01 .sanji_xiala_di{ background:url(../images/liqsub_ss.png) no-repeat center; width: 7px; height: 11px; position: absolute; top: 14px; right: 5px;} .nav_xiala01 .erji_xiala i:hover .sanji_xiala{ height:auto; visibility: visible; } .nav_xiala01 .sanji_xiala span{ opacity: 0; transform: rotateY(90deg); transition:.5s;} .nav_xiala01 .erji_xiala i:hover .sanji_xiala span{ opacity: 1; transform: rotateY(0); } .nav_xiala01 .erji_xiala i:hover .sanji_xiala span:nth-child(1){ transition-delay: 50ms;} .nav_xiala01 .erji_xiala i:hover .sanji_xiala span:nth-child(2){ transition-delay: 100ms;} .nav_xiala01 .erji_xiala i:hover .sanji_xiala span:nth-child(3){ transition-delay: 150ms;} .nav_xiala01 .erji_xiala i:hover .sanji_xiala span:nth-child(4){ transition-delay: 200ms;} .nav_xiala01 .erji_xiala i:hover .sanji_xiala span:nth-child(5){ transition-delay: 250ms;} .nav_xiala01 .erji_xiala i:hover .sanji_xiala span:nth-child(6){ transition-delay: 300ms;} .nav_xiala01 .erji_xiala i:hover .sanji_xiala span:nth-child(7){ transition-delay: 350ms;} .nav_xiala01 .erji_xiala i:hover .sanji_xiala span:nth-child(8){ transition-delay: 400ms;} .nav_xiala01 .erji_xiala i:hover .sanji_xiala span:nth-child(9){ transition-delay: 450ms;} .nav_xiala01 .erji_xiala i:hover .sanji_xiala span:nth-child(10){ transition-delay: 500ms;}