@charset "UTF-8";

body, html {
	padding: 0;
	margin: 0;
	background: #F8F9FA;
}

.container {
}
.header{
	padding-top: 3.73vw;
	background-color: #fff;
	margin-bottom: 3.73vw
}
.search {
	position: relative;
	padding: 0 4%;
}
.search input {
	display: block;
	border-radius: 4vw;
	padding-left: 9.6vw;
	width: 100%;
	height: 8vw;
	line-height: 8vw;
	color: #222;
	font-size: 3.2vw;
	border: 0;
	box-sizing: border-box;
	background-color: #F8F9FA;
	background-image: url(alumniActivityList/icon_search.png);
	background-repeat: no-repeat;
	background-size: auto 50%;
	background-position: 3.2vw center;
}


.navbar {
	position: relative;
	height: 10vw;
}
.navbar .menu {
	float: left;
	width: 33.33%;
	height: 10vw;
	line-height: 10vw;
	color: #222;
	font-size: 3.73vw;
	text-align: center;
	cursor: pointer;
}
.navbar .menu::after {
	content: " ";
	position: absolute;
	margin-left: 1.07vw;
	width: 1.33vw;
	height: 100%;
	background-image: url(./alumniActivityList/icon_menu1.png);
	background-size: 100% auto;
	background-position: center;
	background-repeat: no-repeat;
}
.navbar .menu.val {
	color: var(--main-color);
}
.navbar .menu.on {
	color: var(--main-color);
}
.navbar .menu.on::after {
	content: " ";
	position: absolute;
	margin-left: 1.07vw;
	width: 1.33vw;
	height: 100%;
	background-image: url(./alumniActivityList/icon_menu2.png);
	background-size: 100% auto;
	background-position: center;
	background-repeat: no-repeat;
}
.navbar .menu.on .submenu{
	display: block;
}
.navbar .submenu{
	display: none;
	position: absolute;
	left: 0;
	width: 100vw;
    padding-bottom: 4vw;
    background: #fff;
    z-index: 9;
	border-top: 0.27vw solid #F1F1F1;
	box-shadow: 0 5px 5px rgb(0,0,0,0.1);
}
.navbar .submenu a{
	float: left;
	display: block;
	margin: 4vw 0 0 4vw;
	width: 28%;
	height: 10.4vw;
	line-height: 10.4vw;
	color: #222;
	font-size: 3.2vw;
	background: #F8F9FA;
	border-radius: 2px;
	text-decoration: none;
}
.navbar .submenu a.on{
	color: var(--main-color);
}

.empty{
	margin: 10vw 0;
	padding-top: 38vw;
	background-image: url(./alumniActivityList/empty.png);
	background-size: 55vw auto;
	background-position: center;
	background-repeat: no-repeat;
	text-align: center;
}
.empty-title{
	font-size: 4vw;
	font-weight: bold;
	line-height: 5vw;
	color: #222222;
	margin-bottom: 2vw;
}
.empty-desc{
	font-size: 4vw;
	font-weight: 500;
	line-height: 6vw;
	color: #666666;
}
/*
.activity2 .activity-img{
    width: 16vw;
	margin: 0;
    position: absolute;
    right: 3.48%;
    bottom: 15vw;
}
.activity2 .activity-content{
	margin: 3.2vw 3.48% 0 3.77%;
}
.activity2 .activity-content-param{
	padding-right: 18vw;
}
*/
.activity{
	position: relative;
	margin: 0 4% 3.73vw 4%;
	background: #FFFFFF;
	border-radius: 0px 0px 4px 4px;
	overflow: hidden;
	text-decoration: none;
	display: block;
	box-shadow: 0 0 5px rgba(0,0,0,.08);
}
.activity-img{
	text-align: center;
	max-height: 50vw;
	overflow: hidden;
}
.activity-img img{
	width: 100%;
}
.activity-content {
	margin: 2.93vw 3.48% 0 3.77%;
}
.activity-foot {
	clear: both;
	margin: 0 3.48% 0 3.77%;
}

