.card{
  overflow:hidden;
}

.card-reveal .card-body {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    bottom: 0;
    height: 100%;
    width: 100%;
    text-align: center;
}

.card-reveal .card-body .card-title {
    font-size: .75rem;
    margin: 0;
    text-transform: uppercase;
    font-weight: bolder;
    color: #4d4d4d;
}
.menu{ text-align:center; margin:20px 0 0 0;
}
.content{ margin:0 auto 20px 0;}

.menu li{
	display: inline-block;
	cursor:pointer; font-size:16px; border:1px solid #d5b782;border-radius:20px; margin-bottom:10px;
}

.menu li.current{
	background-position:0 0;
}

.menu span{
	color:#d5b782;
	display:block; padding:3px 15px;
}

.current span{
	color:#2e231b; background:#d5b782;border-radius:20px;
}


.info{
	float:left;
	width:300px;
	margin:20px 0;
	height:auto;
}

.info p{
	font:bold 24px Verdana, Geneva, sans-serif;
	color:#999;
	display:block;
	line-height:34px;
	text-align:center;
}
.menus{ text-align:center; margin:20px 0 0 0;
}
.contents{ margin:0 auto 50px auto;}

.menus li{
	display: inline-block;
	cursor:pointer; font-size:16px; border:1px solid #d5b782;border-radius:20px; margin-bottom:10px; margin-right:10px;
}

.menus li.currents{
	background-position:0 0;
}

.menus span{
	color:#d5b782;
	display:block; padding:3px 10px;
}

.currents span{
	color:#2e231b; background:#d5b782;border-radius:20px;
}


.infos{
	float:left;
	width:300px;
	margin:20px 0;
	height:auto;
}

.infos p{
	font:bold 24px Verdana, Geneva, sans-serif;
	color:#999;
	display:block;
	line-height:34px;
	text-align:center;
}
	.card.card-reveal span{ position:absolute; bottom:0; z-index:9999; width:100%; left:0; text-align:center; color:#fff; font-size:16px; line-height:35px; background:linear-gradient(rgba(0,0,0,0),rgba(0,0,0,1)); display:none;}
	.card.card-reveal:hover span{ display:block;}
.g-wrap{ margin: 0 auto;}
			.g-wrap .m-imgBlock{ width: 185px; height: 185px; float: left; margin-bottom: 20px; display: inline-block; overflow: hidden; position: relative;}
			.g-wrap .m-imgBlocks{clear: both; overflow: hidden;}
			.g-wrap .m-imgBlock .m-imgWrap{width: 100%; height: 100%;}
			.g-wrap .m-imgBlock img{display: block; -webkit-transition: .2s; -ms-transition: .2s; -moz-transition: .2s; transition: .2s;}
			.container-sd.ts-yd-block{ display:block;}
			.container-sd.ts-yd-block .menu span{ padding:5px 30px;}
			.container-sd.ts-yd-block .menu li{ margin-right:10px; font-size:18px;}
			.container-sd.ts-yd-block .menu{ margin-top:50px;}
			.container-sd{width:100%; display:none;}
			.ts-tc-xl-bd{ background:url(ts-img-14.jpg) repeat-x top #2e231b ;}
			.ts-tc-xl{ width:1000px; margin:0 auto;border-bottom:1px solid #d5b782; padding-bottom:40px; margin-bottom:20px;}
			.ts-tc-xl-tit{width:1000px; margin:0 auto; text-align:center; margin-bottom:-20px; }
			.ts-tc-xl .xl-img{ text-align:center; margin-top:60px;}
			.ts-tc-xl .xl-img img{border-radius:140px; width:140px; height:140px; border:1px solid #fff;}
			.ts-tc-xl .xl-tit{ font-size:30px; color:#c6c6c6; text-align:center; margin:15px 0;}
			.ts-tc-xl .xl-text{ font-size:16px; color:#c6c6c6; text-align:center; width:80%; margin:0 auto; line-height:26px;}
			.ts-tc-xl-bd .ts-bd-4.sys{ margin-top:70px;}
			/*手机端样式*/
  			@media only screen and (max-width: 414px) {
				.container-sd{ display:block;}
  				.g-wrap{width: 98%; margin: 0 auto; overflow:hidden; margin-left:-1px;}
  				.g-wrap .m-imgBlock{margin: 3px; width:110%; }
  				.g-wrap .m-imgBlocks{margin: 3px; width:110%; }
				.container-sd.ts-yd-block .container{ display:none;}
				.container-sd.ts-yd-block{ display:none;}
				.m-imgBlock .m-imgWrap a span{ position:absolute; bottom:0; z-index:9999; width:100%; left:0; text-align:center; color:#fff; font-size:14px; line-height:35px; background:linear-gradient(rgba(0,0,0,0),rgba(0,0,0,1));}
				.ts-tc-xl{ width:95%;}
				.ts-tc-xl-tit{width:95%; margin-bottom:20px; }
				.ts-tc-xl .xl-text{ width:90%;}
				.ts-tc-xl-bd .ts-bd-4.sys{ margin-top:10px;}

  			}
@media (min-width: 992px) {
    .card-reveal .card-body {
        height: 100%;
        bottom: -100%;
        -webkit-transition: bottom .2s ease-in-out;
        transition: bottom .2s ease-in-out;
    }

    .card-reveal .card-img-top {
        -webkit-transition: -webkit-transform .5s ease-in-out;
        transition: -webkit-transform .5s ease-in-out;
        transition: transform .5s ease-in-out;
        transition: transform .5s ease-in-out, -webkit-transform .5s ease-in-out;
    }




}

@media (min-width: 576px) and (max-width: 1199.98px) {
    .card-columns {
        -webkit-column-count: 2;
        -moz-column-count: 2;
        column-count: 2;
    }
}