@charset "utf-8";
.pic img{width:100%}
@media (min-width:768px){
.index-link-list { height: 405px; position: relative; display: block; overflow: hidden; color: #333;}
.index-link-list-box { position: absolute; left: 50%;bottom: 0; width: 4000px; margin-left: -2000px; text-align: center; overflow: hidden;}
.index-link-list-in { display: inline-block; text-align: left; width: 1782px; vertical-align: bottom;}
.index-link-list ul { white-space: nowrap; font-size: 0;text-align: center; float: left; position: relative;}
.index-link-list ul > li { font-size: 14px; display: inline-block; position: relative; cursor: pointer; vertical-align: top; width: 300px; margin: 0 25px; height: 300px; 
-webkit-transition: transform 300ms,padding 200ms;
-ms-transition: transform 300ms,padding 200ms;
-o-transition: transform 300ms,padding 200ms;
transition: transform 300ms,padding 200ms;
box-shadow: 0 1px 15px rgba(0,0,0,.08);
border-top:solid 6px;
background-position: center 100%;
/*margin-top: 105px;*/
-webkit-transform: translateY(105px);
-ms-transform: translateY(105px);
-o-transform: translateY(105px);
transform: translateY(105px);

}
.index-link-list ul > li .item-in { height: 100%; padding-top: 1px;}
.index-link-list ul > li:hover { box-shadow: 0 1px 20px rgba(0,0,0,.3); }
.index-link-list h3 { font-size: 20px;}
.index-link-list h4 { font-size: 18px; display: none;}
.index-link-list h5 { font-size: 12px; color: #777; font-family: Arial, Helvetica, sans-serif;}
.index-link-list .btns { display: none;}
.index-link-list .btn { border-radius: 100px; border:solid 1px; padding: 7px 40px; min-width: 160px; font-size: 18px; margin-top: 30px;}
.index-link-list .pic { position: absolute; width: 100%; height: 194px; overflow: hidden; left: 0; bottom: 0;
 background-position: center bottom; background-repeat: no-repeat; background-size: contain;
-webkit-transition: height 300ms;
-ms-transition: height 300ms;
-o-transition: height 300ms;
transition: height 300ms;}



.index-link-list li .btn.disable,
.index-link-list li .btn.disable:hover,
.index-link-list li .btn.disable:active { background-color: transparent !important; border:#ccc solid 1px; color: #888 !important; cursor: default; box-shadow: none;}



.index-link-list ul > li.active { width: 332px; height: 405px; cursor: default; padding-top: 123px; border: 0; background-position: center 0%;
background-repeat: no-repeat; background-size: 105% auto; border-radius: 5px 5px 0 0;
/*margin-top: 0px;*/
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
-o-transform: translateY(0);
transform: translateY(0);
}
.index-link-list ul > li.active:hover { box-shadow: 0 1px 15px rgba(0,0,0,.2);}
.index-link-list ul > li.active .item-in { background-color: #fff; margin-top:50px;}
.index-link-list ul > li.left,
.index-link-list ul > li.right { height: 350px;
/*margin-top: 55px;*/
-webkit-transform: translateY(55px);
-ms-transform: translateY(55px);
-o-transform: translateY(55px);
transform: translateY(55px);
}
.index-link-list ul > li.left h3,
.index-link-list ul > li.right h3 { margin: 40px auto 20px;}

.index-link-list li.active h3 { font-size: 22px; margin: 40px auto 20px;}
.index-link-list li.active h4,
.index-link-list li.active .btns { display: block;}
.index-link-list li.active .pic { height: 0;}
.index-link-list li.active .pic img{width:100%}

}