.wrap { position:relative; }

.tp-poi { position: relative; margin-top:1rem;}
.tp-poi img { display: block; width: 100%; }

.tp-head { text-align: center; margin: 0 0 .4rem; position: relative; }
.tp-head h2 { line-height: .4rem; font-size: .34rem; color: #333; font-weight: normal; }
.tp-head h3 { line-height: .3rem; font-size: .28rem; color: #999; font-weight: normal; }

.tp-video { padding: .5rem 0; background: #fff; }
.tp-video .list { position: relative; }
.tp-video .item { float: left; width: 50%; text-align: center; border-top: 1px dashed #ddd; padding: .2rem; }
.tp-video .item:nth-child(2n) { border-left: 1px dashed #ddd; }
.tp-video .item:nth-child(1),
.tp-video .item:nth-child(2) { border-top: 0; }
.tp-video .item img { width: .6rem; height: .6rem; display: block; margin: 0 auto; }
.tp-video .item h3 { line-height: .5rem; font-weight: normal; display: inline-block; position: relative; }
.tp-video .item i { position: absolute; right: -.4rem; top: .1rem; width: .3rem; height: .3rem; background: url(../../images/wxapp/_b0.png) center center no-repeat; background-size: .3rem; }

.tp-case { padding: .5rem 0 0; background: #f6f6f6; }
.tp-case .tabed { text-align: center; margin: 0 0 .4rem; white-space: nowrap; }
.tp-case .tabed li { display: inline-block; vertical-align: middle; border: 1px solid #a0a0a0; line-height: .6rem; padding: 0 .2rem; margin: 0 .02rem; border-radius: .6rem; }
.tp-case .tabed li.active { border-color: #ef0014; color: #ef0014; background: #fff; }
.tp-case .main { padding: 0 0 .5rem; }
.tp-case .video { width: 4.2rem; height: 8rem; padding: .6rem .2rem .7rem; margin: 0 auto; background: #fff; border: 1px solid #ddd; border-radius: .2rem; }
.tp-case .video .inner { width: 3.8rem; height: 6.76rem; }
.tp-case .foot { padding: .2rem .6rem; text-align: center; }
.tp-case .foot h2 { display: none; }
.tp-case .foot h3 { line-height: .4rem; font-size: large; font-weight: normal; color: #333; margin: 0 0 .2rem; }
.tp-case .foot a { display: inline-block; line-height: .6rem; background: #ef0014; color: #fff; border-radius: .6rem; padding: 0 .6rem; }

.tp-case .joo { padding: .5rem 0; background: #ffffff; }
.tp-case .list { position: relative; }
.tp-case .item { float: left; width: 22.5%; margin: 0 0 2% 2%; position: relative; overflow: hidden; box-shadow: 0 0 4px rgba(0,0,0,.2); }
.tp-case .item::before { content: ''; display: block; padding: 0 0 85%; background: #ddd; }
.tp-case .item img { position: absolute; left: 0; bottom: 0; width: 100%; display: block; }

.dialog-video { position: fixed; left: 0; top: 0; right: 0; bottom: 0; z-index: 99999; display: none; }
.dialog-video .shadow { position: absolute; left: 0; top: 0; bottom: 0; right: 0; z-index: 0; background: #000; filter: Alpha(opacity=30); background: rgba(0,0,0,.3); animation: fadeIn .5s ease; }
.dialog-video .inner { position: absolute; left: 50%; top: 50%; margin: -2.7rem 0 0 -1.5rem; z-index: 2; border: 5px solid #333; }
.dialog-video .video { position: relative; z-index: 0; width: 3rem; height: 5.4rem; background: #000; }
.dialog-video .close { position: absolute; right: -35px;  top: -5px; width: 30px; height: 30px; background: url(../../images/wxapp/_b0x.png) center center no-repeat #3388ff; cursor: pointer; z-index: 2; animation: }
.dialog-video .close:hover { background-color: #ef0014; }

.tg-navbar { height: 0; }
.tg-navbar .inner { position: fixed; left: 0; right: 0; bottom: 0; z-index: 100; }
.tg-navbar ul { background: #666; }
.tg-navbar li { float: left; width: 25%; text-align: center; font-size: .25rem; border-right: 1px solid rgba(255,255,255,.2); }
.tg-navbar li:nth-child(1) { width: 30%; }
.tg-navbar li:nth-child(4) { width: 20%; }
.tg-navbar a { display: block; height: .8rem; line-height: .8rem; color: #fff; }
.tg-navbar span { display: block; }
.tg-navbar li.icon span::before { content: ''; width: .3rem; height: .3rem; display: inline-block; vertical-align: middle; background-size: contain; margin: 0 .1rem 0 0; }
.tg-navbar li.tel { background: #0d6be9; background: -webkit-linear-gradient(top, #0693e5, #163eed); border-right: 0; }
.tg-navbar li.tel span::before { background-image: url(../../images/wxapp/z1.png); animation: jello 1s ease infinite; }
.tg-navbar a:active { box-shadow: 0 0 100rem rgba(0,0,0,.2) inset; }