@charset "UTF-8";
/* CSS Document */
* { margin: 0; padding: 0; }

html { font-size: 62.5%; }

body { color: #333; font-family:"Microsoft YaHei","微软雅黑"; font-size: 14px; font-size: 1.4rem; max-width: 1920px; margin: 0 auto; overflow-x: hidden; }

img { border: none; }

ul li { list-style-type: none; }

ul, form, p, a, img, table, tr, td, li, dd, dt, dl, span { margin: 0; padding: 0; list-style: none; }

a { text-decoration: none; color: #333; outline: none; transition: 0.3s; -moz-transition: 0.3s; -o-transition: 0.3s; -webkit-transition: 0.3s; }

h1 { margin: 0; padding: 0; font-weight: normal; }

input, textarea { font-family:"Microsoft YaHei","微软雅黑"; font-size: 14px; font-size: 1.4rem; border: none; outline: none; }

img { max-width: 100%; border: 0px solid #ccc; }

embed, video { max-width: 100%; }

input, textarea { border: none; background: none; font-family:"Microsoft YaHei","微软雅黑"; }

input[type="submit"], textarea[type="submit"] { cursor: pointer; }

input[type="checkbox"], textarea[type="checkbox"] { cursor: pointer; }

input[type="radio"], textarea[type="radio"] { cursor: pointer; }

input:focus, textarea:focus { outline: none; }

textarea { resize: none; }

.pull-left { float: left; }

.pull-right { float: right; }

.clear { clear: both; }

.fix { *zoom: 1; }

.fix:after, .fix:before { display: block; content: "clear"; height: 0; clear: both; overflow: hidden; visibility: hidden; }

/* html5 */
article, aside, dialog, footer, header, section, footer, nav, figure, menu { display: block; }

ul, form, p, a, img, table, tr, td, ul, li, dd, dt, dl, span, div { box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }

input, textarea { box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }

::-webkit-input-placeholder { color: #666; opacity: 1; }

/* WebKit browsers */
:-o-placeholder { color: #666; opacity: 1; }

/* Mozilla Firefox 4 to 18 */
::-moz-placeholder { color: #666; opacity: 1; }

/* Mozilla Firefox 19+ */
:-ms-input-placeholder { color: #666; opacity: 1; }

/* Internet Explorer 10+ */
.self-ellipsis { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }

.self-ellipsis-2 { display: -webkit-box; overflow: hidden; white-space: normal !important; text-overflow: ellipsis; word-wrap: break-word; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }

.self-ellipsis-3 { display: -webkit-box; overflow: hidden; white-space: normal !important; text-overflow: ellipsis; word-wrap: break-word; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }

.self-ellipsis-4 { display: -webkit-box; overflow: hidden; white-space: normal !important; text-overflow: ellipsis; word-wrap: break-word; -webkit-line-clamp: 4; -webkit-box-orient: vertical; }

.relative { position: relative; }

.absolute { position: absolute; }

.common-vc { position: absolute; top: 50%; transform: translateY(-50%); -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); }

.common-hc { position: absolute; left: 50%; transform: translateX(-50%); -ms-transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -o-transform: translateX(-50%); }

.common-center { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); }

.text-right { text-align: right; }

.text-left { text-align: left; }

.nlazy { min-width: 20%; }

/**/
.email { word-break: break-all; }

[class*="-item"] .item-pic, [class*="-item"] .item-pics { position: relative; display: block; text-align: center; overflow: hidden; }

[class*="-item"] .item-title { overflow: hidden; }

[class*="-item"] .item-title a { display: block; }

[class*="-item"] .item-title a:hover { color: #8FC31F !important; }

[class*="-item"] .item-subt { overflow: hidden; }

[class*="-item"] .item-subt a { display: block; }

[class*="-item"] .item-subt a:hover { color: #8FC31F !important; }

[class*="-item"] .item-desc { overflow: hidden; color: #666; }

[class*="-item"] .item-desc a { display: block; color: #666; }

[class*="-item"] .item-desc a:hover { color: #8FC31F !important; }

.wp { width: 1200px; margin: auto; }

@media screen and (min-width: 1220px) { .wp { width: 1200px; margin: auto; } }

@media screen and (min-width: 1000px) and (max-width: 1219px) { .wp { width: 980px; margin: auto; } }

@media screen and (max-width: 999px) { .wp { width: 95%; margin: auto; } }

@media screen and (min-width: 1220px) { .no_marginr { margin-right: auto !important; }
  .no_marginl { margin-left: auto !important; } }

@media screen and (min-width: 1000px) and (max-width: 1219px) { .no_marginr { margin-right: auto !important; }
  .no_marginl { margin-left: auto !important; } }

/* 图片放大 */
.an-imgbig { overflow: hidden; }

.an-imgbig img { display: block; -webkit-transition: all 350ms; -o-transition: all 350ms; -moz-transition: all 350ms; transition: all 350ms; }

.an-imgbig:hover img { -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); transform: scale(1.1); }

/* 图片缩小 */
.an-imgsmall { overflow: hidden; }

.an-imgsmall img { display: block; -webkit-transition: all 350ms; -o-transition: all 350ms; -moz-transition: all 350ms; transition: all 350ms; -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); transform: scale(1.1); }

.an-imgsmall:hover img { -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); }

/* 图片背景向右移动 */
.an-imgmove { overflow: hidden; position: relative; -webkit-transition: all 0.4s ease; -o-transition: all 0.4s ease; -moz-transition: all 0.4s ease; transition: all 0.4s ease; }

.an-imgmove:hover { background-position: 40%; }

.an-imgmove:hover:after { background-color: rgba(0, 0, 0, 0.2); }

.an-imgmove:after { position: absolute; content: ''; top: 0; right: 0; left: 0; bottom: 0; }

.an-bd1 { position: relative; overflow: hidden; }

.an-bd1:before { position: absolute; top: 0; left: -100%; z-index: 2; display: block; content: ''; width: 75%; height: 100%; background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), to(rgba(123, 202, 51, 0.7))); background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(123, 202, 51, 0.7) 100%); background: -moz- oldlinear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(123, 202, 51, 0.7) 100%); background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(123, 202, 51, 0.7) 100%); -webkit-transform: skewX(-25deg); -moz-transform: skewX(-25deg); -ms-transform: skewX(-25deg); -o-transform: skewX(-25deg); transform: skewX(-25deg); }

.an-bd1:hover:before { -webkit-animation: shine .75s; -moz-animation: shine .75s; animation: shine .75s; }

@-webkit-keyframes shine { 100% { left: 125%; } }

@-moz-keyframes shine { 100% { left: 125%; } }

@keyframes shine { 100% { left: 125%; } }

.an-bd2 { position: relative; overflow: hidden; }

.an-bd2 .item-backdrop { -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); filter: alpha(opacity=0); opacity: 0; position: absolute; height: 100%; width: 100%; top: -100%; background: rgba(0, 0, 0, 0.5); -webkit-transition: all .3s ease; -o-transition: all .3s ease; -moz-transition: all .3s ease; transition: all .3s ease; -webkit-transition-delay: .3s; -moz-transition-delay: .3s; -o-transition-delay: .3s; transition-delay: .3s; -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); padding: 5em 2em; }

