/* ==================================================
	feature
================================================== */
#feature_wrap {
	padding: 2rem 1.6rem;
}
#feature {
	margin-top: 2rem;
}
#feature .experiencefragment {
	padding: 1rem;
	margin-right: 1rem;
	background: #f2f2f2;
}
#feature .hpj-freeHTML > div > div {
	display: flex;
	justify-content: space-between;
}
#feature .hpj-freeHTML > div > div > a {
	display: flex;
	justify-content: space-between;
	width: 100%;
}
#feature .hpj-freeHTML > div > div > a:hover {
	text-decoration: none;
}
.feature_img {
	width: 106px;
	height: 106px;
}
.feature_text {
	width: calc(100% - 116px);
}
.feature_text h3 {
	color: #0096d6;
	font-size: 1.4rem;
	font-weight: normal;
	line-height: 1.4;
}
.feature_text h3 ~ * {
	margin-top: .5rem;
}
.feature_text p {
	color: #5a5a5a;
	font-size: 1.2rem;
}
.feature_text p.feature_link {
	color: #0096d6;
}

@media screen and (min-width: 768px) {
	#feature_wrap {
		padding: 40px 20px;
	}
	#feature .experiencefragment:nth-child(n+2) {
		margin-top: 0;
	}
}

@media screen and (min-width: 1024px) {
	#feature_wrap {
		padding: 40px 0;
	}
	
	#feature {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	#feature .experiencefragment {
		width: calc((100% - 15px) / 2);
		margin-right: 0;
	}
	#feature .experiencefragment:nth-child(n+3) {
	margin-top: 1.5rem;
}
	.feature_text h3 {
		font-size: 16px;
	}
}