@charset "utf-8";*{box-sizing:border-box;-webkit-appearance:none}*:focus{outline:none}html,body{height:100%}body{margin:0;line-height:1.5;font-size:14px;font-family:微软雅黑,microsoft yahei;color:#333;background:#fff}ul,li{list-style:none;padding:0;margin:0}.clearfix:after{content:"";display:block;clear:both;height:0;visibility:hidden}.clearfix{zoom:1}.main{max-width:1000px;margin:0 auto;padding:40px 0}.title{text-align:center;color:#333;font-size:20px;margin-bottom:25px}.btn_list li{float:left;margin:0 20px;height:60px}.btn{display:inline-block;*display:inline;*zoom:1;padding:10px 40px;text-decoration:none;position:relative;color:#333}.btn1{padding:10px 28px}.btn1 .btnbg-x{position:absolute;left:50%;width:0;top:0;bottom:0;transition:all .5s;-moz-transition:all .5s;-webkit-transition:all .5s;border-top:1px solid transparent;border-bottom:1px solid transparent}.btn1:hover{color:#136eac}.btn1:hover .btnbg-x{width:100%;left:0;border-color:#136eac}.btn1 .btn-inner{padding:0 12px;position:relative;z-index:1}.btn1 .btn-inner i{position:absolute;top:50%;margin-top:-.75em;line-height:1.5;right:1em;opacity:0;*filter:alpha(opacity=0);filter:alpha(opacity=0);transition:all .5s;-moz-transition:all .5s;-webkit-transition:all .5s}.btn1:hover .btn-inner i{opacity:1;*filter:alpha(opacity=100);filter:alpha(opacity=100);right:.6em}.btn1 .btn-inner i:before{content:'>';color:#136eac;opacity:0}.btn1:hover .btn-inner i:before{opacity:1}.btn1:hover .btn-inner{padding:0 24px 0 0;transition:all .5s;-moz-transition:all .5s;-webkit-transition:all .5s}.btn2{border:1px solid #d0d0d0;position:relative;padding:10px 28px}.btn2:hover{color:#fff}.btn2 .btnbg-x{position:absolute;left:-1px;width:0;top:-1px;bottom:-1px;transition:all .5s;-moz-transition:all .5s;-webkit-transition:all .5s}.btn2:hover .btnbg-x{width:100%;width:calc(100% + 2px);background:#e84c3d}.btn2 .btn-inner{padding:0 12px;position:relative;z-index:1}.btn2 .btn-inner i{position:absolute;top:50%;margin-top:-.75em;line-height:1.5;right:1em;opacity:0;*filter:alpha(opacity=0);filter:alpha(opacity=0);transition:all .5s;-moz-transition:all .5s;-webkit-transition:all .5s}.btn2:hover .btn-inner i{opacity:1;*filter:alpha(opacity=100);filter:alpha(opacity=100);right:.6em}.btn2 .btn-inner i:before{content:'>';color:#fff;opacity:1}.btn2:hover .btn-inner i:before{opacity:1}.btn2:hover .btn-inner{padding:0 24px 0 0;transition:all .5s;-moz-transition:all .5s;-webkit-transition:all .5s}.btn3{border:1px solid #d0d0d0;position:relative;overflow:hidden;transition:all .5s;-moz-transition:all .5s;-webkit-transition:all .5s}.btn3:hover{color:#fff;border-color:#2ecd71}.btn3 .btnbg-x{position:absolute;background:#2ecd71;left:50%;width:0;top:0;bottom:0;transition:all .5s;-moz-transition:all .5s;-webkit-transition:all .5s}.btn3:hover .btnbg-x{width:100%;left:0}.btn3 span{position:relative;z-index:1}.btn4{border:1px solid #d0d0d0;border:1px solid rgba(0,0,0,.2);-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);position:relative;-webkit-transition-property:color;transition-property:color;-webkit-transition-duration:.5s;transition-duration:.5s}.btn4:hover{color:#fff}.btn4 .btnbg-x{background:#3598dc;position:absolute;z-index:-1;top:-1px;left:-1px;right:-1px;bottom:-1px;-webkit-transform:scaleX(0);transform:scaleX(0);-webkit-transform-origin:0 50%;transform-origin:0 50%;-webkit-transition-property:transform;transition-property:transform;-webkit-transition-duration:.5s;transition-duration:.5s;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out;opacity:0;*filter:alpha(opacity=0);filter:alpha(opacity=0)}.btn4:hover .btnbg-x{-webkit-transition-timing-function:cubic-bezier(.52,1.64,.37,.66);transition-timing-function:cubic-bezier(.52,1.64,.37,.66);-webkit-transform:scaleX(1);transform:scaleX(1);opacity:1;*filter:alpha(opacity=100);filter:alpha(opacity=100)}.btn4 span{position:relative;z-index:1}.btn5{position:relative;border:1px solid #e9e9e9;border:1px solid rgba(0,0,0,.2);color:#666}.btn5:hover{color:#fff;background:#e77e22;transition-delay:.3s;-webkit-transition-delay:.3s}.btn5>div{position:absolute;border-style:solid;border-width:0;width:.6em;height:.6em;transition:all .3s;-webkit-transition:all .3s}.btn5 .line_tl{left:-1px;top:-1px;border-top-width:1px;border-left-width:1px;border-color:#000}.btn5 .line_tr{right:-1px;top:-1px;border-top-width:1px;border-right-width:1px;border-color:#000}.btn5 .line_bl{left:-1px;bottom:-1px;border-bottom-width:1px;border-left-width:1px;border-color:#000}.btn5 .line_br{right:-1px;bottom:-1px;border-bottom-width:1px;border-right-width:1px;border-color:#000}.btn5 .line_all{width:auto;height:auto;border-color:#e77e22;top:-1px;bottom:-1px;left:-1px;right:-1px;transition:border-width 0s;-webkit-transition:border-width 0s}.btn5:hover>div{width:55%;height:55%}.btn5:hover .line_all{width:auto;height:auto;border-width:1px;transition-delay:.3s;-webkit-transition-delay:.3s}.btn5 span{position:relative;z-index:1}.btn6{position:relative;border:1px solid #d0d0d0;border:1px solid rgba(0,0,0,.2);color:#666;overflow:hidden;-webkit-transition:border-color .3s,color .3s;transition:border-color .3s,color .3s;-webkit-transition-timing-function:cubic-bezier(.2,1,.3,1);transition-timing-function:cubic-bezier(.2,1,.3,1)}.btn6:hover{color:#fff;border-color:#9a59b5}.btn6 .bg_in{background:#9a59b5;position:absolute;top:0;left:0;width:150%;height:100%;z-index:-1;opacity:0;*filter:alpha(opacity=0);filter:alpha(opacity=0);-webkit-transform:rotate3d(0,0,1,-45deg) translate3d(0,-3em,0);transform:rotate3d(0,0,1,-45deg) translate3d(0,-3em,0);-webkit-transform-origin:0% 100%;transform-origin:0% 100%;-webkit-transition:-webkit-transform .3s,opacity .3s;transition:transform .3s,opacity .3s}.btn6:hover .bg_in{opacity:1;*filter:alpha(opacity=100);filter:alpha(opacity=100);-webkit-transform:rotate3d(0,0,1,0deg);transform:rotate3d(0,0,1,0deg);-webkit-transition-timing-function:cubic-bezier(.2,1,.3,1);transition-timing-function:cubic-bezier(.2,1,.3,1)}.btn6 span{position:relative;z-index:1}.btn7{position:relative;color:#fff;background:#17a086;border:1px solid #17a086;-webkit-transition:background-color .3s,color .3s;transition:background-color .3s,color .3s}.btn7:before{content:'';position:absolute;top:-15px;left:-15px;bottom:-15px;right:-15px;background:inherit;z-index:-1;opacity:.5;-webkit-transform:scale3d(.6,.4,1);transform:scale3d(.6,.4,1);display:none\9}.btn7:hover{background:#1dcba8;border-color:#1dcba8;-webkit-transition:background-color .1s .3s,color .1s .3s;transition:background-color .1s .3s,color .1s .3s;-webkit-animation:anim-moema-1 .3s forwards;animation:anim-moema-1 .3s forwards}.btn7:hover:before{-webkit-animation:anim-moema-2 .3s .3s forwards;animation:anim-moema-2 .3s .3s forwards}@-webkit-keyframes anim-moema-1{60%{-webkit-transform:scale3d(.8,.8,1);transform:scale3d(.8,.8,1)}85%{-webkit-transform:scale3d(1.1,1.1,1);transform:scale3d(1.1,1.1,1)}100%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}@keyframes anim-moema-1{60%{-webkit-transform:scale3d(.8,.8,1);transform:scale3d(.8,.8,1)}85%{-webkit-transform:scale3d(1.1,1.1,1);transform:scale3d(1.1,1.1,1)}100%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}@-webkit-keyframes anim-moema-2{to{opacity:0;-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}@keyframes anim-moema-2{to{opacity:0;-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}.btn8{border:1px solid #d0d0d0;position:relative;color:#666;overflow:hidden;-webkit-transition:color .3s;transition:color .3s}.btn8 .bg_brf,.btn8 .bg_aft{background:#d02818;position:absolute;height:100%;width:100%;bottom:100%;left:0;z-index:-1;-webkit-transition:all .3s;transition:all .3s;-webkit-transition-timing-function:cubic-bezier(.75,0,.125,1);transition-timing-function:cubic-bezier(.75,0,.125,1)}.btn8 .bg_brf{opacity:.5}.btn8:hover{color:#fff;border-color:#d02818}.btn8:hover .bg_brf,.btn8:hover .bg_aft{bottom:0}.btn8:hover .bg_aft{-webkit-transition-delay:.175s;transition-delay:.175s}.btn8 span{position:relative;z-index:1}.btn9{border:1px solid #d0d0d0;position:relative;color:#666;overflow:hidden;-webkit-transition:all .4s;transition:all .4s}.btn9:hover{color:#fff;border-color:#1cbab8}.btn9 .bgsqr1,.btn9 .bgsqr2,.btn9 .bgsqr3,.btn9 .bgsqr4{background:#1cbab8;position:absolute;width:25%;height:0;-webkit-transition:height .4s;transition:height .4s}.btn9 .bgsqr1{top:0;left:0}.btn9 .bgsqr2{bottom:0;left:25%}.btn9 .bgsqr3{top:0;left:50%}.btn9 .bgsqr4{bottom:0;left:75%}.btn9:hover .bgsqr1,.btn9:hover .bgsqr2,.btn9:hover .bgsqr3,.btn9:hover .bgsqr4{height:100%}.btn9 span{position:relative;z-index:1}.btn10{border:1px solid #d0d0d0;position:relative;color:#666;overflow:hidden;-webkit-transition:all .6s;transition:all .6s}.btn10:hover{color:#fff;border-color:#4e8735}.btn10 .bgsqr1{content:'';width:0;height:0;-webkit-transform:rotate(360deg);transform:rotate(360deg);border-style:solid;border-width:0;border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;border-left-color:#4e8735;position:absolute;bottom:0;left:0;-webkit-transition:all .6s;transition:all .6s}.btn10 .bgsqr2{content:'';width:0;height:0;-webkit-transform:rotate(360deg);transform:rotate(360deg);border-style:solid;border-width:0;border-top-color:transparent;border-left-color:transparent;border-bottom-color:transparent;border-right-color:#4e8735;position:absolute;top:0;right:0;-webkit-transition:all .6s;transition:all .6s}.btn10:hover .bgsqr1{border-width:200px 0 0 200px}.btn10:hover .bgsqr2{border-width:0 200px 200px 0}.btn10 span{position:relative;z-index:1}.btn11{border:1px solid #d0d0d0;position:relative;color:#666;overflow:hidden;-webkit-transition:all .6s;transition:all .6s}.btn11:hover{color:#fff;border-color:#5384b1}.btn11 .bgsqr1{content:'';width:0;height:0;-webkit-transform:rotate(360deg);transform:rotate(360deg);border-style:solid;border-width:0;border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;border-left-color:#5384b1;position:absolute;bottom:0;left:0;-webkit-transition:all .6s;transition:all .6s}.btn11 .bgsqr2{content:'';width:0;height:0;-webkit-transform:rotate(360deg);transform:rotate(360deg);border-style:solid;border-width:0;border-left-color:transparent;border-right-color:transparent;border-bottom-color:transparent;border-top-color:#5384b1;position:absolute;top:0;left:0;-webkit-transition:all .6s;transition:all .6s}.btn11 .bgsqr3{content:'';width:0;height:0;-webkit-transform:rotate(360deg);transform:rotate(360deg);border-style:solid;border-width:0;border-left-color:transparent;border-top-color:transparent;border-bottom-color:transparent;border-right-color:#5384b1;position:absolute;top:0;right:0;-webkit-transition:all .6s;transition:all .6s}.btn11 .bgsqr4{content:'';width:0;height:0;-webkit-transform:rotate(360deg);transform:rotate(360deg);border-style:solid;border-width:0;border-left-color:transparent;border-right-color:transparent;border-top-color:transparent;border-bottom-color:#5384b1;position:absolute;bottom:0;right:0;-webkit-transition:all .6s;transition:all .6s}.btn11:hover .bgsqr1{border-width:200px 0 0 200px}.btn11:hover .bgsqr2{border-width:200px 200px 0 0}.btn11:hover .bgsqr3{border-width:0 200px 200px 0}.btn11:hover .bgsqr4{border-width:0 0 200px 200px}.btn11 span{position:relative;z-index:1}.btn12{border:1px solid #d0d0d0;position:relative;color:#666;overflow:hidden;-webkit-transition:all .6s;transition:all .6s}.btn12:hover{color:#fff;border-color:#b8b926}.btn12 .bgsqr1,.btn12 .bgsqr2{background:#b8b926;position:absolute;top:50%;top:0\9;content:'';width:20px;height:20px;-webkit-border-radius:50%;border-radius:50%;-webkit-transition:all .6s;transition:all .6s;opacity:.5}.btn12 .bgsqr1{left:-20px;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.btn12 .bgsqr2{right:-20px;-webkit-transform:translate(50%,-50%);transform:translate(50%,-50%)}.btn12:hover .bgsqr1{-webkit-animation:criss-cross-left .8s both;animation:criss-cross-left .8s both;width:375px\9;height:375px\9;opacity:1}.btn12:hover .bgsqr2{-webkit-animation:criss-cross-right .8s both;animation:criss-cross-right .8s both;width:375px\9;height:375px\9;opacity:1}.btn12 span{position:relative;z-index:1}@-webkit-keyframes criss-cross-left{0%{left:-20px}50%{left:50%;width:20px;height:20px}100%{left:50%;width:375px;height:375px}}@keyframes criss-cross-left{0%{left:-20px}50%{left:50%;width:20px;height:20px}100%{left:50%;width:375px;height:375px}}@-webkit-keyframes criss-cross-right{0%{right:-20px}50%{right:50%;width:20px;height:20px}100%{right:50%;width:375px;height:375px}}@keyframes criss-cross-right{0%{right:-20px}50%{right:50%;width:20px;height:20px}100%{right:50%;width:375px;height:375px}}.btn13{border:1px solid #d0d0d0;position:relative;color:#666;overflow:hidden;-webkit-transition:all .6s;transition:all .6s}.btn13:hover{color:#fff;border-color:#f90}.btn13 .bgsqr1{content:'';width:0;height:0;-webkit-transform:rotate(360deg);transform:rotate(360deg);border-style:solid;border-width:0;border-top-color:transparent;border-right-color:transparent;border-bottom-color:transparent;border-left-color:#f90;position:absolute;bottom:0;left:0;-webkit-transition:all .6s;transition:all .6s}.btn13 .bgsqr2{content:'';width:0;height:0;-webkit-transform:rotate(360deg);transform:rotate(360deg);border-style:solid;border-width:0;border-top-color:transparent;border-left-color:transparent;border-bottom-color:transparent;border-right-color:#f90;position:absolute;top:0;right:0;-webkit-transition:all .6s;transition:all .6s}.btn13:hover .bgsqr1{border-width:50px 260px}.btn13:hover .bgsqr2{border-width:50px 260px}.btn13 span{position:relative;z-index:1}.btn14{border:1px solid #d0d0d0;position:relative;color:#666;overflow:hidden;-webkit-transition:all .6s;transition:all .6s}.btn14:hover{color:#fff;border-color:#f60}.btn14 .bgsqr1,.btn14 .bgsqr2,.btn14 .bgsqr3,.btn14 .bgsqr4{background:#f60;position:absolute;top:0;width:0;height:100%;-webkit-transition:all .4s;transition:all .4s;opacity:.35}.btn14 .bgsqr3,.btn14 .bgsqr4{opacity:.75}.btn14 .bgsqr1{left:0}.btn14 .bgsqr2{right:0}.btn14 .bgsqr3{right:0}.btn14 .bgsqr4{left:0}.btn14:hover .bgsqr1,.btn14:hover .bgsqr2,.btn14:hover .bgsqr3,.btn14:hover .bgsqr4{width:100%}.btn14:hover .bgsqr3,.btn14:hover .bgsqr4{-webkit-transition-delay:.4s;transition-delay:.4s}.btn14 span{position:relative;z-index:1}.btn15{position:relative;border-bottom:4px solid #ff339a;background:#ff339a;color:#fff;overflow:hidden}.btn15 .bgsqr1{position:absolute;background:#fff;opacity:.2;*filter:alpha(opacity=20);filter:alpha(opacity=20);left:0;top:0;right:0;height:100%;-webkit-transition:all .3s ease-in-out;transition:all .3s ease-in-out}.btn15:hover .bgsqr1{height:0}.btn15 span{position:relative;z-index:1}.btn16{border:1px solid #d0d0d0;position:relative;color:#666;overflow:hidden;-webkit-transition:all .6s;transition:all .6s}.btn16:hover{color:#fff;border-color:#720e9e}.btn16 .bgsqr1{background:#720e9e;position:absolute;width:0;height:0;border-radius:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);-webkit-transition:width .4s,height .4s;transition:width .4s,height .4s;z-index:-1;left:0\9 !important;top:0\9 !important}.btn16:hover .bgsqr1{width:600px;height:600px}.btn16 span{position:relative;z-index:1}