.an-bd2:hover .item-backdrop { -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); filter: alpha(opacity=100); opacity: 1; -webkit-transform: rotate(0); -moz-transform: rotate(0); -ms-transform: rotate(0); -o-transform: rotate(0); transform: rotate(0); top: 0; text-align: center; }

.an-bd3 { position: relative; }

.an-bd3:before { content: ''; text-align: center; background: rgba(0, 0, 0, 0.5); position: absolute; left: 20px; right: 20px; top: 20px; bottom: 20px; -webkit-transition: all .3s; -o-transition: all .3s; -moz-transition: all .3s; transition: all .3s; visibility: hidden; opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; -webkit-transform: scale(0); -moz-transform: scale(0); -ms-transform: scale(0); -o-transform: scale(0); transform: scale(0); }

.an-bd3:hover:before { visibility: visible; opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); }

.an-bd4 { position: relative; overflow: hidden; }

.an-bd4 .item-backdrop:after { background-color: rgba(255, 255, 255, 0.5); bottom: 50%; content: ""; left: 0%; position: absolute; right: 0%; top: 51%; -webkit-transition: all 1s ease 0s; -o-transition: all 1s ease 0s; -moz-transition: all 1s ease 0s; transition: all 1s ease 0s; opacity: 1; z-index: 9; }

