veterans_H5/h5_web/pages/businessDetails/businessDetails.scss

/* 企业详情 */
.business-details {
	position: relative;
	font-family: 'PingFangSC-Regular, PingFang SC';
	background-color: #f2f2f2;
	min-height: calc(100vh - 44px);
	padding-bottom: 100rpx;
	/* 背景 */
	&-bg {
		// position: relative;
		height: 606rpx;
		background-image: url(../../static/img/details-bg.png);
		background-repeat: no-repeat;
		background-position: center center;
		background-size: cover;
		&-1 {
			height: 400rpx;
			background: linear-gradient(#456553, #3D5D4C);
		}
		&-2 {
			width: 100%;
			height: 200rpx;
			border-radius: 0 0 50% 50%;
			background-color: #3D5D4C;
		}
		image {
			position: absolute;
			top: 0;
			left: 0;
			width: 520rpx;
			height: 520rpx;
		}
	}
	/* 内容 */
	&-content {
		width: 100%;
		margin-top: -606rpx;
		text-align: center;
		&-logo {
			background-color: rgba(255, 255, 255, 0.3);
			width: 156rpx;
			height: 156rpx;
			border-radius: 50%;
			margin: 45rpx auto 25rpx;
			display: flex;
			align-items: center;
			justify-content: center;
			image {
				width: 139rpx;
				height: 139rpx;
				border-radius: 50%;
				background-color: rgba($color: #fff, $alpha: 0.8);
			}
		}
		&-name {
			font-family: 'PingFangSC-Heavy, PingFang SC';
			font-size: 32rpx;
			font-weight: bold;
			color: #fff;
		}
		&-evaluate {
			width: calc(100% - 60rpx);
			height: 64rpx;
			line-height: 64rpx;
			margin: 36rpx auto 0;
			background-color: rgba($color: #fff, $alpha: 0.8);
			border-radius: 32rpx;
			padding: 0 31rpx;
			display: flex;
			justify-content: space-between;
			.left {
				display: flex;
				align-items: center;
				.evaluate {
					font-size: 26rpx;
					color: #EF651F;
					margin-right: 19rpx;
				}
				.describe {
					font-size: 24rpx;
					color: #000;
					font-weight: 400;
					margin-right: 14rpx;
				}
				.grade {
					color: #EF651F;
					margin-left: 14rpx;
					font-weight: 400;
				}
			}
			.right {
				color: #666;
				font-size: 24rpx;
				.icon {
					margin-left: 9rpx;
				}
			}
		}
		
		/* 公司概况 */
		&-survey {
			width: calc(100% - 60rpx);
			margin: 63rpx auto 0;
			background-color: #fff;
			border-radius: 10rpx;
			padding: 28rpx 33rpx;
			text-align: left;
			.title {
				color: #000;
				font-size: 32rpx;
				font-weight: 400;
				margin-bottom: 10rpx;
			}
			.item {
				color: #545454;
				font-size: 24rpx;
				line-height: 48rpx;
				.address {
					display: flex;
					justify-content: space-between;
					image {
						width: 20rpx;
						height: 26rpx;
						vertical-align: middle;
						margin-right: 10rpx;
					}
					view:last-child {
						color: #058fff;
					}
				}
			}
		}
		
		/* 公司介绍 */
		&-introduce {
			width: calc(100% - 60rpx);
			margin: 20rpx auto 0;
			background-color: #fff;
			border-radius: 10rpx;
			padding: 28rpx 33rpx;
			text-align: left;
			.title {
				color: #000;
				font-size: 32rpx;
				font-weight: 400;
				margin-bottom: 10rpx;
			}
			.content {
				font-size: 24rpx;
				color: #545454;
				line-height: 40rpx;
			}
		}
		
		/* 公司相册 */
		&-album {
			width: calc(100% - 60rpx);
			margin: 20rpx auto 0;
			background-color: #fff;
			border-radius: 10rpx;
			padding: 28rpx 33rpx;
			text-align: left;
			.title {
				color: #000;
				font-size: 32rpx;
				font-weight: 400;
				margin-bottom: 20rpx;
			}
			.pic-list {
				// display: flex;
				// justify-content: space-between;
				// flex-wrap: nowrap;
				&-item {
					width: calc(50% - 8rpx);
					margin-bottom: 8rpx;
					display: inline-block;
					margin-right: 10rpx;
					.image {
						width: 100%;
						height: 206rpx;
						border-radius: 5rpx;
					}
				}
			}
		}
		
		/* 公司职位 */
		&-position {
			width: calc(100% - 60rpx);
			margin: 20rpx auto 0;
			background-color: #fff;
			border-radius: 10rpx;
			padding: 28rpx 33rpx;
			text-align: left;
			.title {
				color: #000;
				font-size: 32rpx;
				font-weight: 400;
				margin-bottom: 16rpx;
				border-bottom: solid 1px #9F9F9F;
				padding-bottom: 20rpx;
			}
			.position-list {
				&-item {
					display: flex;
					justify-content: space-between;
					padding: 32rpx 0;
					margin-bottom: 8rpx;
					.left {
						display: flex;
						.logo {
							width: 112rpx;
							height: 112rpx;
							line-height: 112rpx;
							text-align: center;
							margin-right: 20rpx;
							border: solid 1px #f2f2f2;
							border-radius: 10rpx;
							image {
								width: 98%;
								height: 98%;
							}
						}
						.info {
							view {
								font-size: 26rpx;
								color: #9B9B9B;
								line-height: 40rpx;
								&:first-child {
									color: #000;
									font-size: 30rpx;
								}
							}
						}
					}
					.right {
						display: flex;
						flex-direction: column;
						view {
							font-size: 24rpx;
							text-align: right;
							color: #BCBCBC;
							&:first-child {
								flex: 1;
								color: #EE5A10;
								font-weight: 500;
							}
						}
					}
				}
			}
		}
	}
}