.activity-content-title {
	font-size: 3.73vw;
	font-weight: bold;
	color: #222222;
	line-height: 5.33vw;
	margin-bottom: 1.87vw;
}
.activity-content-title span{
	color: #FFF;
	font-size: 2.93vw;
	font-weight: normal;
	background: var(--main-color);
	border-radius: 3px 0px 3px 0px;
	padding: 0.4vw 1.07vw;
	margin-right: 1.33vw;
}

.activity-content-param{
	font-size: 3.2vw;
	line-height: 4.8vw;
	color: #666666;
	margin-top: 0.8vw;
}
.activity-content-param::before{
	content: "•";
	color: var(--main-color);
	font-size: 3.2vw;
	position: absolute;
	margin-left: 0.2vw;
}
.activity-content-param span{
	margin-left: 3.5vw;
}

.activity-brline{
	height: 3.47vw;
	border-bottom: 1px solid #F1F1F1;
}
.activity-memo {
	padding: 3.73vw 0 3.47vw 0;
	color: #999999;
	overflow: hidden;
}
.activity-memo span{
	float: left;
	display: block;
	height: 4.27vw;
	line-height: 4.27vw;
}
.activity-memo .activity-zan{
	width: 18%;
	background-image: url(./alumniActivityList/icon_zan1.png);
	background-size: auto 100%;
	background-position: left center;
	background-repeat: no-repeat;
	padding-left: 5.33vw;
}
.activity-memo .activity-msg{
	width: 18%;
	background-image: url(./alumniActivityList/icon_msg.png);
	background-size: auto 100%;
	background-position: left center;
	background-repeat: no-repeat;
	padding-left: 5.33vw;
}
.activity-memo .activity-share{
	width: 18%;
	background-image: url(./alumniActivityList/icon_share.png);
	background-size: auto 100%;
	background-position: left center;
	background-repeat: no-repeat;
	padding-left: 5.33vw;
}
.activity-memo .activity-state{
	float: right;
}