.an-bd4 .item-backdrop:before { background-color: rgba(255, 255, 255, 0.5); bottom: 0%; content: ""; left: 50%; position: absolute; right: 51%; top: 0%; opacity: 1; -webkit-transition: all 1s ease 0s; -o-transition: all 1s ease 0s; -moz-transition: all 1s ease 0s; transition: all 1s ease 0s; z-index: 9; }

.an-bd4:hover .item-backdrop:before { left: 0%; right: 0%; opacity: 0; -webkit-transition: all 1s ease 0s; -o-transition: all 1s ease 0s; -moz-transition: all 1s ease 0s; transition: all 1s ease 0s; }

.an-bd4:hover .item-backdrop:after { top: 0%; bottom: 0%; opacity: 0; -webkit-transition: all 1s ease 0s; -o-transition: all 1s ease 0s; -moz-transition: all 1s ease 0s; transition: all 1s ease 0s; }

.an-bd5 { position: relative; overflow: hidden; }

.an-bd5 .item-backdrop { position: absolute; left: 1px; top: 1px; right: 1px; bottom: 1px; padding: 0px; opacity: 0; text-align: center; -webkit-transition: all 500ms ease; -o-transition: all 500ms ease; -moz-transition: all 500ms ease; transition: all 500ms ease; -webkit-transform: scaleX(0); -moz-transform: scaleX(0); -ms-transform: scaleX(0); -o-transform: scaleX(0); transform: scaleX(0); background: rgba(0, 0, 0, 0.7); }

.an-bd5:hover .item-backdrop { top: 0px; opacity: 1; -webkit-transform: scaleX(1); -moz-transform: scaleX(1); -ms-transform: scaleX(1); -o-transform: scaleX(1); transform: scaleX(1); }

/* ------------------------------------- */
.title { padding: 0 1%; font-size: 18px; font-size: 1.8rem; margin: 20px 0; }

.img-item { font-size: 0; letter-spacing: 0; }

.img-item .item-pic { display: inline-block; vertical-align: top; width: 23%; margin: 0 1% 20px; }

/* ------------------------------------- */
.item-btns { padding: 0 1%; font-size: 0; letter-spacing: 0; }

