@charset "UTF-8";
.special_00317 { padding: 100px 0; }

.special_00317 .cont { margin-top: 40px; }

.special_00317 .list { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: 0 -5px; position: relative; z-index: 1; }

.special_00317 .list .item { margin: 5px; color: #fff; font-size: 24px; background-position: center; background-repeat: no-repeat; background-size: cover; }

@media (max-width: 768px) { .special_00317 .list .item { font-size: 18px; } }

.special_00317 .list .item .liner { position: absolute; left: 0; right: 0; top: 0; bottom: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }

.special_00317 .list .item .liner .pic { text-align: center; }

.special_00317 .list .item .liner .pic .icon { position: relative; overflow: hidden; width: 104px; margin: auto; }

.special_00317 .list .item .liner .pic .icon::before { content: ''; display: block; padding-top: 100%; }

.special_00317 .list .item .liner .pic .icon .i { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); max-width: 100%; max-height: 100%; -webkit-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; }

.special_00317 .list .item .liner .pic .t { font-size: 24px; }

@media (max-width: 768px) { .special_00317 .list .item .liner .pic .t { font-size: 18px; } }

.special_00317 .list .item .liner .txt { margin-left: 10%; display: none; }

.special_00317 .list .item .liner a { position: absolute; left: 0; right: 0; bottom: 0; top: 0; z-index: 2; }

.special_00317 .list .item.item1, .special_00317 .list .item.item4 { width: calc(67.14% - 10px); position: relative; overflow: hidden; }

.special_00317 .list .item.item1::before, .special_00317 .list .item.item4::before { content: ''; display: block; padding-top: 36.17021%; }

.special_00317 .list .item.item1 .i, .special_00317 .list .item.item4 .i { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); max-width: 100%; max-height: 100%; -webkit-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; }

.special_00317 .list .item.item2, .special_00317 .list .item.item3 { width: calc(32.14% - 10px); position: relative; overflow: hidden; }

.special_00317 .list .item.item2::before, .special_00317 .list .item.item3::before { content: ''; display: block; padding-top: 75.55556%; }

.special_00317 .list .item.item2 .i, .special_00317 .list .item.item3 .i { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); max-width: 100%; max-height: 100%; -webkit-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; }

/*	pc 端	*/
/*	1280~1440	*/
@media (max-width: 1200px) { .special_00317 .list .item .liner .pic .icon { width: 80px; } }

/*	1024	*/
/*	移动端	*/
@media (max-width: 768px) { .special_00317 { padding: 40px 0; }
  .special_00317 .cont { margin-top: 25px; }
  .special_00317 .list { display: block; }
  .special_00317 .list .item { width: 100% !important; margin: 0; }
  .special_00317 .list .item + .item { margin-top: 15px; }
  .special_00317 .list .item::before { display: none !important; }
  .special_00317 .list .item .liner { position: relative; padding: 30px 0; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }
  .special_00317 .list .item .liner .pic .icon { width: 60px; }
  .special_00317 .list .item .liner .txt { margin-left: 15px; } }