.button() {
  height: 28px;
  border-radius: 8px;
  border: 1px solid #787EFF;
  font-size: 14px;
  font-weight: 400;
  color: #787EFF;
  line-height: 16px;
  &:first-child {
	margin-right: 8px;
  }
}
.card-container() {
  margin: 0 16px 10px;
  padding: 20px;
  background: #FFFFFF;
  box-shadow: 0px 5px 25px 0px rgba(0,0,0,0.07);
  border-radius: 14px;
}
.card-title(@marginBottom) {
  margin-bottom: @marginBottom;
  font-size: 18px;
  font-weight: 600;
  color: #242629;
  line-height: 24px;
}
.card-desc(@marginBottom, @lineHeight: 16px) {
  margin-bottom: @marginBottom;
  font-size: 12px;
  font-weight: 400;
  color: #999999;
  line-height: @lineHeight;
}
.card-head() {
  display: flex;
  justify-content: space-between;
  margin-bottom: 16px;
  span:first-child {
	font-size: 18px;
	font-weight: 600;
	color: #242629;
	line-height: 24px;
  }
  span:last-child {
	font-size: 12px;
    font-weight: 400;
    color: #787EFF;
    line-height: 24px;
  }
  .svg-icon {
  	padding: 4px 0;
  	width: 16px;
  	height: 16px;
  }
}
.card-body(@marginBottom: 0) {
  margin-bottom: @marginBottom;
  div {
    display: flex;
    justify-content: space-between;
  	span:first-child {
  	  font-size: 12px;
	  font-weight: 400;
	  color: #666666;
	  line-height: 24px;
  	}
	span:last-child {
  	  font-size: 12px;
	  font-weight: 600;
	  color: #333333;
	  line-height: 24px;
  	}
  }
}
.policy-detail {
  position: relative;
  background: #F6F6F6;
  &:before {
  	position: absolute;
  	width: 375px;
    height: 269px;
    border: 0;
  	content: '';
  	background: linear-gradient(360deg,rgba(244,244,244,1) 0%,rgba(255,200,66,1) 100%);
  }
  &:after {
  	position: absolute;
  	top: 38px;
  	right: 0;
  	width: 36px;
  	height: 19px;
  	content: '';
  	background: url('../../../assets/images/policy/detail/point@2x.png') no-repeat 0 0 /cover;
  }

  &-body {
  	position: absolute;
  	left: 0;
  	right: 0;
  	// padding-bottom: 49px;
	.Pdb-status {
	  margin: 0 0 5px 20px;
	  font-size: 28px;
	  font-weight: 600;
	  color: #333333;
	  line-height: 40px;
	  &:first-child {
	  	margin: 32px 0 0 20px;
	  }
	}
	.Pdb-tips {
	  display: flex;
	  align-items: center;
	  justify-content: center;
	  margin: 0 0 24px 20px;
	  padding-left: 4px;
	  width: 73px;
	  height: 20px;
	  background: #000000;
	  border-radius: 8px;
	  opacity: 0.2;
	  &-text {
	  	margin-right: 1px;
		font-size: 12px;
		font-weight: 400;
		color: #FFFFFF;
		line-height: 12px;
	  }
	  &-svg {
	  	width: 12px;
	  	height: 12px;
	  }
	}
	.Pdb-refund {
	  .card-container();
	  margin: 27px 16px 10px;
	  &-title {
		.card-title(8px);
	  }
	  &-desc {
		.card-desc(24px);
	  }
	  &-content {
	  	.Pdbr-content-item {
	  	  display: flex;
	  	  align-items: center;
	  	  justify-content: space-between;
	  	  padding: 0 16px;
		  height: 50px;
		  background: #F6F7FA;
		  border-radius: 8px;
		  &:first-child {
		  	margin-bottom: 12px;
		  }
		  span:first-child {
		  	font-size: 14px;
			font-weight: 400;
			color: #666666;
			line-height: 24px;
		  }
		  span:last-child {
		  	font-size: 14px;
			font-weight: 500;
			color: #333333;
			line-height: 24px;
		  }
	  	}
	  }
	}
	.Pdb-payment {
	  .card-container();
	  &-title {
		.card-title(16px);
	  }
	  &-content {
	  	margin-bottom: 17px;
	  	.Pdbp-content-item {
	  	  display: flex;
	  	  align-items: center;
		  .Pdbpc-item-svg {
		  	margin-right: 8px;
			width: 12px;
			height: 12px;
			border-radius: 50%;
			background: #FFC842;
		  }
		  .Pdbpc-item-text {
		  	.card-desc(0, 24px);
		   }
	  	}
	  }
	  &-button {
	  	width: 100%;
		height: 52px;
		background: #FFC842;
		border-radius: 14px;
		font-size: 16px;
		font-weight: 600;
		color: #333333;
		line-height: 22px;
	  }
	}
	.Pdb-insurance {
	  .card-container();
	  &-name {
	  	.card-title(12px);
	  }
	  &-no {
	  	.card-desc(16px);
	  }
	  &-operation {
	  	.Pdbi-operation-button { .button }
	  }
	}
	.Pdb-content {
	  .card-container();
	  &-head {
	  	.card-head
	  }
	  &-body {
	  	.card-body(8px);
	  }
	  &-operation {
	  	.Pdbc-button { .button }
	  }
	  &-user {
	  	margin-top: 24px;
	  	.Pdbc-user-who {
		  .card-title(16px);
	  	}
	  	.Pdbc-user-info {
	  	  display: flex;
	  	  justify-content: space-around;
	  	  align-items: center;
		  width: 100%;
		  height: 50px;
		  background: #F6F7FA;
		  border-radius: 14px;
		  span:first-child {
			font-size: 14px;
			font-weight: 500;
			color: #333333;
			line-height: 24px;
		  }
		  span:last-child {
		  	font-size: 14px;
			font-weight: 400;
			color: #666666;
			line-height: 24px;
		  }
	  	}
	  }
	}
	.Pdb-service {
	  .card-container();
	  margin: 0 16px 16px;
	  padding: 20px 20px 11px;
  	  &-head {
	    .card-head();
      }
  	  &-body {
	    .card-body();
  	  }
  	  &-question {
  	    margin-top: 24px;
  	    .card-head();
  	  }
  	  &-divider {
  	    margin: 0 0 12px 0;
  	    &:before {
  	  	  height: 1px;
  	  	  border-color: #EBEBEB;
  	    }
  	  }
  	  &-agreement {
  	    display: flex;
        justify-content: space-between;
	    font-size: 0;
	    span {
		  font-size: 12px;
		  font-weight: 400;
		  color: #333333;
		  line-height: 24px;
	    }
  	  }
	}
	.Pdb-operation {
	  display: flex;
	  justify-content: space-around;
	  margin-bottom: 14px;
	  &-item {
	  	display: flex;
	    justify-content: space-between;
	  	align-items: center;
	  	width: 84px;
	    .Pdbo-item-svg {
	      width: 16px;
	      height: 16px;
	    }
	    .Pdbo-item-text {
	      font-size: 14px;
		  font-weight: 400;
		  color: #999999;
		  line-height: 20px;
	    }
	  }
	}
	.Pdb-footer {
	  display: flex;
	  flex-direction: column;
	  align-items: center;
	  margin: 231px 0 20px;
	  span:first-child {
	  	margin-bottom: 2px;
	  	font-size: 11px;
		font-weight: 400;
		color: #999999;
		line-height: 16px;
	  }
	  span:last-child {
	  	font-size: 20px;
		font-weight: 600;
		color: #666666;
		line-height: 28px;
	  }
	}
	.Pdb-recommend {
	  margin-bottom: 49px;
	}
  }
}