.item-btn { display: inline-block; vertical-align: middle; margin: 10px; width: 200px; height: 48px; line-height: 48px; text-align: center; background-color: #fdb900; color: #fff; font-size: 16px; font-size: 1.6rem; font-weight: bold; text-transform: uppercase; }

/* .an-btn1 start */
.an-btn1 { position: relative; z-index: 1; overflow: hidden; -webkit-transition: background 0.4s linear, color 0.3s linear; -o-transition: background 0.4s linear, color 0.3s linear; -moz-transition: background 0.4s linear, color 0.3s linear; transition: background 0.4s linear, color 0.3s linear; }

.an-btn1:after { position: absolute; top: 50%; left: 50%; width: 120%; height: 50%; opacity: 0; z-index: -1; content: ''; background: #000; -webkit-transition: all 0.4s linear 0s; -o-transition: all 0.4s linear 0s; -moz-transition: all 0.4s linear 0s; transition: all 0.4s linear 0s; -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg); -moz-transform: translateX(-50%) translateY(-50%) rotate(45deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(45deg); -o-transform: translateX(-50%) translateY(-50%) rotate(45deg); transform: translateX(-50%) translateY(-50%) rotate(45deg); }

.an-btn1:hover { color: #fff; }

.an-btn1:hover:after { height: 500%; opacity: 1; }

/* .an-btn1 end */
/* .an-btn2 start */
.an-btn2 { overflow: hidden; position: relative; z-index: 2; }

.an-btn2:after { position: absolute; content: ''; width: 100%; height: 100%; top: 0; left: 0; -webkit-transition: 0.15s border-radius 0.15s, -webkit-transform 0.15s; transition: 0.15s border-radius 0.15s, -webkit-transform 0.15s; -o-transition: 0.15s border-radius 0.15s, -o-transform 0.15s; -moz-transition: transform 0.15s, 0.15s border-radius 0.15s, -moz-transform 0.15s; transition: transform 0.15s, 0.15s border-radius 0.15s; transition: transform 0.15s, 0.15s border-radius 0.15s, -webkit-transform 0.15s, -moz-transform 0.15s, -o-transform 0.15s; opacity: 0; background: #000; -webkit-transform: scale(0.1, 0.1); -moz-transform: scale(0.1, 0.1); -ms-transform: scale(0.1, 0.1); -o-transform: scale(0.1, 0.1); transform: scale(0.1, 0.1); border-radius: 50%; z-index: -1; }

.an-btn2:hover:after { opacity: 1; -webkit-transform: scale(1, 1); -moz-transform: scale(1, 1); -ms-transform: scale(1, 1); -o-transform: scale(1, 1); transform: scale(1, 1); border-radius: 0; }

/* .an-btn2 end */
/* .an-btn2 start */
.an-btn3 { overflow: hidden; }

.an-btn3 span { display: block; width: 100%; position: relative; -webkit-transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1) 100ms; -o-transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1) 100ms; -moz-transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1) 100ms; transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1) 100ms; }

.an-btn3 span:after { position: absolute; content: attr(data-hover); bottom: 0; top: 0px; left: 0px; right: 0; color: transparent; -webkit-transform: translate(0, 100%); -moz-transform: translate(0, 100%); -ms-transform: translate(0, 100%); -o-transform: translate(0, 100%); transform: translate(0, 100%); -webkit-transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1) 200ms; -o-transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1) 200ms; -moz-transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1) 200ms; transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1) 200ms; }

.an-btn3:hover span { -webkit-transform: translate(0, -100%); -moz-transform: translate(0, -100%); -ms-transform: translate(0, -100%); -o-transform: translate(0, -100%); transform: translate(0, -100%); }