/* 屏幕大于等于680px */
@media screen and (min-width: 680px){
	.container{
		position: relative;
		max-width: 680px;
		margin: 0 auto;
		overflow: hidden;
		box-shadow: 0 0 8px rgb(0,0,0,.15);
	}
	
	.header{
		padding-top: calc(680px * 0.0373);
		background-color: #fff;
		margin-bottom: calc(680px * 0.0373);
	}
	.search {
		position: relative;
		padding: 0 4%;
	}
	.search input {
		display: block;
		border-radius: calc(680px * 0.04);
		padding-left: calc(680px * 0.096);
		width: 100%;
		height: calc(680px * 0.08);
		line-height: calc(680px * 0.08);
		color: #222;
		font-size: calc(680px * 0.032);
		border: 0;
		box-sizing: border-box;
		background-color: #F8F9FA;
		background-image: url(alumniActivityList/icon_search.png);
		background-repeat: no-repeat;
		background-size: auto 50%;
		background-position: calc(680px * 0.032) center;
	}
	
	
	.navbar {
		position: relative;
		height: calc(680px * 0.1);
	}
	.navbar .menu {
		float: left;
		width: 33.33%;
		height: calc(680px * 0.1);
		line-height: calc(680px * 0.1);
		color: #222;
		font-size: calc(680px * 0.0373);
		text-align: center;
		cursor: pointer;
	}
	.navbar .menu::after {
		content: " ";
		position: absolute;
		margin-left: calc(680px * 0.0107);
		width: calc(680px * 0.0133);
		height: 100%;
		background-image: url(./alumniActivityList/icon_menu1.png);
		background-size: 100% auto;
		background-position: center;
		background-repeat: no-repeat;
	}
	.navbar .menu.val {
		color: var(--main-color);
	}
	.navbar .menu.on {
		color: var(--main-color);
	}
	.navbar .menu.on::after {
		content: " ";
		position: absolute;
		margin-left: calc(680px * 0.0107);
		width: calc(680px * 0.0133);
		height: 100%;
		background-image: url(./alumniActivityList/icon_menu2.png);
		background-size: 100% auto;
		background-position: center;
		background-repeat: no-repeat;
	}
	.navbar .menu.on .submenu{
		display: block;
	}
	.navbar .submenu{
		display: none;
		position: absolute;
		width: 680px;
	    padding-bottom: calc(680px * 0.04);
	    background: #fff;
	    z-index: 9;
		border-top: calc(680px * 0.0027) solid #F1F1F1;
		box-shadow: 0 5px 5px rgb(0,0,0,0.1);
	}
	.navbar .submenu a{
		float: left;
		display: block;
		margin: calc(680px * 0.04) 0 0 calc(680px * 0.04);
		width: 28%;
		height: calc(680px * 0.104);
		line-height: calc(680px * 0.104);
		color: #222;
		font-size: calc(680px * 0.032);
		background: #F8F9FA;
		border-radius: 2px;
		text-decoration: none;
	}
	.navbar .submenu a.on{
		color: var(--main-color);
	}

	.empty{
		margin: calc(680px * 0.1) 0;
		padding-top: calc(680px * 0.38);
		background-image: url(./alumniActivityList/empty.png);
		background-size: calc(680px * 0.55) auto;
		background-position: center;
		background-repeat: no-repeat;
		text-align: center;
	}
	.empty-title{
		font-size: calc(680px * 0.04);
		font-weight: bold;
		line-height: calc(680px * 0.05);
		color: #222222;
		margin-bottom: calc(680px * 0.02);
	}
	.empty-desc{
		font-size: calc(680px * 0.04);
		font-weight: 500;
		line-height: calc(680px * 0.06);
		color: #666666;
	}
	
	.activity{
		position: relative;
		margin: 0 4% calc(680px * 0.0373) 4%;
		background: #FFFFFF;
		border-radius: 0px 0px 4px 4px;
		overflow: hidden;
		text-decoration: none;
		display: block;
		box-shadow: 0 0 5px rgba(0,0,0,.08);
	}
	.activity-img{
		text-align: center;
		max-height: calc(680px * 0.5);
		overflow: hidden;
	}
	.activity-img img{
		width: 100%;
	}
	.activity-content {
		margin: calc(680px * 0.0293) 3.48% 0 3.77%;
	}
	.activity-foot {
		clear: both;
		margin: 0 3.48% 0 3.77%;
	}
	.activity-content-title {
		font-size: calc(680px * 0.0373);
		font-weight: bold;
		color: #222222;
		line-height: calc(680px * 0.0533);
		margin-bottom: calc(680px * 0.0187);
	}
	.activity-content-title span{
		color: #FFF;
		font-size: calc(680px * 0.0293);
		font-weight: normal;
		background: var(--main-color);
		border-radius: 3px 0px 3px 0px;
		padding: calc(680px * 0.004) calc(680px * 0.0107);
		margin-right: calc(680px * 0.0133);
	}
	
	.activity-content-param{
		font-size: calc(680px * 0.032);
		line-height: calc(680px * 0.048);
		color: #666666;
		margin-top: calc(680px * 0.008);
	}
	.activity-content-param::before{
		content: "•";
		color: var(--main-color);
		font-size: calc(680px * 0.032);
		position: absolute;
		margin-left: calc(680px * 0.002);
	}
	.activity-content-param span{
		margin-left: calc(680px * 0.035);
	}
	
	.activity-brline{
		height: calc(680px * 0.0347);
		border-bottom: 1px solid #F1F1F1;
	}
	.activity-memo {
		padding: calc(680px * 0.0373) 0 calc(680px * 0.0347) 0;
		color: #999999;
		overflow: hidden;
	}
	.activity-memo span{
		float: left;
		display: block;
		height: calc(680px * 0.0427);
		line-height: calc(680px * 0.0427);
	}
	.activity-memo .activity-zan{
		width: 18%;
		background-image: url(./alumniActivityList/icon_zan1.png);
		background-size: auto 100%;
		background-position: left center;
		background-repeat: no-repeat;
		padding-left: calc(680px * 0.0533);
	}
	.activity-memo .activity-msg{
		width: 18%;
		background-image: url(./alumniActivityList/icon_msg.png);
		background-size: auto 100%;
		background-position: left center;
		background-repeat: no-repeat;
		padding-left: calc(680px * 0.0533);
	}
	.activity-memo .activity-share{
		width: 18%;
		background-image: url(./alumniActivityList/icon_share.png);
		background-size: auto 100%;
		background-position: left center;
		background-repeat: no-repeat;
		padding-left: calc(680px * 0.0533);
	}
	.activity-memo .activity-state{
		float: right;
	}
}