body{  }

.topic-date{ text-align: center; margin-bottom: 40px; font-size: 16px; color: #333;}
.topic-25{background:#eef6f8 url("../images/tbg60.jpg") center top 0 no-repeat; background-size: 100% auto; padding-bottom: 100px; min-height: 800px; position: relative;
}

.topicbgl{ width: 90px; bottom: 0; /* top: -90px; */top: 0; left: 0; position: absolute;background:url("../images/stbg210.png") repeat-y; background-size: 100% auto;}
.topicbgl:after{ content: ""; display: block; position: absolute;  width: 100%; left: 0; bottom: 100%; width: 90px; height: 136px;background:url("../images/stbgtop210.png") 0 bottom  no-repeat; background-size: 100% auto;}
/*.topicbgl:after{content: ""; display: block; width: 90px; height: 200px; top: 0; bottom: 0; left: 0;position: absolute; background:url("../images/stbg11.png") no-repeat; background-size: 100% auto;  z-index: 6;}*/

.topicbgr{ position: absolute; width: 90px; bottom: 0;/* top: -90px;*/ top:0;  right: 0; position: absolute;background:url("../images/stbg310.png") repeat-y; background-size: 100% auto;  }
/*.topicbgr:after{content: ""; display: block; width: 90px; height: 200px; top: 0; right: 0; position: absolute;background: rgba(248,255,255,0.6) ;}*/

.topicbgr:after{ content: ""; display: block; position: absolute;  width: 100%; left: 0; bottom: 100%; width: 90px; height: 136px;background:url("../images/stbgtop310.png") 0 bottom  no-repeat; background-size: 100% auto;}

.tptit{ text-align:center; }
.tptit img{ max-width: 50%; height: auto; }

.topic-actives{ margin-top: 30px; position: relative;}
.topic-actives .item-cnt{ margin-top: 10px;}
.topic-actives  .item-cnt  .item-tit{ height: 58px; color:#000;}
.topic-actives .item-ico{ margin-top: 15px; font-style: normal;  }
.topic-actives .item-ico span{ color: #fff; display: block; /*min-width: 90px;*/ background: #a5be2f url("../images/tpico1.png") 8px center no-repeat; padding:2px 10px 2px 28px; border-radius:  20px; margin-right: 10px;}
.topic-actives .item-ico cite{flex:1;font-style: normal; padding-top: 2px; color: #000;   }
.topic-actives .item-ico a{ align-items: flex-start;}
.topic-actives .item-ico a:nth-child(2){ margin-top: 10px;}
.topic-actives .item-ico a:nth-child(2) span{ background: #ffb33b url("../images/tpico2.png") 8px center no-repeat;}
.topic-actives  .item-cnt  .item-tit a:hover{ color: #066036;}
.topic-actives:after{ content: ""; display: block; width: 160px; height: 200px; position: absolute; top: -60px; left: -160px;background: url("../images/xmbg1.png") no-repeat; background-size: 100% auto;}

.tpvideowrap{  padding: 0 70px; max-width: 1600px; margin: 35px auto 0 auto;}
.tpvideowrap .item-pic{ border-radius: 35px; overflow: hidden;}
.vicon{ position: absolute; left: 50%; width: 50px; height: 50px; transform: translateX(-50%); top: 20px; opacity: 0; transition: all .3s;}
.vicon a{ width: 50px; height: 50px; display: block; background: url("../images/tpvideoico.png") no-repeat; background-size: 100% auto;}
.tpvideowrap .item-cell{ position: relative;}
.tpvideowrap .item-cell:hover .vicon{ opacity: 1;top: 0;}
.tpvideowrap .item-cell .item-inner{ padding-top: 25px;}

.tpprice-wrap{ margin-top:30px;}
.tpprice{ margin-right: -2%;} 
.tpprice-wrap .item-cell{ width: 23%; margin-right: 2%; background: #fff; border-radius: 20px; overflow: hidden; cursor: pointer;}

.topic-25{ position: relative; z-index:2000;}
.topic-25:after{ content:"";  position: absolute; bottom: 0; left: 0; width:188px; height: 202px; display: block;
background:url("../images/yzimg1.png") no-repeat; background-size: 	100% auto;	
}
.topic-25:before{ content: ""; position: absolute; bottom: 0; right: 0; width:308px; height: 222px; display: block;
background:url("../images/yzimg2.png") no-repeat; background-size:100% auto;	
}

.tpprice-wrap .item-cnt{ padding:20px 15px; text-align: center; min-height: 232px; }

.tpprice-wrap .item-tit{ font-weight: bold;  color: #000;}
.tpprice-wrap .item-desc span{ display: block; text-align: center; color: #0b6036;}
.tpprice-wrap .item-desc{ margin-top: 15px; margin-bottom: 15px;}
.tpprice-wrap .item-prices  span{ font-weight: bold; color: #000; padding-right: 10px;}
.tpprice-wrap .item-prices cite{ font-style: normal; color: #0b6036;}
.tpprice-wrap .item-prices cite i{ text-decoration: line-through;}

.topic-25 .btn-prev,.topic-25 .btn-next{ position: absolute; z-index: 99; opacity: 0; transition: all .3s;} 
.topic-actives{ position: relative;}
.topic-actives .btn-prev{ left: -25px; top: 23%;}
.topic-actives .btn-next{ right: -25px; top: 23%;}
.tpvideowrap{ position: relative;} 
.tpvideowrap .btn-prev{ left:45px; top: 50%; transform: translateY(-50%);}
.tpvideowrap  .btn-next{ right: 45px; top: 50%; transform: translateY(-50%);}
.topic-actives:hover .btn-prev,.topic-actives:hover .btn-next,.tpvideowrap:hover .btn-prev,.tpvideowrap:hover .btn-next{ opacity: 1;}
.tpprice-wrap{ position: relative; z-index: 88;}

.tpvideowrap:after{ content: ""; display: block; position: absolute; width: 160px; height: 141px; background: url("../images/xmbg2.png") no-repeat; background-size: 100% auto; top: -111px; right: 100px;}

.tpprice-wrap:after{ content:"";  position: absolute; bottom: 40px; left: -171px; width:171px; height: 244px; display: block;
background:url("../images/xmbg3.png") no-repeat; background-size: 	100% auto;	
}
.tpbanner{ position: relative; z-index: 999;}
.topicinfos{ background: none!important; position: relative; z-index: 66; padding-bottom: 30px;}
.bgfixed{background:#eef6f8  url("../images/tbg60.jpg") center top 100px no-repeat; background-size: 100% auto; top:0; position: fixed; left: 0; right: 0; height: calc(100vh);}
.topicinfos:after,.topicinfos:before{ display: none;}

.tpinfos{ max-width: 670px; width: 100%; padding:50px; margin: 0 auto;  }
.tpinfos2{ max-width: 1000px; width: 100%; background:rgba(255,255,255,.5);margin: 0 auto;border-radius:20px; }

.topicstit { text-align: center; font-weight: bold; color: #000;  max-width: 1000px; margin: 0 auto 20px auto;}

.gobackhome{ position: absolute; z-index: 99;  right: 0; left: 0; top: 20px;}
.gobackhome a{  float: right; background: rgba(122,193,67,.98);  color: #fff; border-radius: 20px;font-size: 16px; width: 98px; text-align: center; height:32px; line-height: 32px; display:inline-block; margin-right:15px;}

.topics-video{ max-width: 900px; margin: 0 auto; width: 100%; padding-top: 40px; text-align: center;}

.topics-video video{ margin: 0 auto; }


.tpinfos *{font-family: Arial, "AlibabaPuHuiTi-Regular"!important;}


.bookbtns a{ display: block; background: rgba(122,193,67,1);  color: #fff; border-radius: 20px;font-size: 16px; width: 150px; text-align: center; height:32px; line-height: 32px;  margin: 10px auto 20px auto; }
.bookbtns a:hover{ background: #0b6036;}
.topticslist .topic-actives:after{ display: none;}

.tpmores{ position: absolute; top:170px; right: 0;}
.tpmores  a{ background: #a5be2f; padding: 10px 30px; font-size: 16px; border-radius: 30px; color: #fff; display: inline-block;}
.tpmores  a:hover{ background: #106B46;}

.nobtns .btn-prev,.nobtns .btn-next{ display: none;}
.nobtns .item-cell{max-width: calc(33.33% - 20px)} 
@media screen and (max-width: 1681px) {
	
	.topic-25{background:#eef6f8 url("../images/tbg60.jpg") center bottom no-repeat; background-size: 100% auto; }


}


@media screen and (max-width: 1461px) {
	.topic-actives:after{ width: 110px; left: -110px; top: -30px;}
	.tpprice-wrap:after{ width:110px; left: -110px; height: 164px;}

	
}

@media screen and (max-width: 640px) {
	
.tpinfos{  padding:10px 10px; margin: 0 auto;  }	
	
	.tpbanner2	img{ max-width: 150%; transform: translateX(-20%);}
	.gobackhome{ right: -10px;}
	.gobackhome a{ font-size: 14px; height: 25px; line-height: 25px; width: 75px;}
	.bgfixed,.topic-25{ background-size: cover;}
	.topicbgl,.topicbgr{ width: 20px;}
	.topicbgl:after,.topicbgr:after{ width: 20px;  bottom:99.99%; }
	
	.topicstit { padding: 0 25px; font-size: 22px; line-height: 140%;  padding-top: 20px; margin-bottom: 15px;}
	
	.topic-actives{ margin-top: 10px;}
	.tptit img{ max-width: 280px;}
	
	.topic-actives{ padding: 0 20px;}
	.topic-actives:after{ display: none;}
	
	.topic-25 .btn-prev,.topic-25 .btn-next{opacity: 1; } 
	.topic-actives .btn-prev{ left: 0;}
	.topic-actives .btn-next{ right: 0;}
	.topic-actives .item-cnt .item-tit{ height: auto;}
	.topic-actives .item-ico a span{ background-size:10px auto!important; font-size: 14px; padding-left: 22px;}
	.tpvideowrap{    padding: 0 20px; margin-top: 0; margin-bottom: 20px;}
	.tpvideowrap .btn-prev{ left: 8px;}
	.tpvideowrap  .btn-next{ right: 8px;}
.tpprice-wrap .item-cell{ width: 98%; margin-bottom: 20px;}
	.tpprice-wrap{padding: 0 25px;}
	.tpprice-wrap:after,.topic-25:after{ display: none;}
	.topic-25{ padding-bottom: 50px;}
	.tpprice-wrap .item-tit{ font-size: 20px;}
	.topic-actives .item-cnt .item-tit{ font-size: 18px;}
	
	.tpvideowrap:after{ width: 60px; height: 71px; background: url("../images/xmbg2.png") no-repeat; background-size: 100% auto; top: -21px; right: 40px;}
	.vicon a,.vicon{ width: 30px; height: 30px;}
.tpvideowrap .item-cell:hover .vicon{ opacity: 1;top: 10px;}
	.topic-date{ margin-bottom: 20px;}
	.topics-video{ padding:0 20px;}
	.topics-video video{ max-width: 100%;}
	
	.topic-25{ min-height: 0;}
	
	.tpprice-wrap .item-cnt{ height: auto; min-height: 0; }
	
	.bookbtns a{ margin-top: 0;}
	.tpmores{ position: static; margin: 0 auto; margin-top: 40px; text-align: center; }
	
	.tpmores  a{ padding: 10px 60px;}
	.nobtns2 .item-cell{max-width: calc(100%)} 
.nobtns2 .btn-prev,.nobtns2 .btn-next{ display: none;}
}