.an-btn3:hover span:after { background-color: #000; color: #fff; }

/* .an-btn2 end */
/* an-btn4 start */
.an-btn4 { overflow: hidden; position: relative;  z-index: 2; }

.an-btn4 span { position: relative; z-index: 2; }

.an-btn4:after { 
    position: absolute;
     content: ''; 
     left: 0; 
     top: 0;
      bottom: 0; 
      width: 0; 
      background-color:rgba(85,171,155,0.5);
      color: #fff;
      -webkit-transition: all .5s; 
      -o-transition: all .5s; 
      -moz-transition: all .5s; 
      transition: all .5s;
       font-size: 0; 
    }

.an-btn4:hover:after { width: 100%; }

/* an-btn4 end */
/* an-btn9 start */
.an-btn9 { overflow: hidden; position: relative; }

.an-btn9 span { position: relative; display: block; z-index: 2; background-color: #fdb900; -webkit-transition: all 0.3s ease; -o-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1); }

.an-btn9 span:before { position: absolute; left: 0; top: 0; z-index: -1; height: 100%; width: 100%; content: ""; background-color: #000; -webkit-transform: scale(0, 1); -moz-transform: scale(0, 1); -ms-transform: scale(0, 1); -o-transform: scale(0, 1); transform: scale(0, 1); -webkit-transform-origin: top right; -moz-transform-origin: top right; -ms-transform-origin: top right; -o-transform-origin: top right; transform-origin: top right; 
	
/*-webkit-transition: -webkit-transform 500ms cubic-bezier(0.86, 0, 0.07, 1); 
        transition: -webkit-transform 500ms cubic-bezier(0.86, 0, 0.07, 1); 
	 -o-transition: -o-transform 500ms cubic-bezier(0.86, 0, 0.07, 1); 
   -moz-transition: transform 500ms cubic-bezier(0.86, 0, 0.07, 1), -moz-transform 500ms cubic-bezier(0.86, 0, 0.07, 1); */
	    transition: transform 500ms cubic-bezier(0.86, 0, 0.07, 1); 
	   /* transition: transform 500ms cubic-bezier(0.86, 0, 0.07, 1), -webkit-transform 500ms cubic-bezier(0.86, 0, 0.07, 1), -moz-transform 500ms cubic-bezier(0.86, 0, 0.07, 1), -o-transform 500ms cubic-bezier(0.86, 0, 0.07, 1); */
/*-webkit-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1); 
   -moz-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1); 
     -o-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1); */
	    transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1); }

.an-btn9:hover span:before { 
	-webkit-transform: scale(1, 1); 
	-moz-transform: scale(1, 1); 
	-ms-transform: scale(1, 1); 
	-o-transform: scale(1, 1); 
	transform: scale(1, 1); 
	-webkit-transform-origin: bottom left; 
	-moz-transform-origin: bottom left; 
	-ms-transform-origin: bottom left; 
	-o-transform-origin: bottom left; 
	transform-origin: bottom left; }

/* an-btn9 end */
/* an-btn5 start */
.an-btn5:hover { -webkit-animation: pulse 1s infinite cubic-bezier(0.66, 0, 0, 1); -moz-animation: pulse 1s infinite cubic-bezier(0.66, 0, 0, 1); animation: pulse 1s infinite cubic-bezier(0.66, 0, 0, 1); box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.3); color: #fff; background-color: rgba(0, 0, 0, 0.8);}

@-webkit-keyframes pulse { to { box-shadow: 0 0 0 20px rgba(0, 0, 0, 0); } }

@-moz-keyframes pulse { to { box-shadow: 0 0 0 20px rgba(0, 0, 0, 0); } }

@keyframes pulse { to { box-shadow: 0 0 0 20px rgba(0, 0, 0, 0); } }

/* an-btn5 end */
/* an-btn6 start */
.an-btn6 { position: relative; display: inline-block; vertical-align: middle; width: 70px; height: 70px; -moz-box-sizing: border-box; box-sizing: border-box; border-radius: 50%; background-color: #fff; box-shadow: 6px 5px 30px rgba(0, 0, 0, 0.12); margin: 100px; }

.an-btn6:before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 0; height: 0; margin: auto; display: block; border-width: 9px 0 9px 12px; border-style: solid; border-color: transparent transparent transparent #ff9a5a; }

.an-btn6 .an-btn6_animation { display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: 50%; z-index: 1; border-width: .5px; border-style: solid; border-color: #e0e0e0; opacity: 0; -webkit-animation: circles 3.9s linear 0s infinite; -moz-animation: circles 3.9s linear 0s infinite; animation: circles 3.9s linear 0s infinite; -webkit-animation-play-state: running; -moz-animation-play-state: running; animation-play-state: running; }

.an-btn6 .an-btn6_animation.circle_2 { -webkit-animation-delay: 1.3s; -moz-animation-delay: 1.3s; animation-delay: 1.3s; }

.an-btn6 .an-btn6_animation.circle_3 { -webkit-animation-delay: 2.6s; -moz-animation-delay: 2.6s; animation-delay: 2.6s; }

@-webkit-keyframes circles { 0% { -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    opacity: 0; }
  20% { -webkit-transform: scale(1.44);
    -moz-transform: scale(1.44);
    -o-transform: scale(1.44);
    transform: scale(1.44);
    opacity: .5; }
  100% { -webkit-transform: scale(3.2);
    -moz-transform: scale(3.2);
    -o-transform: scale(3.2);
    transform: scale(3.2);
    opacity: 0; } }

@-moz-keyframes circles { 0% { -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    opacity: 0; }
  20% { -webkit-transform: scale(1.44);
    -moz-transform: scale(1.44);
    -o-transform: scale(1.44);
    transform: scale(1.44);
    opacity: .5; }
  100% { -webkit-transform: scale(3.2);
    -moz-transform: scale(3.2);
    -o-transform: scale(3.2);
    transform: scale(3.2);
    opacity: 0; } }

@keyframes circles { 0% { -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    opacity: 0; }
  20% { -webkit-transform: scale(1.44);
    -moz-transform: scale(1.44);
    -o-transform: scale(1.44);
    transform: scale(1.44);
    opacity: .5; }
  100% { -webkit-transform: scale(3.2);
    -moz-transform: scale(3.2);
    -o-transform: scale(3.2);
    transform: scale(3.2);
    opacity: 0; } }

/* an-btn6 end */
/* an-btn7 start */
.an-btn7 { vertical-align: middle; margin: 0 30px; display: inline-block; font-size: 18px; position: relative; -webkit-transition: all 0.5s; -o-transition: all 0.5s; -moz-transition: all 0.5s; transition: all 0.5s; }

.an-btn7:hover { color: #fdb900; }

.an-btn7:after { position: absolute; content: ""; left: 0; bottom: 0; width: 0; height: 1px; background: #fdb900; -webkit-transition: 0.5s; -o-transition: 0.5s; -moz-transition: 0.5s; transition: 0.5s; }

.an-btn7:hover::after { width: 100%; }

/* an-btn7 end */
/* an-btn8 start */
.an-btn8 { display: inline-block; vertical-align: middle; background-color: #ff9c00; position: relative; width: 70px; height: 70px; border-radius: 50%; -webkit-animation: play-pulse 1.5s infinite cubic-bezier(0.66, 0, 0, 1); -moz-animation: play-pulse 1.5s infinite cubic-bezier(0.66, 0, 0, 1); animation: play-pulse 1.5s infinite cubic-bezier(0.66, 0, 0, 1); box-shadow: 0 0 0 0 rgba(255, 156, 0, 0.6), 0 0 0 0 rgba(255, 156, 0, 0.3); }

.an-btn8:after { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 0; height: 0; margin: auto; display: block; border-width: 9px 0 9px 12px; border-style: solid; border-color: transparent transparent transparent #fff; }

.an-btn8:hover { background-color: rgba(255, 156, 0, 0.6); }

@-webkit-keyframes play-pulse { to { box-shadow: 0 0 0 20px rgba(255, 255, 255, 0), 0 0 0 35px rgba(255, 255, 255, 0); } }

@-moz-keyframes play-pulse { to { box-shadow: 0 0 0 20px rgba(255, 255, 255, 0), 0 0 0 35px rgba(255, 255, 255, 0); } }

@keyframes play-pulse { to { box-shadow: 0 0 0 20px rgba(255, 255, 255, 0), 0 0 0 35px rgba(255, 255, 255, 0); } }

/* an-btn8 end */
/* an-btn10 start */
/* an-btn10 end */
/* an-btn11 start */
.an-btn11 { display: inline-block; vertical-align: middle; -webkit-transform: perspective(1px) translateZ(0); -moz-transform: perspective(1px) translateZ(0); transform: perspective(1px) translateZ(0); -webkit-transition-property: color; -o-transition-property: color; -moz-transition-property: color; transition-property: color; -webkit-transition-duration: 0.3s; -moz-transition-duration: 0.3s; -o-transition-duration: 0.3s; transition-duration: 0.3s; box-shadow: 0 0 1px rgba(0, 0, 0, 0); overflow: hidden; position: relative; }

.an-btn11:before { content: ""; position: absolute; z-index: -1; top: 0; bottom: 0; left: 0; right: 0; background: #000; -webkit-transform: scaleY(0); -moz-transform: scaleY(0); -ms-transform: scaleY(0); -o-transform: scaleY(0); transform: scaleY(0); -webkit-transform-origin: 50%; -moz-transform-origin: 50%; -ms-transform-origin: 50%; -o-transform-origin: 50%; transform-origin: 50%; -webkit-transition-property: -webkit-transform; transition-property: -webkit-transform; -o-transition-property: -o-transform; -moz-transition-property: transform, -moz-transform; transition-property: transform; transition-property: transform, -webkit-transform, -moz-transform, -o-transform; -webkit-transition-duration: 0.3s; -moz-transition-duration: 0.3s; -o-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-timing-function: ease-out; -moz-transition-timing-function: ease-out; -o-transition-timing-function: ease-out; transition-timing-function: ease-out; }

.an-btn11:hover { color: #fff !important; }

.an-btn11:hover:before { -webkit-transform: scaleY(1); -moz-transform: scaleY(1); -ms-transform: scaleY(1); -o-transform: scaleY(1); transform: scaleY(1); }

/* an-btn11 end */
/* an-btn12 start */
.an-btn12 { position: relative; display: inline-block; vertical-align: middle; overflow: hidden; }

.an-btn12 span { position: relative; z-index: 2; }

.an-btn12:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; opacity: 0; background-color: #000; -webkit-transition: all 0.4s; -o-transition: all 0.4s; -moz-transition: all 0.4s; transition: all 0.4s; -webkit-transform: scale(1, 0.5); -moz-transform: scale(1, 0.5); -ms-transform: scale(1, 0.5); -o-transform: scale(1, 0.5); transform: scale(1, 0.5); }

.an-btn12:hover:before { opacity: 1; -webkit-transform: scale(1, 1); -moz-transform: scale(1, 1); -ms-transform: scale(1, 1); -o-transform: scale(1, 1); transform: scale(1, 1); }

/* an-btn12 end */
/* an-btn13 start */
.an-btn13 { position: relative; display: inline-block; vertical-align: middle; overflow: hidden; }

.an-btn13 span { position: relative; z-index: 2; }

.an-btn13:before { position: absolute; content: ''; top: 0px; bottom: 0px; left: 0px; right: -50px; border-bottom: 50px solid #000; border-right: 30px solid transparent; -webkit-transition: all 600ms ease; -o-transition: all 600ms ease; -moz-transition: all 600ms ease; transition: all 600ms ease; -webkit-transform: translateX(-100%); -moz-transform: translateX(-100%); -ms-transform: translateX(-100%); -o-transform: translateX(-100%); transform: translateX(-100%); }

.an-btn13:after { position: absolute; content: ''; top: 0px; right: 0px; bottom: 0px; left: -50px; border-left: 30px solid transparent; border-bottom: 50px solid #000; -webkit-transition: all 600ms ease; -o-transition: all 600ms ease; -moz-transition: all 600ms ease; transition: all 600ms ease; -webkit-transform: translateX(100%); -moz-transform: translateX(100%); -ms-transform: translateX(100%); -o-transform: translateX(100%); transform: translateX(100%); }

.an-btn13:hover:before { -webkit-transform: translateX(-40%); -moz-transform: translateX(-40%); -ms-transform: translateX(-40%); -o-transform: translateX(-40%); transform: translateX(-40%); }

.an-btn13:hover:after { -webkit-transform: translateX(40%); -moz-transform: translateX(40%); -ms-transform: translateX(40%); -o-transform: translateX(40%); transform: translateX(40%); }

/* an-btn13 end */
/* item-title start */
.item-title { padding: 0 1%; }

.item-title > a { position: relative; display: block; font-size: 30px; line-height: 34px; opacity: 1; color: #000; overflow: hidden; text-transform: none; -webkit-transition: all 300ms ease; -o-transition: all 300ms ease; -moz-transition: all 300ms ease; transition: all 300ms ease; }

.item-title > a > span { position: relative; display: inline-block; -webkit-transition: -webkit-transform 0.3s; transition: -webkit-transform 0.3s; -o-transition: -o-transform 0.3s; -moz-transition: transform 0.3s, -moz-transform 0.3s; transition: transform 0.3s; transition: transform 0.3s, -webkit-transform 0.3s, -moz-transform 0.3s, -o-transform 0.3s; }

.item-title > a > span:before { position: absolute; top: 100%; content: attr(data-hover); -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }

.item-title:hover > a { color: #ff9c00; }

.item-title:hover > a > span { -webkit-transform: translateY(-100%); -moz-transform: translateY(-100%); -ms-transform: translateY(-100%); -o-transform: translateY(-100%); transform: translateY(-100%); }

.item-title:hover > a > span:before { position: absolute; top: 100%; content: attr(data-hover); -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }

/* 图标 */
.icon-list { font-size: 0; letter-spacing: 0; padding: 0 1%; }

.icon-list .item-icon { display: inline-block; vertical-align: top; margin: 0 10px; }

/* .an-icon1 start */
.an-icon1 { width: 120px; height: 120px; border: solid 2px #ff9c00; -webkit-transition: all 0.5s ease 0s; -o-transition: all 0.5s ease 0s; -moz-transition: all 0.5s ease 0s; transition: all 0.5s ease 0s; }

.an-icon1:hover { -webkit-transform: rotateY(180deg); -moz-transform: rotateY(180deg); transform: rotateY(180deg); }

/* .an-icon1 end */
/* .an-icon2 start */
.an-icon2 { width: 120px; height: 120px; border: solid 2px #ff9c00; -webkit-transition: all 0.5s ease 0s; -o-transition: all 0.5s ease 0s; -moz-transition: all 0.5s ease 0s; transition: all 0.5s ease 0s; }

.an-icon2:hover { -webkit-transform: rotateX(180deg); -moz-transform: rotateX(180deg); transform: rotateX(180deg); }

/* .an-icon2 end */
/* .an-icon3 start */
.an-icon3 { width: 120px; height: 120px; border: solid 2px #ff9c00; -webkit-transition: all 0.5s; -o-transition: all 0.5s; -moz-transition: all 0.5s; transition: all 0.5s; }

.an-icon3:hover { -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); }

/* .an-icon3 end */
/* .an-icon4 start */
.an-icon4 { width: 120px; height: 120px; position: relative; background: #ff9c00; border-radius: 60px; z-index: 2; -webkit-transition: all 0.3s; -o-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }

.an-icon4 .circle_l, .an-icon4 .circle_r { position: absolute; top: 0px; width: 60px; height: 120px; border: 2px solid #333; -webkit-transition-timing-function: linear; }

.an-icon4 .circle_l { left: 0px; border-right: 0; clip: rect(124px, 62px, 124px, 0); border-radius: 62px 0 0 62px; z-index: 2; -webkit-transition: all 0.3s; -o-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }

.an-icon4 .circle_r { right: 0px; border-left: 0; clip: rect(0px, 62px, 0px, 0); border-radius: 0 62px 62px 0; z-index: 2; -webkit-transition: all 0.3s; -o-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }

.an-icon4:hover .circle_l { clip: rect(0, 62px, 124px, 0); border-color: #000; }

.an-icon4:hover .circle_r { clip: rect(0, 62px, 124px, 0); border-color: #000; }

.an-icon4:hover { background: #000; color: #fff; -webkit-transition: translate3d(0px, -10px, 0); -o-transition: translate3d(0px, -10px, 0); -moz-transition: translate3d(0px, -10px, 0); transition: translate3d(0px, -10px, 0); -webkit-transition-delay: 300ms; -moz-transition-delay: 300ms; -o-transition-delay: 300ms; transition-delay: 300ms; }

/* .an-icon4 end */
/* img-list start */
.img-list { font-size: 0; letter-spacing: 0; }

.img-list .list-item { display: inline-block; vertical-align: top; width: 23%; margin: 10px 1%; }

.img-list .item-pic img { display: block; }

/* img-list end */
.img-info { font-size: 20px; font-size: 2rem; line-height: 40px; padding: 20px; }

/*# sourceMappingURL=3style.css.map */
